@soyfri/shared-library 2.0.0-beta.9 → 2.0.0

package/components/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/Select/Select.sx.ts","../../../src/components/Select/Select.helpers.ts","../../../src/components/Select/_parts/SelectSearchHeader.tsx","../../../src/components/Select/_parts/SelectValue.tsx","../../../src/components/Select/_parts/SelectMenuItem.tsx","../../../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n  borderRadius: number | string,\n  labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n  buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Filtra opciones por `label` (case-insensitive). Si `search` es vacío,\n * devuelve el array completo. Solo se usa en modo no-async.\n */\nexport const filterOptionsByLabel = (\n  options: SelectOption[],\n  search: string,\n): SelectOption[] => {\n  if (!search) return options;\n  const needle = search.toLowerCase();\n  return options.filter((opt) => opt.label.toLowerCase().includes(needle));\n};\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n  options: SelectOption[],\n): Record<string, SelectOption[]> => {\n  const groups: Record<string, SelectOption[]> = {};\n  options.forEach((opt) => {\n    const group = opt.group || '__default';\n    if (!groups[group]) groups[group] = [];\n    groups[group].push(opt);\n  });\n  return groups;\n};\n\n/**\n * Determina si un conjunto de grupos está efectivamente vacío\n * (no hay grupos o solo existe `__default` sin items).\n */\nexport const isGroupedOptionsEmpty = (\n  groups: Record<string, SelectOption[]>,\n): boolean => {\n  const keys = Object.keys(groups);\n  if (keys.length === 0) return true;\n  if (keys.length === 1 && groups['__default'] && groups['__default'].length === 0) {\n    return true;\n  }\n  return false;\n};\n\n/**\n * Normaliza el valor actual al shape que espera el MUI Select:\n * - multiple: siempre array (aunque esté vacío).\n * - single:   string vacío si null/undefined.\n */\nexport const normalizeSelectValue = <T>(\n  value: T | T[] | null | undefined,\n  multiple: boolean,\n): T | T[] | '' => {\n  if (multiple) return (value ?? []) as T[];\n  return (value ?? '') as T | '';\n};\n\n/**\n * Evalúa si el valor actual está vacío (para decidir shrink del label\n * y visibilidad del placeholder).\n */\nexport const isSelectValueEmpty = (\n  normalizedValue: unknown,\n  multiple: boolean,\n): boolean => {\n  if (multiple) return Array.isArray(normalizedValue) && normalizedValue.length === 0;\n  return normalizedValue === '' || normalizedValue === null || normalizedValue === undefined;\n};\n","import React from 'react';\nimport { ListSubheader, TextField } from '@mui/material';\n\ninterface SelectSearchHeaderProps {\n  value: string;\n  onChange: (next: string) => void;\n  placeholder?: string;\n  inputRef?: React.Ref<HTMLInputElement>;\n}\n\n/**\n * Header sticky del menu del Select que contiene el input de búsqueda.\n * Se usa cuando `filterable` es true o cuando el Select opera en modo async.\n * Detiene la propagación de click/keydown para que el menu no se cierre ni\n * intercepte las teclas al tipear.\n */\nexport const SelectSearchHeader: React.FC<SelectSearchHeaderProps> = ({\n  value,\n  onChange,\n  placeholder = 'Buscar...',\n  inputRef,\n}) => {\n  return (\n    <ListSubheader\n      sx={{\n        px: 2,\n        pt: 1,\n        pb: 1,\n        backgroundColor: 'background.paper',\n        zIndex: 1,\n        position: 'sticky',\n        top: 0,\n      }}\n    >\n      <TextField\n        inputRef={inputRef}\n        placeholder={placeholder}\n        variant=\"standard\"\n        size=\"small\"\n        fullWidth\n        value={value}\n        onChange={(e) => onChange(e.target.value)}\n        slotProps={{ htmlInput: { autoFocus: true } }}\n        onClick={(e) => e.stopPropagation()}\n        onKeyDown={(e) => e.stopPropagation()}\n      />\n    </ListSubheader>\n  );\n};\n\nexport default SelectSearchHeader;\n","import React from 'react';\nimport { Avatar, Box, Chip, Typography } from '@mui/material';\nimport ClearIcon from '@mui/icons-material/Clear';\n\nimport type {\n  SelectOption,\n  RenderChipLabel,\n  ChipVariant,\n} from '../Select';\n\ninterface SelectValueProps<TValue extends SelectOption['value']> {\n  selected: TValue | TValue[] | null | undefined;\n  options: SelectOption[];\n  multiple: boolean;\n  placeholder?: string;\n  maxChipsToShow: number;\n  chipVariant: ChipVariant;\n  renderChipLabel?: RenderChipLabel;\n  /** Solo relevante en modo multiple. Recibe el nuevo array de valores. */\n  onDeleteChip?: (nextValues: TValue[]) => void;\n  /** Array de valores actuales (para componer el nuevo array al borrar chips). */\n  currentValues?: TValue[];\n}\n\n/**\n * Render del valor seleccionado del Select.\n * - single:   texto (label) o lo que devuelva `renderChipLabel`.\n * - multiple: chips con delete. Trunca después de `maxChipsToShow` mostrando \"+N más\".\n * - empty:    placeholder en color disabled.\n */\nexport function SelectValue<TValue extends SelectOption['value']>(\n  props: SelectValueProps<TValue>,\n) {\n  const {\n    selected,\n    options,\n    multiple,\n    placeholder,\n    maxChipsToShow,\n    chipVariant,\n    renderChipLabel,\n    onDeleteChip,\n    currentValues,\n  } = props;\n\n  const isEmpty =\n    !selected || (Array.isArray(selected) && selected.length === 0);\n\n  if (isEmpty) {\n    return (\n      <Typography sx={{ color: 'text.disabled' }}>{placeholder || ''}</Typography>\n    );\n  }\n\n  if (!multiple) {\n    const item = options.find((opt) => opt.value === selected);\n    if (renderChipLabel && item) return <>{renderChipLabel(item)}</>;\n    return <>{item?.label ?? String(selected)}</>;\n  }\n\n  const selectedValuesArray = selected as TValue[];\n  const displayedChips = selectedValuesArray.slice(0, maxChipsToShow);\n  const hiddenChipsCount = selectedValuesArray.length - maxChipsToShow;\n\n  const handleDelete = (chipValue: TValue) => {\n    if (!onDeleteChip || !currentValues) return;\n    onDeleteChip(currentValues.filter((v) => v !== chipValue));\n  };\n\n  return (\n    <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>\n      {displayedChips.map((val) => {\n        const item = options.find((o) => o.value === val);\n        if (!item) return null;\n\n        return (\n          <Chip\n            variant={chipVariant}\n            color=\"primary\"\n            size=\"small\"\n            key={String(val)}\n            label={renderChipLabel ? renderChipLabel(item) : item.label}\n            avatar={item.img ? <Avatar src={item.img} /> : undefined}\n            onDelete={() => handleDelete(val)}\n            deleteIcon={<ClearIcon fontSize=\"small\" />}\n          />\n        );\n      })}\n      {hiddenChipsCount > 0 && (\n        <Chip size=\"small\" variant={chipVariant} label={`+${hiddenChipsCount} más`} />\n      )}\n    </Box>\n  );\n}\n\nexport default SelectValue;\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n  option: SelectOption;\n  selected: boolean;\n  customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n  option,\n  selected,\n  customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n  <MenuItem\n    key={String(option.value)}\n    value={option.value}\n    disabled={option.disabled}\n    selected={selected}\n  >\n    <ListItemIcon sx={{ minWidth: 32 }}>\n      {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n    </ListItemIcon>\n    {customRender ? customRender(option) : option.label}\n  </MenuItem>\n);\n","import React, {\n    isValidElement,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    type ReactElement,\n    type ReactNode,\n} from 'react';\nimport {\n    Box,\n    CircularProgress,\n    FormControl,\n    FormHelperText,\n    InputLabel,\n    ListSubheader,\n    MenuItem,\n    OutlinedInput,\n    Select as MuiSelect,\n    SelectChangeEvent,\n    Typography,\n    type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n    filterOptionsByLabel,\n    groupOptions,\n    isGroupedOptionsEmpty,\n    isSelectValueEmpty,\n    normalizeSelectValue,\n} from './Select.helpers';\nimport { SelectSearchHeader } from './_parts/SelectSearchHeader';\nimport { SelectValue } from './_parts/SelectValue';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n    value: string | number;\n    label: string;\n    img?: string;\n    disabled?: boolean;\n    group?: string;\n    [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type ChipVariant = 'outlined' | 'filled';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\nexport type RenderChipLabel = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n    children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n    TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n    label?: string;\n    options?: SelectOption[];\n    defaultValue?: TValue | TValue[];\n    size?: SelectSize;\n    multiple?: boolean;\n    filterable?: boolean;\n    placeholder?: string;\n    children?: ReactElement<{ children: RenderOptionItem }>;\n    maxHeight?: number | string;\n    maxWidth?: number | string;\n    maxChipsToShow?: number;\n    renderChipLabel?: RenderChipLabel;\n    chipVariant?: ChipVariant;\n    loadOptions?: (inputValue: string) => Promise<SelectOption[]>;\n    loadingMessage?: ReactNode;\n    noOptionsMessage?: ReactNode;\n    debounceTimeout?: number;\n    disabled?: boolean;\n    error?: boolean;\n    helperText?: string;\n    /** Border radius del input (px o string CSS). Default: 10 */\n    borderRadius?: number | string;\n    /**\n     * Posición del label.\n     * - \"outside\" (default): label arriba del input, sin animación.\n     * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n     */\n    labelPosition?: LabelPosition;\n    /**\n     * Nombre del preset de estilo registrado en `theme.styles.Select`.\n     * - `\"default\"` (o ausente) = estilo built-in del paquete.\n     * - Cualquier otro string = mergea el preset encima del estilo built-in.\n     */\n    preset?: string;\n    sx?: MuiSelectProps['sx'];\n    className?: string;\n}\n\n// ── Variantes discriminadas (RHF vs controlado) ──────────────────────────\nexport interface RHFSelectProps<\n    TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n    name: string;\n    control: Control<any>;\n    validation?: RegisterOptions;\n    value?: TValue | TValue[];\n    onChange?: (val: TValue | TValue[]) => void;\n}\n\nexport interface StandardSelectProps<\n    TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n    name?: string;\n    control?: never;\n    validation?: never;\n    value: TValue | TValue[];\n    onChange: (val: TValue | TValue[]) => void;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n    TValue extends SelectOption['value'] = SelectOption['value'],\n> = RHFSelectProps<TValue> | StandardSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n    return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<TValue extends SelectOption['value'] = SelectOption['value']>(\n    props: SelectProps<TValue>,\n) {\n    const {\n        label,\n        options = [],\n        value,\n        onChange,\n        defaultValue,\n        size = 'small',\n        multiple = false,\n        filterable = false,\n        placeholder,\n        children,\n        maxHeight = 300,\n        maxWidth,\n        maxChipsToShow = 3,\n        renderChipLabel,\n        chipVariant = 'outlined',\n        loadOptions,\n        loadingMessage = 'Cargando opciones...',\n        noOptionsMessage = 'No hay opciones',\n        debounceTimeout = 300,\n        disabled = false,\n        error = false,\n        helperText,\n        borderRadius = 10,\n        labelPosition = 'outside',\n        preset,\n        sx,\n        className,\n        ...rest\n    } = props;\n\n    const theme = useTheme();\n    const presetSx = resolvePreset('Select', preset, theme);\n\n    const isRHFMode = 'control' in rest && (rest as any).control !== undefined;\n\n    // Custom render opcional vía <Option>{item => ...}</Option>\n    const customRender: RenderOptionItem | null = useMemo(() => {\n        if (React.Children.count(children) === 1) {\n            const child = React.Children.only(children);\n            if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n                return (child.props as OptionProps).children;\n            }\n        }\n        return null;\n    }, [children]);\n\n    // Búsqueda / async\n    const [search, setSearch] = useState('');\n    const [asyncOptions, setAsyncOptions] = useState<SelectOption[]>([]);\n    const [loading, setLoading] = useState(false);\n    const debounceTimerRef = useRef<number | null>(null);\n    const searchInputRef = useRef<HTMLInputElement>(null);\n\n    // Focus/open tracking para el comportamiento del label \"outside\".\n    const [isOpen, setIsOpen] = useState(false);\n    const [isFocused, setIsFocused] = useState(false);\n\n    const isAsync = typeof loadOptions === 'function';\n    const currentOptions = isAsync ? asyncOptions : options;\n\n    useEffect(() => {\n        if (!isAsync) return;\n\n        if (debounceTimerRef.current) clearTimeout(debounceTimerRef.current);\n\n        if (search) {\n            setLoading(true);\n            debounceTimerRef.current = window.setTimeout(() => {\n                loadOptions!(search)\n                    .then(setAsyncOptions)\n                    .finally(() => {\n                        setLoading(false);\n                        searchInputRef.current?.focus();\n                    });\n            }, debounceTimeout);\n        } else {\n            setAsyncOptions([]);\n            setLoading(false);\n            searchInputRef.current?.focus();\n        }\n    }, [search, isAsync, loadOptions, debounceTimeout]);\n\n    const filteredOptions = useMemo(() => {\n        if (isAsync) return currentOptions;\n        if (!filterable) return currentOptions;\n        return filterOptionsByLabel(currentOptions, search);\n    }, [search, filterable, currentOptions, isAsync]);\n\n    const groupedOptions = useMemo(() => groupOptions(filteredOptions), [filteredOptions]);\n\n    // Items del menu (search header + loading/empty + grupos + opciones)\n    const menuItems = useMemo(() => {\n        const items: React.ReactNode[] = [];\n\n        if (filterable || isAsync) {\n            items.push(\n                <SelectSearchHeader\n                    key=\"search-header\"\n                    value={search}\n                    onChange={setSearch}\n                    inputRef={searchInputRef}\n                />,\n            );\n        }\n\n        const noOptions = isGroupedOptionsEmpty(groupedOptions);\n\n        if (loading) {\n            items.push(\n                <MenuItem key=\"loading-message\" disabled>\n                    <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n                        <CircularProgress size={20} />\n                        <Typography>{loadingMessage}</Typography>\n                    </Box>\n                </MenuItem>,\n            );\n        } else if (noOptions) {\n            items.push(\n                <MenuItem key=\"no-options-message\" disabled>\n                    <Typography>{noOptionsMessage}</Typography>\n                </MenuItem>,\n            );\n        } else {\n            Object.entries(groupedOptions).forEach(([group, opts]) => {\n                if (group !== '__default') {\n                    items.push(\n                        <ListSubheader key={group} disableSticky>\n                            {group}\n                        </ListSubheader>,\n                    );\n                }\n                opts.forEach((opt) => {\n                    const isSelected = multiple\n                        ? (value as TValue[] | undefined)?.includes(opt.value as TValue) ?? false\n                        : value === opt.value;\n\n                    items.push(\n                        renderSelectMenuItem({\n                            option: opt,\n                            selected: isSelected,\n                            customRender,\n                        }),\n                    );\n                });\n            });\n        }\n        return items;\n    }, [\n        groupedOptions,\n        customRender,\n        filterable,\n        isAsync,\n        search,\n        loading,\n        loadingMessage,\n        noOptionsMessage,\n        multiple,\n        value,\n    ]);\n\n    // Handler de cambio\n    const handleChangeInternal = (\n        event: SelectChangeEvent<any>,\n        rhfOnChange?: (...event: any[]) => void,\n    ) => {\n        const newValue = event.target.value;\n        if (isRHFMode) {\n            rhfOnChange?.(newValue);\n        } else {\n            (onChange as (val: TValue | TValue[]) => void)?.(newValue);\n        }\n    };\n\n    // Sx mergeado (defaults + consumer)\n    const mergedSx = [\n        buildSelectSx(borderRadius, labelPosition),\n        ...(presetSx ? [presetSx] : []),\n        ...(Array.isArray(sx) ? sx : [sx]),\n    ];\n\n    // Render base\n    const renderSelect = (\n        selectValue: any,\n        selectOnChange: any,\n        onBlur?: any,\n        inputRef?: any,\n        rhfError?: boolean,\n        rhfHelperText?: string,\n    ) => {\n        const finalError = rhfError ?? error;\n        const finalHelperText = rhfHelperText ?? helperText;\n\n        const inputElement =\n            labelPosition === 'floating' ? (\n                <OutlinedInput label={label} />\n            ) : (\n                <OutlinedInput />\n            );\n\n        const normalizedValue = normalizeSelectValue(selectValue, multiple);\n        const isEmpty = isSelectValueEmpty(normalizedValue, multiple);\n\n        // Shrink cuando hay valor, foco, o dropdown abierto.\n        const shouldShrink = !isEmpty || isFocused || isOpen;\n        // Placeholder solo cuando el label ya subió.\n        const shouldDisplayPlaceholder = isEmpty && (isFocused || isOpen) && !!placeholder;\n\n        return (\n            <FormControl\n                fullWidth\n                size={size}\n                error={finalError}\n                disabled={disabled}\n                className={className}\n                sx={mergedSx}\n            >\n                {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n                <MuiSelect\n                    value={normalizedValue}\n                    defaultValue={defaultValue}\n                    multiple={multiple}\n                    onChange={selectOnChange}\n                    onBlur={(e) => {\n                        setIsFocused(false);\n                        onBlur?.(e);\n                    }}\n                    onFocus={() => setIsFocused(true)}\n                    onOpen={() => setIsOpen(true)}\n                    onClose={() => setIsOpen(false)}\n                    renderValue={(selected) => (\n                        <SelectValue<TValue>\n                            selected={selected as TValue | TValue[]}\n                            options={currentOptions}\n                            multiple={multiple}\n                            placeholder={placeholder}\n                            maxChipsToShow={maxChipsToShow}\n                            chipVariant={chipVariant}\n                            renderChipLabel={renderChipLabel}\n                            currentValues={(value as TValue[]) ?? []}\n                            onDeleteChip={(next) =>\n                                (onChange as (v: TValue | TValue[]) => void)?.(next)\n                            }\n                        />\n                    )}\n                    displayEmpty={shouldDisplayPlaceholder}\n                    input={inputElement}\n                    disabled={disabled}\n                    MenuProps={{\n                        PaperProps: {\n                            style: { maxHeight, maxWidth },\n                        },\n                    }}\n                    inputRef={inputRef}\n                    {...(rest as any)}\n                >\n                    {menuItems}\n                </MuiSelect>\n                {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n            </FormControl>\n        );\n    };\n\n    // Branch: RHF vs controlado\n    if (isRHFMode) {\n        const rhfProps = rest as RHFSelectProps<TValue>;\n        return (\n            <Controller\n                name={rhfProps.name}\n                control={rhfProps.control}\n                rules={rhfProps.validation}\n                render={({ field, fieldState: { error: fieldError } }) =>\n                    renderSelect(\n                        field.value,\n                        (e: SelectChangeEvent<any>) => handleChangeInternal(e, field.onChange),\n                        field.onBlur,\n                        field.ref,\n                        !!fieldError,\n                        fieldError?.message,\n                    )\n                }\n            />\n        );\n    }\n\n    return renderSelect(value, (e: SelectChangeEvent<any>) => handleChangeInternal(e));\n}\n\nexport default Select;\n"],"names":["React","_a","MuiSelect"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../src/components/Select/Select.sx.ts","../../../src/components/Select/Select.helpers.ts","../../../src/components/Select/_parts/SelectMenuItem.tsx","../../../src/components/Select/Select.tsx"],"sourcesContent":["import type { SelectProps as MuiSelectProps } from '@mui/material';\n\nimport { buildFormFieldSx } from '../_shared/formField.sx';\nimport type { LabelPosition } from './Select';\n\n/**\n * Builder de sx para el Select. Usa el builder compartido\n * `buildFormFieldSx`. El Select no necesita overrides específicos.\n */\nexport const buildSelectSx = (\n  borderRadius: number | string,\n  labelPosition: LabelPosition,\n): MuiSelectProps['sx'] =>\n  buildFormFieldSx({ borderRadius, labelPosition }) as MuiSelectProps['sx'];\n","import type { SelectOption } from './Select';\n\n/**\n * Agrupa opciones por la propiedad `group`. Las opciones sin group caen\n * bajo la key especial `__default`. Devuelve un Record para iterar en orden\n * de inserción con Object.entries.\n */\nexport const groupOptions = (\n  options: SelectOption[],\n): Record<string, SelectOption[]> => {\n  const groups: Record<string, SelectOption[]> = {};\n  options.forEach((opt) => {\n    const group = opt.group || '__default';\n    if (!groups[group]) groups[group] = [];\n    groups[group].push(opt);\n  });\n  return groups;\n};\n\n/**\n * Normaliza el valor single al shape que espera MUI Select: string vacío si\n * el valor es `null`/`undefined`.\n */\nexport const normalizeSelectValue = <T>(value: T | null | undefined): T | '' =>\n  (value ?? '') as T | '';\n\n/** `true` si el valor está vacío (para shrink del label + placeholder). En\n *  multi se considera vacío cuando el array no tiene elementos. */\nexport const isSelectValueEmpty = (normalizedValue: unknown): boolean => {\n  if (Array.isArray(normalizedValue)) return normalizedValue.length === 0;\n  return (\n    normalizedValue === '' ||\n    normalizedValue === null ||\n    normalizedValue === undefined\n  );\n};\n","import React from 'react';\nimport { ListItemIcon, MenuItem } from '@mui/material';\nimport CheckIcon from '@mui/icons-material/Check';\n\nimport type { SelectOption, RenderOptionItem } from '../Select';\n\ninterface RenderSelectMenuItemArgs {\n  option: SelectOption;\n  selected: boolean;\n  customRender?: RenderOptionItem | null;\n}\n\n/**\n * Render helper (no componente) que devuelve un <MenuItem> listo para\n * colocarse como hijo directo del <MuiSelect>. Se implementa como función\n * y no como componente porque MUI Select inspecciona `props.value` de sus\n * children para resolver la selección, y envolverlo en un componente extra\n * rompe esa detección.\n *\n * Incluye el icono de check a la izquierda cuando `selected` es true. Si el\n * consumer pasó un `<Option>{(opt) => ...}</Option>`, usa ese render para el\n * contenido principal; de lo contrario muestra `option.label`.\n */\nexport const renderSelectMenuItem = ({\n  option,\n  selected,\n  customRender,\n}: RenderSelectMenuItemArgs): React.ReactElement => (\n  <MenuItem\n    key={String(option.value)}\n    value={option.value}\n    disabled={option.disabled}\n    selected={selected}\n  >\n    <ListItemIcon sx={{ minWidth: 32 }}>\n      {selected && <CheckIcon color=\"success\" fontSize=\"small\" />}\n    </ListItemIcon>\n    {customRender ? customRender(option) : option.label}\n  </MenuItem>\n);\n","import {\n  Children,\n  isValidElement,\n  useMemo,\n  useState,\n  type ReactElement,\n  type ReactNode,\n} from 'react';\nimport {\n  Avatar,\n  Box,\n  Chip,\n  FormControl,\n  FormHelperText,\n  InputLabel,\n  ListSubheader,\n  OutlinedInput,\n  Select as MuiSelect,\n  Typography,\n  type SelectChangeEvent,\n  type SelectProps as MuiSelectProps,\n} from '@mui/material';\nimport { useTheme } from '@mui/material/styles';\nimport { Controller, type Control, type RegisterOptions } from 'react-hook-form';\n\nimport { buildSelectSx } from './Select.sx';\nimport { resolvePreset } from '../_shared/resolvePreset';\nimport {\n  groupOptions,\n  isSelectValueEmpty,\n  normalizeSelectValue,\n} from './Select.helpers';\nimport { renderSelectMenuItem } from './_parts/SelectMenuItem';\n\n// ── Tipos de dominio ─────────────────────────────────────────────────────\nexport interface SelectOption {\n  value: string | number;\n  label: string;\n  img?: string;\n  disabled?: boolean;\n  group?: string;\n  [key: string]: any;\n}\n\nexport type LabelPosition = 'outside' | 'floating';\nexport type SelectSize = 'small' | 'medium';\n\n// ── Render slots ─────────────────────────────────────────────────────────\nexport type RenderOptionItem = (item: SelectOption) => ReactNode;\nexport type RenderChipLabel = (item: SelectOption) => ReactNode;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport interface OptionProps {\n  children: RenderOptionItem;\n}\n\n// ── Props base ───────────────────────────────────────────────────────────\nexport interface BaseSelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> {\n  label?: string;\n  options?: SelectOption[];\n  defaultValue?: TValue | TValue[];\n  size?: SelectSize;\n  placeholder?: string;\n  children?: ReactElement<{ children: RenderOptionItem }>;\n  maxHeight?: number | string;\n  maxWidth?: number | string;\n  disabled?: boolean;\n  error?: boolean;\n  helperText?: string;\n  /** Border radius del input (px o string CSS). Default: 10 */\n  borderRadius?: number | string;\n  /**\n   * Posición del label.\n   * - \"outside\" (default): label arriba del input, sin animación.\n   * - \"floating\": label clásico de MUI (flota dentro del notched outline).\n   */\n  labelPosition?: LabelPosition;\n  /**\n   * Nombre del preset de estilo registrado en `theme.styles.Select`.\n   * - `\"default\"` (o ausente) = estilo built-in del paquete.\n   * - Cualquier otro string = mergea el preset encima del estilo built-in.\n   */\n  preset?: string;\n  sx?: MuiSelectProps['sx'];\n  className?: string;\n  // ── Props que solo aplican en modo `multiple` ──────────────────────────\n  /** Cantidad máxima de chips visibles antes de colapsar al \"+N más\". Default: 3. */\n  maxChipsToShow?: number;\n  /** Custom render del label de cada chip. Si no se pasa, usa `option.label`. */\n  renderChipLabel?: RenderChipLabel;\n  /** Variant de los chips. Default: 'outlined'. */\n  chipVariant?: 'outlined' | 'filled';\n}\n\n// ── Variantes discriminadas (single / multi / RHF) ──────────────────────\nexport interface SingleStandardSelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n  multiple?: false;\n  name?: string;\n  control?: never;\n  validation?: never;\n  value: TValue;\n  onChange: (val: TValue) => void;\n}\n\nexport interface MultipleStandardSelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n  multiple: true;\n  name?: string;\n  control?: never;\n  validation?: never;\n  value: TValue[];\n  onChange: (val: TValue[]) => void;\n}\n\nexport type StandardSelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> =\n  | SingleStandardSelectProps<TValue>\n  | MultipleStandardSelectProps<TValue>;\n\nexport interface RHFSelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> extends BaseSelectProps<TValue> {\n  /** En RHF se acepta como boolean dinámico — `field.value` se trata según\n   *  esto: array si `multiple`, valor único si no. */\n  multiple?: boolean;\n  name: string;\n  // `any` plano (no `Control<any>`): RHF tipa `Control<T>` con generics en\n  // posiciones tanto contravariantes como covariantes (ej. `_subjects.state`).\n  // Cuando el componente tiene generics propios (como `TValue` acá), TS se\n  // confunde narroweando el discriminated union y `Control<any>` no logra\n  // absorber `Control<MyForm>` en la comparación estructural profunda.\n  // El `any` plano elimina ese ruido. RHF adentro sigue teniendo sus tipos\n  // fuertes — solo degradamos la superficie del prop del Select.\n  control: any;\n  validation?: RegisterOptions;\n  /**\n   * Side-effect que corre después de que RHF actualiza el form state.\n   * Útil para cascadas entre campos (ej. reset de municipio al cambiar\n   * departamento). NO reemplaza al handler de RHF.\n   */\n  onValueChange?: (value: TValue | TValue[]) => void;\n  value?: never;\n  onChange?: never;\n}\n\n// ── API pública final ────────────────────────────────────────────────────\nexport type SelectProps<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n> = RHFSelectProps<TValue> | StandardSelectProps<TValue>;\n\n// ── Sub-componente declarativo <Option> ──────────────────────────────────\nexport function Option(_props: OptionProps) {\n  return null;\n}\nOption.displayName = 'Option';\n\n// ── Componente ───────────────────────────────────────────────────────────\nexport function Select<\n  TValue extends SelectOption['value'] = SelectOption['value'],\n>(props: SelectProps<TValue>) {\n  const {\n    label,\n    options = [],\n    defaultValue,\n    size = 'small',\n    placeholder,\n    children,\n    maxHeight = 300,\n    maxWidth,\n    disabled = false,\n    error = false,\n    helperText,\n    borderRadius = 10,\n    labelPosition = 'outside',\n    preset,\n    sx,\n    className,\n    multiple = false,\n    maxChipsToShow = 3,\n    renderChipLabel,\n    chipVariant = 'outlined',\n    // Separamos estos aunque no se usen directamente acá — evita que lleguen\n    // al DOM del MuiSelect via `{...rest}` y generen warnings de React.\n    name: _nameIgnored,\n    control: _controlIgnored,\n    validation: _validationIgnored,\n    value: _valueIgnored,\n    onChange: _onChangeIgnored,\n    onValueChange: _onValueChangeIgnored,\n    ...rest\n  } = props as MultipleStandardSelectProps<TValue> & {\n    name?: string;\n    control?: Control<any>;\n    validation?: RegisterOptions;\n    onValueChange?: (val: TValue | TValue[]) => void;\n  };\n\n  const theme = useTheme();\n  const presetSx = resolvePreset('Select', preset, theme);\n\n  const isRHFMode =\n    'control' in props &&\n    (props as RHFSelectProps<TValue>).control !== undefined;\n\n  // Custom render opcional vía <Option>{item => ...}</Option>\n  const customRender: RenderOptionItem | null = useMemo(() => {\n    if (Children.count(children) === 1) {\n      const child = Children.only(children);\n      if (isValidElement(child) && (child.type as any)?.displayName === 'Option') {\n        return (child.props as OptionProps).children;\n      }\n    }\n    return null;\n  }, [children]);\n\n  // Focus/open tracking para el comportamiento del label \"outside\".\n  const [isOpen, setIsOpen] = useState(false);\n  const [isFocused, setIsFocused] = useState(false);\n\n  const groupedOptions = useMemo(() => groupOptions(options), [options]);\n\n  // Igualdad por valor, soportando single y multi de forma uniforme.\n  const isSelected = (\n    currentValue: TValue | TValue[] | '',\n    val: TValue,\n  ): boolean => {\n    if (Array.isArray(currentValue)) return currentValue.includes(val);\n    return currentValue === val;\n  };\n\n  const buildMenuItems = (currentValue: TValue | TValue[] | '') => {\n    const items: ReactNode[] = [];\n    Object.entries(groupedOptions).forEach(([group, opts]) => {\n      if (group !== '__default') {\n        items.push(\n          <ListSubheader key={group} disableSticky>\n            {group}\n          </ListSubheader>,\n        );\n      }\n      opts.forEach((opt) => {\n        items.push(\n          renderSelectMenuItem({\n            option: opt,\n            selected: isSelected(currentValue, opt.value as TValue),\n            customRender,\n          }),\n        );\n      });\n    });\n    return items;\n  };\n\n  const mergedSx = [\n    buildSelectSx(borderRadius, labelPosition),\n    ...(presetSx ? [presetSx] : []),\n    ...(Array.isArray(sx) ? sx : sx ? [sx] : []),\n  ];\n\n  // Render base (común a RHF y controlled). `commitValue` recibe el valor\n  // ya resuelto (sin event) — lo usamos también para el delete de chips.\n  const renderSelect = (\n    selectValue: TValue | TValue[] | null | undefined,\n    commitValue: (next: TValue | TValue[]) => void,\n    onBlur?: (event: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void,\n    inputRef?: React.Ref<HTMLInputElement>,\n    rhfError?: boolean,\n    rhfHelperText?: string,\n  ) => {\n    const finalError = !!rhfError || !!error;\n    const finalHelperText = rhfHelperText ?? helperText;\n\n    const inputElement =\n      labelPosition === 'floating' ? (\n        <OutlinedInput label={label} />\n      ) : (\n        <OutlinedInput />\n      );\n\n    // Normalizamos según modo: array vacío para multi, '' para single.\n    const normalizedValue: TValue | TValue[] | '' = multiple\n      ? ((selectValue as TValue[] | null | undefined) ?? [])\n      : normalizeSelectValue(selectValue as TValue | null | undefined);\n\n    const isEmpty = isSelectValueEmpty(normalizedValue);\n\n    // Shrink cuando hay valor, foco, o dropdown abierto.\n    const shouldShrink = !isEmpty || isFocused || isOpen;\n    // Placeholder solo cuando el label ya subió.\n    const shouldDisplayPlaceholder =\n      isEmpty && (isFocused || isOpen) && !!placeholder;\n\n    const renderValueFn = (selected: any): ReactNode => {\n      // ── Multi: render de chips con delete ────────────────────────────\n      if (multiple) {\n        const arr = (selected ?? []) as TValue[];\n        if (arr.length === 0) {\n          return (\n            <Typography sx={{ color: 'text.disabled' }}>\n              {placeholder ?? ''}\n            </Typography>\n          );\n        }\n        const visible = arr.slice(0, maxChipsToShow);\n        const hidden = arr.length - visible.length;\n        return (\n          <Box sx={{ display: 'flex', flexWrap: 'wrap', gap: 0.5 }}>\n            {visible.map((val) => {\n              const item = options.find((o) => o.value === val);\n              if (!item) return null;\n              return (\n                <Chip\n                  key={String(val)}\n                  variant={chipVariant}\n                  color=\"primary\"\n                  size={size}\n                  label={\n                    renderChipLabel ? renderChipLabel(item) : item.label\n                  }\n                  avatar={item.img ? <Avatar src={item.img} /> : undefined}\n                  // Evita que el click sobre el chip dispare el open del menú.\n                  onMouseDown={(e) => e.stopPropagation()}\n                  onDelete={() => {\n                    commitValue(arr.filter((v) => v !== val));\n                  }}\n                />\n              );\n            })}\n            {hidden > 0 && (\n              <Chip\n                variant={chipVariant}\n                size={size}\n                label={`+${hidden} más`}\n                onMouseDown={(e) => e.stopPropagation()}\n              />\n            )}\n          </Box>\n        );\n      }\n      // ── Single: igual que el flujo previo ────────────────────────────\n      if (isSelectValueEmpty(selected)) {\n        return (\n          <Typography sx={{ color: 'text.disabled' }}>\n            {placeholder ?? ''}\n          </Typography>\n        );\n      }\n      const item = options.find((opt) => opt.value === selected);\n      return item?.label ?? String(selected);\n    };\n\n    return (\n      <FormControl\n        fullWidth\n        size={size}\n        error={finalError}\n        disabled={disabled}\n        className={className}\n        sx={mergedSx}\n      >\n        {label && <InputLabel shrink={shouldShrink}>{label}</InputLabel>}\n        <MuiSelect\n          multiple={multiple}\n          value={normalizedValue as any}\n          onChange={(e: SelectChangeEvent<TValue | TValue[]>) =>\n            commitValue(e.target.value as TValue | TValue[])\n          }\n          onBlur={(e) => {\n            setIsFocused(false);\n            onBlur?.(e);\n          }}\n          onFocus={() => setIsFocused(true)}\n          onOpen={() => setIsOpen(true)}\n          onClose={() => setIsOpen(false)}\n          renderValue={renderValueFn}\n          displayEmpty={shouldDisplayPlaceholder}\n          input={inputElement}\n          disabled={disabled}\n          MenuProps={{\n            PaperProps: {\n              style: { maxHeight, maxWidth },\n            },\n          }}\n          inputRef={inputRef}\n          {...(rest as any)}\n        >\n          {buildMenuItems(normalizedValue)}\n        </MuiSelect>\n        {finalHelperText && <FormHelperText>{finalHelperText}</FormHelperText>}\n      </FormControl>\n    );\n  };\n\n  // ── RHF mode ──────────────────────────────────────────────────────────\n  if (isRHFMode) {\n    const { name, control, validation, onValueChange } = props as RHFSelectProps<TValue>;\n    return (\n      <Controller\n        name={name}\n        control={control}\n        rules={validation}\n        defaultValue={defaultValue}\n        render={({ field, fieldState: { error: fieldError } }) =>\n          renderSelect(\n            field.value ?? (multiple ? [] : null),\n            (next) => {\n              field.onChange(next);\n              onValueChange?.(next);\n            },\n            field.onBlur,\n            field.ref,\n            !!fieldError,\n            fieldError?.message,\n          )\n        }\n      />\n    );\n  }\n\n  // ── Controlled mode ───────────────────────────────────────────────────\n  const standardProps = props as StandardSelectProps<TValue>;\n  return renderSelect(\n    standardProps.value as TValue | TValue[] | null | undefined,\n    (next) =>\n      (standardProps.onChange as (v: TValue | TValue[]) => void)(next),\n  );\n}\n\nexport default Select;\n"],"names":["_a","item","MuiSelect"],"mappings":"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"}

package/components/Select/index.d.ts

@@ -1,2 +1,2 @@
 export { Select, Option, default } from './Select';
-export type { SelectProps, SelectOption, OptionProps, BaseSelectProps, RHFSelectProps, StandardSelectProps, RenderOptionItem, RenderChipLabel, LabelPosition, ChipVariant, SelectSize, } from './Select.types';
+export type { SelectProps, SelectOption, OptionProps, BaseSelectProps, RHFSelectProps, StandardSelectProps, SingleStandardSelectProps, MultipleStandardSelectProps, RenderOptionItem, RenderChipLabel, LabelPosition, SelectSize, } from './Select';

package/components/Stat/Stat.cjs

@@ -1,6 +1,5 @@
 "use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require('../../styles.css');;/* empty css                      */
+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");
@@ -82,4 +81,5 @@ const Stat = ({
   ] });
 };
 exports.Stat = Stat;
+exports.default = Stat;
 //# sourceMappingURL=Stat.cjs.map

package/components/Stat/Stat.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stat.cjs","sources":["../../../src/components/Stat/Stat.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Chip, Stack, Typography, Box } from '@mui/material';\n\nexport interface StatChip {\n  stat: any;\n  chipColor: string;\n}\n\nexport interface StatProps {\n  stat: any; // Replace 'any' with the actual type of 'stat'\n  stat2?: any; // Replace 'any' with the actual type of'stat2'\n  label: string; // Replace 'any' with the actual type of'label'\n  color?: string;\n  chipColor?: string;\n  chips?: StatChip[]; // Replace 'any' with the actual type of'chips'\n  simple?: boolean;\n  chip?: boolean;\n  chipList?: boolean;\n  children?: React.ReactNode;\n  statDisplay?: (stat: any) => React.ReactNode;\n}\n\nexport const Stat: React.FC<StatProps> = ({\n  stat,\n  stat2,\n  label,\n  color = '#1469B8',\n  chipColor = '#1469B8',\n  chips = [],\n  simple = false,\n  chip = false,\n  chipList = false,\n  children,\n  statDisplay,\n}) => {\n  const selectedTemplate = useMemo(() => {\n    if (simple) return 'simple';\n    if (chip) return 'chip';\n    if (chipList) return 'chipList';\n    return 'default';\n  }, [simple, chip, chipList]);\n\n  const renderStatDisplay = () => {\n    return statDisplay ? statDisplay(stat) : <Typography variant=\"h6\">{stat}</Typography>;\n  };\n\n  return (\n    <>\n      {selectedTemplate === 'default' && (\n        <Box className=\"stat\">\n          <Typography variant=\"h4\" data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          <Box className=\"stat__label\" display=\"flex\" alignItems=\"center\" gap={1}>\n            <Typography variant=\"body1\">{label}</Typography>\n            <Box\n              width={40}\n              height={4}\n              bgcolor={color}\n              data-testid=\"stat-border\"\n              borderRadius={2}\n            />\n          </Box>\n        </Box>\n      )}\n\n      {selectedTemplate === 'simple' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Typography data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          {stat2 && <Typography>{stat2}</Typography>}\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chip' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Chip\n            data-testid=\"chip-template-option-outlet\"\n            label={renderStatDisplay()}\n            sx={{\n              backgroundColor: chipColor,\n              color: '#fff',\n              fontWeight: 'bold',\n            }}\n          />\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chipList' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Stack direction=\"row\" spacing={1}>\n            {chips.map((chip, i) => (\n              <Chip\n                key={i}\n                label={chip.stat}\n                sx={{\n                  backgroundColor: chip.chipColor,\n                  color: '#fff',\n                  fontWeight: 'bold',\n                }}\n              />\n            ))}\n          </Stack>\n        </Stack>\n      )}\n\n      {/* Content projection (similar to ng-content) */}\n      {children}\n    </>\n  );\n};\n\nexport default Stat;"],"names":["useMemo","Typography","jsxs","Fragment","Box","jsx","Stack","Chip","chip"],"mappings":";;;;;;AAsBO,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,QAAQ,CAAA;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AAAA,EACX;AAAA,EACA;AACF,MAAM;AACJ,QAAM,mBAAmBA,MAAAA,QAAQ,MAAM;AACrC,QAAI,OAAQ,QAAO;AACnB,QAAI,KAAM,QAAO;AACjB,QAAI,SAAU,QAAO;AACrB,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,QAAQ,CAAC;AAE3B,QAAM,oBAAoB,MAAM;AAC9B,WAAO,cAAc,YAAY,IAAI,mCAAKC,qBAAA,EAAW,SAAQ,MAAM,UAAA,KAAA,CAAK;AAAA,EAC1E;AAEA,SACEC,2BAAAA,KAAAC,qBAAA,EACG,UAAA;AAAA,IAAA,qBAAqB,aACpBD,gCAACE,SAAAA,KAAA,EAAI,WAAU,QACb,UAAA;AAAA,MAAAC,+BAACJ,SAAAA,cAAW,SAAQ,MAAK,eAAY,oCAClC,+BACH;AAAA,MACAC,2BAAAA,KAACE,SAAAA,OAAI,WAAU,eAAc,SAAQ,QAAO,YAAW,UAAS,KAAK,GACnE,UAAA;AAAA,QAAAC,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,QACnCI,2BAAAA;AAAAA,UAACD,SAAAA;AAAAA,UAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAY;AAAA,YACZ,cAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAGD,qBAAqB,YACpBF,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,eAAY,oCACrB,+BACH;AAAA,MACC,SAASI,2BAAAA,IAACJ,SAAAA,YAAA,EAAY,UAAA,MAAA,CAAM;AAAA,IAAA,GAC/B;AAAA,IAGD,qBAAqB,UACpBC,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA;AAAAA,QAACE,SAAAA;AAAAA,QAAA;AAAA,UACC,eAAY;AAAA,UACZ,OAAO,kBAAA;AAAA,UACP,IAAI;AAAA,YACF,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF,GACF;AAAA,IAGD,qBAAqB,cACpBL,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA,IAACC,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA,MAAM,IAAI,CAACE,OAAM,MAChBH,2BAAAA;AAAAA,QAACE,SAAAA;AAAAA,QAAA;AAAA,UAEC,OAAOC,MAAK;AAAA,UACZ,IAAI;AAAA,YACF,iBAAiBA,MAAK;AAAA,YACtB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QANK;AAAA,MAAA,CAQR,EAAA,CACH;AAAA,IAAA,GACF;AAAA,IAID;AAAA,EAAA,GACH;AAEJ;;"}
+{"version":3,"file":"Stat.cjs","sources":["../../../src/components/Stat/Stat.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Chip, Stack, Typography, Box } from '@mui/material';\n\nexport interface StatChip {\n  stat: any;\n  chipColor: string;\n}\n\nexport interface StatProps {\n  stat: any; // Replace 'any' with the actual type of 'stat'\n  stat2?: any; // Replace 'any' with the actual type of'stat2'\n  label: string; // Replace 'any' with the actual type of'label'\n  color?: string;\n  chipColor?: string;\n  chips?: StatChip[]; // Replace 'any' with the actual type of'chips'\n  simple?: boolean;\n  chip?: boolean;\n  chipList?: boolean;\n  children?: React.ReactNode;\n  statDisplay?: (stat: any) => React.ReactNode;\n}\n\nexport const Stat: React.FC<StatProps> = ({\n  stat,\n  stat2,\n  label,\n  color = '#1469B8',\n  chipColor = '#1469B8',\n  chips = [],\n  simple = false,\n  chip = false,\n  chipList = false,\n  children,\n  statDisplay,\n}) => {\n  const selectedTemplate = useMemo(() => {\n    if (simple) return 'simple';\n    if (chip) return 'chip';\n    if (chipList) return 'chipList';\n    return 'default';\n  }, [simple, chip, chipList]);\n\n  const renderStatDisplay = () => {\n    return statDisplay ? statDisplay(stat) : <Typography variant=\"h6\">{stat}</Typography>;\n  };\n\n  return (\n    <>\n      {selectedTemplate === 'default' && (\n        <Box className=\"stat\">\n          <Typography variant=\"h4\" data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          <Box className=\"stat__label\" display=\"flex\" alignItems=\"center\" gap={1}>\n            <Typography variant=\"body1\">{label}</Typography>\n            <Box\n              width={40}\n              height={4}\n              bgcolor={color}\n              data-testid=\"stat-border\"\n              borderRadius={2}\n            />\n          </Box>\n        </Box>\n      )}\n\n      {selectedTemplate === 'simple' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Typography data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          {stat2 && <Typography>{stat2}</Typography>}\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chip' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Chip\n            data-testid=\"chip-template-option-outlet\"\n            label={renderStatDisplay()}\n            sx={{\n              backgroundColor: chipColor,\n              color: '#fff',\n              fontWeight: 'bold',\n            }}\n          />\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chipList' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Stack direction=\"row\" spacing={1}>\n            {chips.map((chip, i) => (\n              <Chip\n                key={i}\n                label={chip.stat}\n                sx={{\n                  backgroundColor: chip.chipColor,\n                  color: '#fff',\n                  fontWeight: 'bold',\n                }}\n              />\n            ))}\n          </Stack>\n        </Stack>\n      )}\n\n      {/* Content projection (similar to ng-content) */}\n      {children}\n    </>\n  );\n};\n\nexport default Stat;"],"names":["useMemo","Typography","jsxs","Fragment","Box","jsx","Stack","Chip","chip"],"mappings":";;;;;AAsBO,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,QAAQ,CAAA;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AAAA,EACX;AAAA,EACA;AACF,MAAM;AACJ,QAAM,mBAAmBA,MAAAA,QAAQ,MAAM;AACrC,QAAI,OAAQ,QAAO;AACnB,QAAI,KAAM,QAAO;AACjB,QAAI,SAAU,QAAO;AACrB,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,QAAQ,CAAC;AAE3B,QAAM,oBAAoB,MAAM;AAC9B,WAAO,cAAc,YAAY,IAAI,mCAAKC,qBAAA,EAAW,SAAQ,MAAM,UAAA,KAAA,CAAK;AAAA,EAC1E;AAEA,SACEC,2BAAAA,KAAAC,qBAAA,EACG,UAAA;AAAA,IAAA,qBAAqB,aACpBD,gCAACE,SAAAA,KAAA,EAAI,WAAU,QACb,UAAA;AAAA,MAAAC,+BAACJ,SAAAA,cAAW,SAAQ,MAAK,eAAY,oCAClC,+BACH;AAAA,MACAC,2BAAAA,KAACE,SAAAA,OAAI,WAAU,eAAc,SAAQ,QAAO,YAAW,UAAS,KAAK,GACnE,UAAA;AAAA,QAAAC,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,QACnCI,2BAAAA;AAAAA,UAACD,SAAAA;AAAAA,UAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAY;AAAA,YACZ,cAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAGD,qBAAqB,YACpBF,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,eAAY,oCACrB,+BACH;AAAA,MACC,SAASI,2BAAAA,IAACJ,SAAAA,YAAA,EAAY,UAAA,MAAA,CAAM;AAAA,IAAA,GAC/B;AAAA,IAGD,qBAAqB,UACpBC,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA;AAAAA,QAACE,SAAAA;AAAAA,QAAA;AAAA,UACC,eAAY;AAAA,UACZ,OAAO,kBAAA;AAAA,UACP,IAAI;AAAA,YACF,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF,GACF;AAAA,IAGD,qBAAqB,cACpBL,gCAACI,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAAD,2BAAAA,IAACJ,SAAAA,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnCI,2BAAAA,IAACC,SAAAA,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA,MAAM,IAAI,CAACE,OAAM,MAChBH,2BAAAA;AAAAA,QAACE,SAAAA;AAAAA,QAAA;AAAA,UAEC,OAAOC,MAAK;AAAA,UACZ,IAAI;AAAA,YACF,iBAAiBA,MAAK;AAAA,YACtB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QANK;AAAA,MAAA,CAQR,EAAA,CACH;AAAA,IAAA,GACF;AAAA,IAID;AAAA,EAAA,GACH;AAEJ;;;"}

package/components/Stat/Stat.js

@@ -1,4 +1,3 @@
-import '../../styles.css';/* empty css                    */
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { Box, Typography, Stack, Chip } from "@mui/material";
@@ -80,6 +79,7 @@ const Stat = ({
   ] });
 };
 export {
-  Stat
+  Stat,
+  Stat as default
 };
 //# sourceMappingURL=Stat.js.map

package/components/Stat/Stat.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stat.js","sources":["../../../src/components/Stat/Stat.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Chip, Stack, Typography, Box } from '@mui/material';\n\nexport interface StatChip {\n  stat: any;\n  chipColor: string;\n}\n\nexport interface StatProps {\n  stat: any; // Replace 'any' with the actual type of 'stat'\n  stat2?: any; // Replace 'any' with the actual type of'stat2'\n  label: string; // Replace 'any' with the actual type of'label'\n  color?: string;\n  chipColor?: string;\n  chips?: StatChip[]; // Replace 'any' with the actual type of'chips'\n  simple?: boolean;\n  chip?: boolean;\n  chipList?: boolean;\n  children?: React.ReactNode;\n  statDisplay?: (stat: any) => React.ReactNode;\n}\n\nexport const Stat: React.FC<StatProps> = ({\n  stat,\n  stat2,\n  label,\n  color = '#1469B8',\n  chipColor = '#1469B8',\n  chips = [],\n  simple = false,\n  chip = false,\n  chipList = false,\n  children,\n  statDisplay,\n}) => {\n  const selectedTemplate = useMemo(() => {\n    if (simple) return 'simple';\n    if (chip) return 'chip';\n    if (chipList) return 'chipList';\n    return 'default';\n  }, [simple, chip, chipList]);\n\n  const renderStatDisplay = () => {\n    return statDisplay ? statDisplay(stat) : <Typography variant=\"h6\">{stat}</Typography>;\n  };\n\n  return (\n    <>\n      {selectedTemplate === 'default' && (\n        <Box className=\"stat\">\n          <Typography variant=\"h4\" data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          <Box className=\"stat__label\" display=\"flex\" alignItems=\"center\" gap={1}>\n            <Typography variant=\"body1\">{label}</Typography>\n            <Box\n              width={40}\n              height={4}\n              bgcolor={color}\n              data-testid=\"stat-border\"\n              borderRadius={2}\n            />\n          </Box>\n        </Box>\n      )}\n\n      {selectedTemplate === 'simple' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Typography data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          {stat2 && <Typography>{stat2}</Typography>}\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chip' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Chip\n            data-testid=\"chip-template-option-outlet\"\n            label={renderStatDisplay()}\n            sx={{\n              backgroundColor: chipColor,\n              color: '#fff',\n              fontWeight: 'bold',\n            }}\n          />\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chipList' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Stack direction=\"row\" spacing={1}>\n            {chips.map((chip, i) => (\n              <Chip\n                key={i}\n                label={chip.stat}\n                sx={{\n                  backgroundColor: chip.chipColor,\n                  color: '#fff',\n                  fontWeight: 'bold',\n                }}\n              />\n            ))}\n          </Stack>\n        </Stack>\n      )}\n\n      {/* Content projection (similar to ng-content) */}\n      {children}\n    </>\n  );\n};\n\nexport default Stat;"],"names":["chip"],"mappings":";;;;AAsBO,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,QAAQ,CAAA;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AAAA,EACX;AAAA,EACA;AACF,MAAM;AACJ,QAAM,mBAAmB,QAAQ,MAAM;AACrC,QAAI,OAAQ,QAAO;AACnB,QAAI,KAAM,QAAO;AACjB,QAAI,SAAU,QAAO;AACrB,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,QAAQ,CAAC;AAE3B,QAAM,oBAAoB,MAAM;AAC9B,WAAO,cAAc,YAAY,IAAI,wBAAK,YAAA,EAAW,SAAQ,MAAM,UAAA,KAAA,CAAK;AAAA,EAC1E;AAEA,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,qBAAqB,aACpB,qBAAC,KAAA,EAAI,WAAU,QACb,UAAA;AAAA,MAAA,oBAAC,cAAW,SAAQ,MAAK,eAAY,oCAClC,+BACH;AAAA,MACA,qBAAC,OAAI,WAAU,eAAc,SAAQ,QAAO,YAAW,UAAS,KAAK,GACnE,UAAA;AAAA,QAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,QACnC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAY;AAAA,YACZ,cAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAGD,qBAAqB,YACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC,oBAAC,YAAA,EAAW,eAAY,oCACrB,+BACH;AAAA,MACC,SAAS,oBAAC,YAAA,EAAY,UAAA,MAAA,CAAM;AAAA,IAAA,GAC/B;AAAA,IAGD,qBAAqB,UACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,eAAY;AAAA,UACZ,OAAO,kBAAA;AAAA,UACP,IAAI;AAAA,YACF,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF,GACF;AAAA,IAGD,qBAAqB,cACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC,oBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA,MAAM,IAAI,CAACA,OAAM,MAChB;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,OAAOA,MAAK;AAAA,UACZ,IAAI;AAAA,YACF,iBAAiBA,MAAK;AAAA,YACtB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QANK;AAAA,MAAA,CAQR,EAAA,CACH;AAAA,IAAA,GACF;AAAA,IAID;AAAA,EAAA,GACH;AAEJ;"}
+{"version":3,"file":"Stat.js","sources":["../../../src/components/Stat/Stat.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Chip, Stack, Typography, Box } from '@mui/material';\n\nexport interface StatChip {\n  stat: any;\n  chipColor: string;\n}\n\nexport interface StatProps {\n  stat: any; // Replace 'any' with the actual type of 'stat'\n  stat2?: any; // Replace 'any' with the actual type of'stat2'\n  label: string; // Replace 'any' with the actual type of'label'\n  color?: string;\n  chipColor?: string;\n  chips?: StatChip[]; // Replace 'any' with the actual type of'chips'\n  simple?: boolean;\n  chip?: boolean;\n  chipList?: boolean;\n  children?: React.ReactNode;\n  statDisplay?: (stat: any) => React.ReactNode;\n}\n\nexport const Stat: React.FC<StatProps> = ({\n  stat,\n  stat2,\n  label,\n  color = '#1469B8',\n  chipColor = '#1469B8',\n  chips = [],\n  simple = false,\n  chip = false,\n  chipList = false,\n  children,\n  statDisplay,\n}) => {\n  const selectedTemplate = useMemo(() => {\n    if (simple) return 'simple';\n    if (chip) return 'chip';\n    if (chipList) return 'chipList';\n    return 'default';\n  }, [simple, chip, chipList]);\n\n  const renderStatDisplay = () => {\n    return statDisplay ? statDisplay(stat) : <Typography variant=\"h6\">{stat}</Typography>;\n  };\n\n  return (\n    <>\n      {selectedTemplate === 'default' && (\n        <Box className=\"stat\">\n          <Typography variant=\"h4\" data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          <Box className=\"stat__label\" display=\"flex\" alignItems=\"center\" gap={1}>\n            <Typography variant=\"body1\">{label}</Typography>\n            <Box\n              width={40}\n              height={4}\n              bgcolor={color}\n              data-testid=\"stat-border\"\n              borderRadius={2}\n            />\n          </Box>\n        </Box>\n      )}\n\n      {selectedTemplate === 'simple' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Typography data-testid=\"selection-template-option-outlet\">\n            {renderStatDisplay()}\n          </Typography>\n          {stat2 && <Typography>{stat2}</Typography>}\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chip' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Chip\n            data-testid=\"chip-template-option-outlet\"\n            label={renderStatDisplay()}\n            sx={{\n              backgroundColor: chipColor,\n              color: '#fff',\n              fontWeight: 'bold',\n            }}\n          />\n        </Stack>\n      )}\n\n      {selectedTemplate === 'chipList' && (\n        <Stack direction=\"row\" spacing={2} alignItems=\"center\">\n          <Typography variant=\"body1\">{label}</Typography>\n          <Stack direction=\"row\" spacing={1}>\n            {chips.map((chip, i) => (\n              <Chip\n                key={i}\n                label={chip.stat}\n                sx={{\n                  backgroundColor: chip.chipColor,\n                  color: '#fff',\n                  fontWeight: 'bold',\n                }}\n              />\n            ))}\n          </Stack>\n        </Stack>\n      )}\n\n      {/* Content projection (similar to ng-content) */}\n      {children}\n    </>\n  );\n};\n\nexport default Stat;"],"names":["chip"],"mappings":";;;AAsBO,MAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,QAAQ,CAAA;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,WAAW;AAAA,EACX;AAAA,EACA;AACF,MAAM;AACJ,QAAM,mBAAmB,QAAQ,MAAM;AACrC,QAAI,OAAQ,QAAO;AACnB,QAAI,KAAM,QAAO;AACjB,QAAI,SAAU,QAAO;AACrB,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,QAAQ,CAAC;AAE3B,QAAM,oBAAoB,MAAM;AAC9B,WAAO,cAAc,YAAY,IAAI,wBAAK,YAAA,EAAW,SAAQ,MAAM,UAAA,KAAA,CAAK;AAAA,EAC1E;AAEA,SACE,qBAAA,UAAA,EACG,UAAA;AAAA,IAAA,qBAAqB,aACpB,qBAAC,KAAA,EAAI,WAAU,QACb,UAAA;AAAA,MAAA,oBAAC,cAAW,SAAQ,MAAK,eAAY,oCAClC,+BACH;AAAA,MACA,qBAAC,OAAI,WAAU,eAAc,SAAQ,QAAO,YAAW,UAAS,KAAK,GACnE,UAAA;AAAA,QAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,QACnC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,eAAY;AAAA,YACZ,cAAc;AAAA,UAAA;AAAA,QAAA;AAAA,MAChB,EAAA,CACF;AAAA,IAAA,GACF;AAAA,IAGD,qBAAqB,YACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC,oBAAC,YAAA,EAAW,eAAY,oCACrB,+BACH;AAAA,MACC,SAAS,oBAAC,YAAA,EAAY,UAAA,MAAA,CAAM;AAAA,IAAA,GAC/B;AAAA,IAGD,qBAAqB,UACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,eAAY;AAAA,UACZ,OAAO,kBAAA;AAAA,UACP,IAAI;AAAA,YACF,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF,GACF;AAAA,IAGD,qBAAqB,cACpB,qBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAAG,YAAW,UAC5C,UAAA;AAAA,MAAA,oBAAC,YAAA,EAAW,SAAQ,SAAS,UAAA,OAAM;AAAA,MACnC,oBAAC,OAAA,EAAM,WAAU,OAAM,SAAS,GAC7B,UAAA,MAAM,IAAI,CAACA,OAAM,MAChB;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,OAAOA,MAAK;AAAA,UACZ,IAAI;AAAA,YACF,iBAAiBA,MAAK;AAAA,YACtB,OAAO;AAAA,YACP,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,QANK;AAAA,MAAA,CAQR,EAAA,CACH;AAAA,IAAA,GACF;AAAA,IAID;AAAA,EAAA,GACH;AAEJ;"}

package/components/Stat/index.d.ts

@@ -1 +1,2 @@
-export { default as Stat } from './Stat';
+export { Stat, default } from './Stat';
+export type { StatProps, StatChip } from './Stat';

package/components/Stat.d.ts

@@ -1,2 +1,6 @@
 export * from './Stat/index'
 export {}
+import _default from './Stat/index'
+export default _default
+export * from './Stat/index'
+export {}

package/components/StatusMessage/StatusMessage.cjs

@@ -1,6 +1,7 @@
 "use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+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 iconsMaterial = require("@mui/icons-material");
 const StatusMessage = ({
@@ -9,71 +10,99 @@ const StatusMessage = ({
   messageType = "success",
   displayType = "alert",
   close,
-  open = true
+  open: controlledOpen
 }) => {
-  const getAlertVariant = () => {
-    switch (messageType) {
-      case "success":
-        return "success";
-      case "danger":
-        return "error";
-      case "warning":
-        return "warning";
-      default:
-        return "info";
-    }
-  };
-  const getIcon = () => {
-    switch (messageType) {
-      case "success":
-        return /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.CheckCircleOutline, { sx: { fontSize: "64px", color: "success.main" } });
-      case "danger":
-        return /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ErrorOutline, { sx: { fontSize: "64px", color: "error.main" } });
-      case "warning":
-        return /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.WarningAmber, { sx: { fontSize: "64px", color: "warning.main" } });
-      default:
-        return null;
-    }
+  const [internalOpen, setInternalOpen] = React.useState(true);
+  const titleId = React.useId();
+  const descId = React.useId();
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : internalOpen;
+  const handleClose = () => {
+    if (!isControlled) setInternalOpen(false);
+    close == null ? void 0 : close();
   };
-  const alertVariant = getAlertVariant();
-  if (!description) {
-    return null;
+  const alertVariant = messageType === "danger" ? "error" : messageType;
+  const icon = messageType === "success" ? /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.CheckCircleOutline, { sx: { fontSize: 64, color: "success.main" } }) : messageType === "danger" ? /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.ErrorOutline, { sx: { fontSize: 64, color: "error.main" } }) : /* @__PURE__ */ jsxRuntime.jsx(iconsMaterial.WarningAmber, { sx: { fontSize: 64, color: "warning.main" } });
+  if (!description) return null;
+  if (!isOpen) return null;
+  if (displayType === "modal") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      material.Dialog,
+      {
+        open: isOpen,
+        onClose: handleClose,
+        "aria-labelledby": title ? titleId : void 0,
+        "aria-describedby": descId,
+        maxWidth: "md",
+        slotProps: {
+          paper: {
+            sx: { borderRadius: "16px", p: 2 }
+          }
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            material.DialogContent,
+            {
+              sx: {
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                textAlign: "center",
+                p: 4,
+                gap: 2
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { mb: 2 }, children: icon }),
+                title && /* @__PURE__ */ jsxRuntime.jsx(
+                  material.Typography,
+                  {
+                    id: titleId,
+                    variant: "h4",
+                    component: "h2",
+                    sx: { fontWeight: "bold" },
+                    children: title
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { id: descId, variant: "body1", color: "text.secondary", children: description })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(material.DialogActions, { sx: { justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsxRuntime.jsx(material.Button, { onClick: handleClose, variant: "contained", color: alertVariant, children: "Aceptar" }) })
+        ]
+      }
+    );
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: displayType === "modal" ? /* @__PURE__ */ jsxRuntime.jsxs(
-    material.Dialog,
-    {
-      open,
-      onClose: close,
-      "aria-labelledby": "message-dialog-title",
-      maxWidth: "md",
-      PaperProps: {
-        sx: {
-          borderRadius: "16px",
-          p: 2
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(material.DialogContent, { sx: { display: "flex", flexDirection: "column", alignItems: "center", textAlign: "center", p: 4, gap: 2 }, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(material.Box, { sx: { mb: 2 }, children: getIcon() }),
-          /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h4", component: "h2", sx: { fontWeight: "bold" }, children: title || "" }),
-          /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body1", color: "text.secondary", children: description })
-        ] }),
-        close && /* @__PURE__ */ jsxRuntime.jsx(material.DialogActions, { sx: { justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsxRuntime.jsx(material.Button, { onClick: close, variant: "contained", color: alertVariant, children: "Aceptar" }) })
-      ]
-    }
-  ) : /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     material.Alert,
     {
       severity: alertVariant,
       sx: { mb: 2, mt: 2 },
-      onClose: close,
-      action: close && /* @__PURE__ */ jsxRuntime.jsx(material.Button, { onClick: close, size: "small", color: "inherit", children: "Cerrar" }),
+      onClose: close !== void 0 ? handleClose : void 0,
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h6", sx: { fontWeight: "bold" }, children: title }),
+        title && /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "h6", sx: { fontWeight: "bold" }, children: title }),
         /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { variant: "body2", sx: { mt: 1 }, children: description })
       ]
     }
-  ) });
+  );
+};
+const initialValues = {
+  state: void 0,
+  setMessage: () => {
+  },
+  cleanMessage: () => {
+  }
+};
+const StatusMessageContext = React.createContext(initialValues);
+const useStatusMessageContext = () => React.useContext(StatusMessageContext);
+const StatusMessageProvider = ({ children }) => {
+  const [stateMessage, setMessage] = React.useState(void 0);
+  const cleanMessage = () => {
+    setMessage(void 0);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(StatusMessageContext.Provider, { value: { setMessage, cleanMessage, state: stateMessage }, children });
 };
 exports.StatusMessage = StatusMessage;
+exports.StatusMessageProvider = StatusMessageProvider;
+exports.default = StatusMessage;
+exports.useStatusMessageContext = useStatusMessageContext;
 //# sourceMappingURL=StatusMessage.cjs.map

package/components/StatusMessage/StatusMessage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"StatusMessage.cjs","sources":["../../../src/components/StatusMessage/StatusMessage.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon\n} from '@mui/icons-material';\n\n/**\n * `StatusMessage` es un componente de React que muestra mensajes de éxito, error o advertencia\n * en un modal o una alerta, utilizando el sistema de diseño de Material-UI.\n *\n * El componente puede mostrar alertas con estilos específicos o un modal personalizable\n * usando `Dialog` y otros componentes de MUI. También puede incluir una función opcional\n * para cerrar el mensaje.\n *\n * @param {StatusMessageProps} props - Las propiedades del componente.\n * @param {string | undefined} props.title - Título del mensaje que se muestra en el modal o alerta.\n * @param {string} [props.description] - Descripción o contenido detallado del mensaje.\n * @param {'success' | 'danger' | 'warning'} [props.messageType='success'] - Tipo de mensaje que determina el estilo visual. 'danger' se mapea a 'error' de MUI.\n * @param {'alert' | 'modal'} [props.displayType='alert'] - Determina si el mensaje se muestra como alerta o modal.\n * @param {() => void} [props.close] - Función opcional para ejecutar al cerrar el mensaje.\n * @returns {React.FC<StatusMessageProps>} Un componente funcional de React que muestra mensajes personalizados.\n *\n * @example\n * // Ejemplo de uso como una alerta:\n * <StatusMessage\n * title=\"Operación Exitosa\"\n * description=\"La operación se ha completado correctamente.\"\n * messageType=\"success\"\n * displayType=\"alert\"\n * />\n *\n * // Ejemplo de uso como un modal:\n * <StatusMessage\n * title=\"Advertencia\"\n * description=\"Se ha producido un error inesperado.\"\n * messageType=\"danger\"\n * displayType=\"modal\"\n * close={() => console.log('Modal cerrado')}\n * />\n */\n\nexport interface StatusMessageProps {\n  title: string | undefined;\n  description?: string;\n  messageType?: 'success' | 'danger' | 'warning';\n  displayType?: 'alert' | 'modal';\n  close?: () => void;\n  // Propiedad para controlar la visibilidad del modal desde el padre\n  open?: boolean;\n}\n\nconst StatusMessage = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open = true,\n}: StatusMessageProps) => {\n\n  const getAlertVariant = () => {\n    switch (messageType) {\n      case 'success':\n        return 'success';\n      case 'danger':\n        return 'error';\n      case 'warning':\n        return 'warning';\n      default:\n        return 'info'; // Fallback\n    }\n  };\n\n  const getIcon = () => {\n    switch (messageType) {\n      case 'success':\n        return <CheckCircleOutlineIcon sx={{ fontSize: '64px', color: 'success.main' }} />;\n      case 'danger':\n        return <ErrorOutlineIcon sx={{ fontSize: '64px', color: 'error.main' }} />;\n      case 'warning':\n        return <WarningAmberIcon sx={{ fontSize: '64px', color: 'warning.main' }} />;\n      default:\n        return null;\n    }\n  };\n\n  const alertVariant = getAlertVariant();\n\n  if (!description) {\n    return null;\n  }\n\n  return (\n    <>\n      {displayType === 'modal' ? (\n        <Dialog\n          open={open}\n          onClose={close}\n          aria-labelledby=\"message-dialog-title\"\n          maxWidth=\"md\"\n          PaperProps={{\n            sx: {\n              borderRadius: '16px',\n              p: 2,\n            },\n          }}\n        >\n          <DialogContent sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', textAlign: 'center', p: 4, gap: 2 }}>\n            <Box sx={{ mb: 2 }}>\n              {getIcon()}\n            </Box>\n            <Typography variant=\"h4\" component=\"h2\" sx={{ fontWeight: 'bold' }}>\n              {title || ''}\n            </Typography>\n            <Typography variant=\"body1\" color=\"text.secondary\">\n              {description}\n            </Typography>\n          </DialogContent>\n          {close && (\n            <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n              <Button onClick={close} variant=\"contained\" color={alertVariant}>\n                Aceptar\n              </Button>\n            </DialogActions>\n          )}\n        </Dialog>\n      ) : (\n        <Alert\n          severity={alertVariant}\n          sx={{ mb: 2, mt: 2 }}\n          onClose={close}\n          action={\n            close && (\n              <Button onClick={close} size=\"small\" color=\"inherit\">\n                Cerrar\n              </Button>\n            )\n          }\n        >\n          <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n            {title}\n          </Typography>\n          <Typography variant=\"body2\" sx={{ mt: 1 }}>\n            {description}\n          </Typography>\n        </Alert>\n      )}\n    </>\n  );\n};\n\nexport default StatusMessage;\n"],"names":["jsx","CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon","Fragment","jsxs","Dialog","DialogContent","Box","Typography","DialogActions","Button","Alert"],"mappings":";;;;;AA6DA,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,cAAc;AAAA,EACd;AAAA,EACA,OAAO;AACT,MAA0B;AAExB,QAAM,kBAAkB,MAAM;AAC5B,YAAQ,aAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb;AAEA,QAAM,UAAU,MAAM;AACpB,YAAQ,aAAA;AAAA,MACN,KAAK;AACH,eAAOA,2BAAAA,IAACC,oCAAuB,IAAI,EAAE,UAAU,QAAQ,OAAO,kBAAkB;AAAA,MAClF,KAAK;AACH,eAAOD,2BAAAA,IAACE,8BAAiB,IAAI,EAAE,UAAU,QAAQ,OAAO,gBAAgB;AAAA,MAC1E,KAAK;AACH,eAAOF,2BAAAA,IAACG,8BAAiB,IAAI,EAAE,UAAU,QAAQ,OAAO,kBAAkB;AAAA,MAC5E;AACE,eAAO;AAAA,IAAA;AAAA,EAEb;AAEA,QAAM,eAAe,gBAAA;AAErB,MAAI,CAAC,aAAa;AAChB,WAAO;AAAA,EACT;AAEA,SACEH,2BAAAA,IAAAI,WAAAA,UAAA,EACG,0BAAgB,UACfC,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,SAAS;AAAA,MACT,mBAAgB;AAAA,MAChB,UAAS;AAAA,MACT,YAAY;AAAA,QACV,IAAI;AAAA,UACF,cAAc;AAAA,UACd,GAAG;AAAA,QAAA;AAAA,MACL;AAAA,MAGF,UAAA;AAAA,QAAAD,2BAAAA,KAACE,SAAAA,eAAA,EAAc,IAAI,EAAE,SAAS,QAAQ,eAAe,UAAU,YAAY,UAAU,WAAW,UAAU,GAAG,GAAG,KAAK,KACnH,UAAA;AAAA,UAAAP,+BAACQ,SAAAA,OAAI,IAAI,EAAE,IAAI,KACZ,qBACH;AAAA,UACAR,2BAAAA,IAACS,SAAAA,YAAA,EAAW,SAAQ,MAAK,WAAU,MAAK,IAAI,EAAE,YAAY,OAAA,GACvD,UAAA,SAAS,GAAA,CACZ;AAAA,yCACCA,SAAAA,YAAA,EAAW,SAAQ,SAAQ,OAAM,kBAC/B,UAAA,YAAA,CACH;AAAA,QAAA,GACF;AAAA,QACC,SACCT,2BAAAA,IAACU,SAAAA,eAAA,EAAc,IAAI,EAAE,gBAAgB,UAAU,GAAG,EAAA,GAChD,UAAAV,+BAACW,SAAAA,QAAA,EAAO,SAAS,OAAO,SAAQ,aAAY,OAAO,cAAc,qBAEjE,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IAIJN,2BAAAA;AAAAA,IAACO,SAAAA;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,IAAI,EAAE,IAAI,GAAG,IAAI,EAAA;AAAA,MACjB,SAAS;AAAA,MACT,QACE,SACEZ,2BAAAA,IAACW,SAAAA,QAAA,EAAO,SAAS,OAAO,MAAK,SAAQ,OAAM,WAAU,UAAA,SAAA,CAErD;AAAA,MAIJ,UAAA;AAAA,QAAAX,2BAAAA,IAACS,SAAAA,YAAA,EAAW,SAAQ,MAAK,IAAI,EAAE,YAAY,OAAA,GACxC,UAAA,MAAA,CACH;AAAA,QACAT,2BAAAA,IAACS,SAAAA,cAAW,SAAQ,SAAQ,IAAI,EAAE,IAAI,EAAA,GACnC,UAAA,YAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAGN;AAEJ;;"}
+{"version":3,"file":"StatusMessage.cjs","sources":["../../../src/components/StatusMessage/StatusMessage.tsx","../../../src/components/StatusMessage/StatusMessageContext.tsx"],"sourcesContent":["import { useId, useState, type FC } from 'react';\nimport {\n  Alert,\n  Box,\n  Typography,\n  Dialog,\n  DialogContent,\n  DialogActions,\n  Button,\n} from '@mui/material';\nimport {\n  ErrorOutline as ErrorOutlineIcon,\n  CheckCircleOutline as CheckCircleOutlineIcon,\n  WarningAmber as WarningAmberIcon,\n} from '@mui/icons-material';\n\nexport interface StatusMessageProps {\n  /** Título del mensaje. */\n  title?: string;\n  /** Descripción/contenido detallado. Requerido para que el componente renderice. */\n  description?: string;\n  /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */\n  messageType?: 'success' | 'danger' | 'warning';\n  /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */\n  displayType?: 'alert' | 'modal';\n  /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */\n  close?: () => void;\n  /**\n   * Controla visibilidad. Si se omite, el componente maneja su propio\n   * state (se oculta solo al llamar `close`). Si se pasa, queda controlled\n   * y el consumer es responsable de actualizarlo.\n   */\n  open?: boolean;\n}\n\n/**\n * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.\n *\n * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia\n *   visibilidad. Al llamar `close`, se oculta automáticamente.\n * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.\n */\nexport const StatusMessage: FC<StatusMessageProps> = ({\n  title,\n  description,\n  messageType = 'success',\n  displayType = 'alert',\n  close,\n  open: controlledOpen,\n}) => {\n  const [internalOpen, setInternalOpen] = useState(true);\n  const titleId = useId();\n  const descId = useId();\n\n  const isControlled = controlledOpen !== undefined;\n  const isOpen = isControlled ? controlledOpen : internalOpen;\n\n  const handleClose = () => {\n    if (!isControlled) setInternalOpen(false);\n    close?.();\n  };\n\n  const alertVariant = messageType === 'danger' ? 'error' : messageType;\n\n  const icon =\n    messageType === 'success' ? (\n      <CheckCircleOutlineIcon sx={{ fontSize: 64, color: 'success.main' }} />\n    ) : messageType === 'danger' ? (\n      <ErrorOutlineIcon sx={{ fontSize: 64, color: 'error.main' }} />\n    ) : (\n      <WarningAmberIcon sx={{ fontSize: 64, color: 'warning.main' }} />\n    );\n\n  if (!description) return null;\n  if (!isOpen) return null;\n\n  if (displayType === 'modal') {\n    return (\n      <Dialog\n        open={isOpen}\n        onClose={handleClose}\n        aria-labelledby={title ? titleId : undefined}\n        aria-describedby={descId}\n        maxWidth=\"md\"\n        slotProps={{\n          paper: {\n            sx: { borderRadius: '16px', p: 2 },\n          },\n        }}\n      >\n        <DialogContent\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            alignItems: 'center',\n            textAlign: 'center',\n            p: 4,\n            gap: 2,\n          }}\n        >\n          <Box sx={{ mb: 2 }}>{icon}</Box>\n          {title && (\n            <Typography\n              id={titleId}\n              variant=\"h4\"\n              component=\"h2\"\n              sx={{ fontWeight: 'bold' }}\n            >\n              {title}\n            </Typography>\n          )}\n          <Typography id={descId} variant=\"body1\" color=\"text.secondary\">\n            {description}\n          </Typography>\n        </DialogContent>\n        <DialogActions sx={{ justifyContent: 'center', p: 2 }}>\n          <Button onClick={handleClose} variant=\"contained\" color={alertVariant}>\n            Aceptar\n          </Button>\n        </DialogActions>\n      </Dialog>\n    );\n  }\n\n  return (\n    <Alert\n      severity={alertVariant}\n      sx={{ mb: 2, mt: 2 }}\n      onClose={close !== undefined ? handleClose : undefined}\n    >\n      {title && (\n        <Typography variant=\"h6\" sx={{ fontWeight: 'bold' }}>\n          {title}\n        </Typography>\n      )}\n      <Typography variant=\"body2\" sx={{ mt: 1 }}>\n        {description}\n      </Typography>\n    </Alert>\n  );\n};\n\nexport default StatusMessage;\n","import {\n  createContext,\n  useState,\n  useContext,\n  type Dispatch,\n  type SetStateAction,\n  type ReactNode,\n} from 'react';\nimport type { StatusMessageProps } from './StatusMessage';\n\nexport type StatusMessageState = {\n  [K in 'title' | 'description' | 'messageType']: StatusMessageProps[K] | undefined;\n} & Pick<StatusMessageProps, 'displayType'>;\n\ninterface StatusMessageContextValue {\n  state: StatusMessageState | undefined;\n  setMessage: Dispatch<SetStateAction<StatusMessageState | undefined>>;\n  cleanMessage: () => void;\n}\n\nconst initialValues: StatusMessageContextValue = {\n  state: undefined,\n  setMessage: () => {},\n  cleanMessage: () => {},\n};\n\nconst StatusMessageContext = createContext<StatusMessageContextValue>(initialValues);\n\nexport const useStatusMessageContext = () => useContext(StatusMessageContext);\n\ninterface StatusMessageProviderProps {\n  children: ReactNode;\n}\n\nexport const StatusMessageProvider = ({ children }: StatusMessageProviderProps) => {\n  const [stateMessage, setMessage] = useState<StatusMessageState | undefined>(undefined);\n  const cleanMessage = () => {\n    setMessage(undefined);\n  };\n\n  return (\n    <StatusMessageContext.Provider value={{ setMessage, cleanMessage, state: stateMessage }}>\n      {children}\n    </StatusMessageContext.Provider>\n  );\n};\n"],"names":["useState","useId","jsx","CheckCircleOutlineIcon","ErrorOutlineIcon","WarningAmberIcon","jsxs","Dialog","DialogContent","Box","Typography","DialogActions","Button","Alert","createContext","useContext"],"mappings":"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"}

package/components/StatusMessage/StatusMessage.d.ts

@@ -1,44 +1,28 @@
-/**
- * `StatusMessage` es un componente de React que muestra mensajes de éxito, error o advertencia
- * en un modal o una alerta, utilizando el sistema de diseño de Material-UI.
- *
- * El componente puede mostrar alertas con estilos específicos o un modal personalizable
- * usando `Dialog` y otros componentes de MUI. También puede incluir una función opcional
- * para cerrar el mensaje.
- *
- * @param {StatusMessageProps} props - Las propiedades del componente.
- * @param {string | undefined} props.title - Título del mensaje que se muestra en el modal o alerta.
- * @param {string} [props.description] - Descripción o contenido detallado del mensaje.
- * @param {'success' | 'danger' | 'warning'} [props.messageType='success'] - Tipo de mensaje que determina el estilo visual. 'danger' se mapea a 'error' de MUI.
- * @param {'alert' | 'modal'} [props.displayType='alert'] - Determina si el mensaje se muestra como alerta o modal.
- * @param {() => void} [props.close] - Función opcional para ejecutar al cerrar el mensaje.
- * @returns {React.FC<StatusMessageProps>} Un componente funcional de React que muestra mensajes personalizados.
- *
- * @example
- * // Ejemplo de uso como una alerta:
- * <StatusMessage
- * title="Operación Exitosa"
- * description="La operación se ha completado correctamente."
- * messageType="success"
- * displayType="alert"
- * />
- *
- * // Ejemplo de uso como un modal:
- * <StatusMessage
- * title="Advertencia"
- * description="Se ha producido un error inesperado."
- * messageType="danger"
- * displayType="modal"
- * close={() => console.log('Modal cerrado')}
- * />
- */
+import { FC } from 'react';
 export interface StatusMessageProps {
-    title: string | undefined;
+    /** Título del mensaje. */
+    title?: string;
+    /** Descripción/contenido detallado. Requerido para que el componente renderice. */
     description?: string;
+    /** Tipo de mensaje (controla color + icono). `danger` mapea a `error` de MUI. */
     messageType?: 'success' | 'danger' | 'warning';
+    /** Forma de presentación: alerta inline o modal. Default: `'alert'`. */
     displayType?: 'alert' | 'modal';
+    /** Callback al cerrar. Si se omite, no se muestra botón de cerrar. */
     close?: () => void;
+    /**
+     * Controla visibilidad. Si se omite, el componente maneja su propio
+     * state (se oculta solo al llamar `close`). Si se pasa, queda controlled
+     * y el consumer es responsable de actualizarlo.
+     */
     open?: boolean;
 }
-declare const StatusMessage: ({ title, description, messageType, displayType, close, open, }: StatusMessageProps) => import("react/jsx-runtime").JSX.Element | null;
+/**
+ * Mensaje de éxito / error / advertencia en forma de alerta inline o modal.
+ *
+ * - **Uncontrolled**: sin pasar `open`, el componente maneja su propia
+ *   visibilidad. Al llamar `close`, se oculta automáticamente.
+ * - **Controlled**: pasando `open`, el consumer decide cuándo mostrar/ocultar.
+ */
+export declare const StatusMessage: FC<StatusMessageProps>;
 export default StatusMessage;