@soyfri/shared-library 1.0.4 → 1.0.6

package/cjs/components/DateTimePicker/DateTimePicker.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.cjs"),t=require("../../_virtual/jsx-runtime.cjs"),a=require("react"),r=require("../../node_modules/@mui/x-date-pickers/esm/LocalizationProvider/LocalizationProvider.cjs"),i=require("../../node_modules/@mui/x-date-pickers/esm/AdapterDayjs/AdapterDayjs.cjs"),s=require("../../node_modules/@mui/x-date-pickers/esm/DateTimePicker/DateTimePicker.cjs");const o=o=>{var l,n,{label:c,selectedDateTime:u,onDateTimeChange:d,minDateTime:m,maxDateTime:x,disabled:p,readOnly:T,inputFormat:D,slotProps:j,clearButtonText:b,cancelButtonText:v,acceptButtonText:h}=o,P=e.__rest(o,["label","selectedDateTime","onDateTimeChange","minDateTime","maxDateTime","disabled","readOnly","inputFormat","slotProps","clearButtonText","cancelButtonText","acceptButtonText"]);const[O,_]=a.useState(null),g=a.useMemo((()=>{switch(O){case"minDate":case"maxDate":case"invalidDate":return"Formato de fecha/hora inválido";case"disableFuture":return"No se permiten fechas/horas futuras";case"disablePast":return"No se permiten fechas/horas pasadas";default:return""}}),[O]),B=a.useMemo((()=>{const e={};return b&&(e.clearButtonLabel=b),v&&(e.cancelButtonLabel=v),h&&(e.okButtonLabel=h),e}),[b,v,h]);return t.jsxRuntimeExports.jsx(r.LocalizationProvider,{dateAdapter:i.AdapterDayjs,children:t.jsxRuntimeExports.jsx(s.DateTimePicker,Object.assign({label:c,value:u,onChange:d,minDateTime:m,maxDateTime:x,disabled:p,readOnly:T,format:D||"DD/MM/YYYY HH:mm",slotProps:Object.assign(Object.assign({},j),{textField:Object.assign(Object.assign({},null==j?void 0:j.textField),{helperText:g||(null===(l=null==j?void 0:j.textField)||void 0===l?void 0:l.helperText),error:!!g||(null===(n=null==j?void 0:j.textField)||void 0===n?void 0:n.error)})}),localeText:Object.assign({},B)},P))})};exports.DateTimePicker=o,exports.default=o;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.cjs"),t=require("../../_virtual/jsx-runtime.cjs"),a=require("react"),r=require("../../node_modules/@mui/x-date-pickers/esm/LocalizationProvider/LocalizationProvider.cjs"),i=require("../../node_modules/@mui/x-date-pickers/esm/AdapterDayjs/AdapterDayjs.cjs"),s=require("../../node_modules/@mui/x-date-pickers/esm/DateTimePicker/DateTimePicker.cjs");const l=l=>{var o,n,{label:u,selectedDateTime:c,onDateTimeChange:d,minDateTime:m,maxDateTime:x,disabled:p,readOnly:T,inputFormat:D,slotProps:j,clearButtonText:b,cancelButtonText:v,acceptButtonText:h}=l,P=e.__rest(l,["label","selectedDateTime","onDateTimeChange","minDateTime","maxDateTime","disabled","readOnly","inputFormat","slotProps","clearButtonText","cancelButtonText","acceptButtonText"]);const[O,_]=a.useState(null),f=a.useMemo((()=>{switch(O){case"minDate":case"maxDate":case"invalidDate":return"Formato de fecha/hora inválido";case"disableFuture":return"No se permiten fechas/horas futuras";case"disablePast":return"No se permiten fechas/horas pasadas";default:return""}}),[O]),g=a.useMemo((()=>{const e={};return b&&(e.clearButtonLabel=b),v&&(e.cancelButtonLabel=v),h&&(e.okButtonLabel=h),e}),[b,v,h]);return t.jsxRuntimeExports.jsx(r.LocalizationProvider,{dateAdapter:i.AdapterDayjs,children:t.jsxRuntimeExports.jsx(s.DateTimePicker,Object.assign({label:u,value:c,onChange:d,minDateTime:m,maxDateTime:x,disabled:p,readOnly:T,format:D||"DD/MM/YYYY HH:mm",slotProps:Object.assign(Object.assign({},j),{textField:Object.assign(Object.assign({fullWidth:!0},null==j?void 0:j.textField),{helperText:f||(null===(o=null==j?void 0:j.textField)||void 0===o?void 0:o.helperText),error:!!f||(null===(n=null==j?void 0:j.textField)||void 0===n?void 0:n.error)})}),localeText:Object.assign({},g)},P))})};exports.DateTimePicker=l,exports.default=l;
 //# sourceMappingURL=DateTimePicker.cjs.map

package/cjs/components/Input/Input.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.cjs"),t=require("../../_virtual/jsx-runtime.cjs"),r=require("@mui/material");const i=i=>{var{value:a,onChange:n,type:s="text",variant:u="outlined",min:o,max:l,inputProps:p}=i,v=e.__rest(i,["value","onChange","type","variant","min","max","inputProps"]);const m=Object.assign({},p);return"number"===s&&(m.min=void 0!==o?o:Number.NEGATIVE_INFINITY,void 0!==l&&(m.max=l)),t.jsxRuntimeExports.jsx(r.TextField,Object.assign({fullWidth:!0,value:a,onChange:e=>{const t=e.target.value;let r;if("number"===s)if(""===t||"-"===t)r=t;else{const e=parseFloat(t);r=isNaN(e)?t:e}else r=t;n(r)},type:s,variant:u,inputProps:m},v))};exports.Input=i,exports.default=i;
+//# sourceMappingURL=Input.cjs.map

package/cjs/components/Input/Input.cjs.map

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

package/cjs/components/Input.cjs

@@ -0,0 +1,2 @@
+"use strict";var t=require("./Input/Input.cjs");exports.Input=t.Input;
+//# sourceMappingURL=Input.cjs.map

package/cjs/components/Input.cjs.map

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

package/cjs/components/Select/Select.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/jsx-runtime.cjs"),t=require("react"),r=require("@mui/material"),l=require("../../node_modules/@mui/icons-material/esm/Clear.cjs");function s({label:s,options:i,value:a,defaultValue:n,onChange:o,size:u="medium",multiple:p=!1,filterable:x=!1,placeholder:d,children:c,maxHeight:m=300,maxWidth:h,maxChipsToShow:j=3,renderChipLabel:f}){const b=t.useMemo((()=>{var e;if(1===t.Children.count(c)){const r=t.Children.only(c);if(t.isValidElement(r)&&"Option"===(null===(e=r.type)||void 0===e?void 0:e.displayName))return r.props.children}return null}),[c]),[v,g]=t.useState(""),E=t.useMemo((()=>x&&v?i.filter((e=>e.label.toLowerCase().includes(v.toLowerCase()))):i),[v,x,i]),y=t.useMemo((()=>{const e={};return E.forEach((t=>{const r=t.group||"__default";e[r]||(e[r]=[]),e[r].push(t)})),e}),[E]),C=t.useMemo((()=>{const t=[];return x&&t.push(e.jsxRuntimeExports.jsx(r.ListSubheader,{sx:{px:2,pt:1,pb:1,backgroundColor:"background.paper",zIndex:1,position:"sticky",top:0},children:e.jsxRuntimeExports.jsx(r.TextField,{placeholder:"Buscar...",variant:"standard",size:"small",fullWidth:!0,value:v,onChange:e=>g(e.target.value),inputProps:{autoFocus:!0},onClick:e=>e.stopPropagation(),onKeyDown:e=>e.stopPropagation()})},"search-header")),Object.entries(y).forEach((([l,s])=>{"__default"!==l&&t.push(e.jsxRuntimeExports.jsx(r.ListSubheader,{disableSticky:!0,children:l},l)),s.forEach((l=>{t.push(e.jsxRuntimeExports.jsx(r.MenuItem,{value:l.value,disabled:l.disabled,children:b?b(l):l.label},l.value))}))})),t}),[y,b,x,v]);return e.jsxRuntimeExports.jsxs(r.FormControl,{fullWidth:!0,size:u,children:[s&&e.jsxRuntimeExports.jsx(r.InputLabel,{children:s}),e.jsxRuntimeExports.jsx(r.Select,{label:s,value:null!=a?a:p?[]:"",defaultValue:n,multiple:p,onChange:e=>{o(e.target.value)},renderValue:t=>{var s;if(!t||Array.isArray(t)&&0===t.length)return e.jsxRuntimeExports.jsx(r.Typography,{sx:{color:"text.disabled"},children:d||""});if(!p){const e=i.find((e=>e.value===t));return f&&e?f(e):null!==(s=null==e?void 0:e.label)&&void 0!==s?s:String(t)}const n=t,u=n.slice(0,j),x=n.length-j;return e.jsxRuntimeExports.jsxs(r.Box,{sx:{display:"flex",flexWrap:"wrap",gap:.5},children:[u.map((t=>{const s=i.find((e=>e.value===t));if(!s)return null;return e.jsxRuntimeExports.jsx(r.Chip,{label:f?f(s):s.label,avatar:s.img?e.jsxRuntimeExports.jsx(r.Avatar,{src:s.img}):void 0,onDelete:()=>(e=>{const t=a.filter((t=>t!==e));o(t)})(t),deleteIcon:e.jsxRuntimeExports.jsx(l,{})},t)})),x>0&&e.jsxRuntimeExports.jsx(r.Chip,{label:`+${x} más`,size:"small"})]})},displayEmpty:!0,input:e.jsxRuntimeExports.jsx(r.OutlinedInput,{label:s}),MenuProps:{PaperProps:{style:{maxHeight:m,maxWidth:h}}},children:C})]})}exports.Select=s,exports.default=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/jsx-runtime.cjs"),t=require("react"),r=require("@mui/material"),l=require("../../node_modules/@mui/icons-material/esm/Clear.cjs");function s(e){return null}function i({label:s,options:i,value:a,defaultValue:n,onChange:o,size:u="medium",multiple:p=!1,filterable:d=!1,placeholder:x,children:c,maxHeight:m=300,maxWidth:h,maxChipsToShow:j=3,renderChipLabel:f,chipVariant:v="outlined"}){const b=t.useMemo((()=>{var e;if(1===t.Children.count(c)){const r=t.Children.only(c);if(t.isValidElement(r)&&"Option"===(null===(e=r.type)||void 0===e?void 0:e.displayName))return r.props.children}return null}),[c]),[g,E]=t.useState(""),y=t.useMemo((()=>d&&g?i.filter((e=>e.label.toLowerCase().includes(g.toLowerCase()))):i),[g,d,i]),C=t.useMemo((()=>{const e={};return y.forEach((t=>{const r=t.group||"__default";e[r]||(e[r]=[]),e[r].push(t)})),e}),[y]),R=t.useMemo((()=>{const t=[];return d&&t.push(e.jsxRuntimeExports.jsx(r.ListSubheader,{sx:{px:2,pt:1,pb:1,backgroundColor:"background.paper",zIndex:1,position:"sticky",top:0},children:e.jsxRuntimeExports.jsx(r.TextField,{placeholder:"Buscar...",variant:"standard",size:"small",fullWidth:!0,value:g,onChange:e=>E(e.target.value),inputProps:{autoFocus:!0},onClick:e=>e.stopPropagation(),onKeyDown:e=>e.stopPropagation()})},"search-header")),Object.entries(C).forEach((([l,s])=>{"__default"!==l&&t.push(e.jsxRuntimeExports.jsx(r.ListSubheader,{disableSticky:!0,children:l},l)),s.forEach((l=>{t.push(e.jsxRuntimeExports.jsx(r.MenuItem,{value:l.value,disabled:l.disabled,children:b?b(l):l.label},l.value))}))})),t}),[C,b,d,g]);return e.jsxRuntimeExports.jsxs(r.FormControl,{fullWidth:!0,size:u,children:[s&&e.jsxRuntimeExports.jsx(r.InputLabel,{children:s}),e.jsxRuntimeExports.jsx(r.Select,{label:s,value:null!=a?a:p?[]:"",defaultValue:n,multiple:p,onChange:e=>{o(e.target.value)},renderValue:t=>{var s;if(!t||Array.isArray(t)&&0===t.length)return e.jsxRuntimeExports.jsx(r.Typography,{sx:{color:"text.disabled"},children:x||""});if(!p){const e=i.find((e=>e.value===t));return f&&e?f(e):null!==(s=null==e?void 0:e.label)&&void 0!==s?s:String(t)}const n=t,u=n.slice(0,j),d=n.length-j;return e.jsxRuntimeExports.jsxs(r.Box,{sx:{display:"flex",flexWrap:"wrap",gap:.5},children:[u.map((t=>{const s=i.find((e=>e.value===t));if(!s)return null;return e.jsxRuntimeExports.jsx(r.Chip,{variant:v,color:"primary",label:f?f(s):s.label,avatar:s.img?e.jsxRuntimeExports.jsx(r.Avatar,{src:s.img}):void 0,onDelete:()=>(e=>{const t=a.filter((t=>t!==e));o(t)})(t),deleteIcon:e.jsxRuntimeExports.jsx(l,{})},t)})),d>0&&e.jsxRuntimeExports.jsx(r.Chip,{label:`+${d} más`,variant:v})]})},displayEmpty:!0,input:e.jsxRuntimeExports.jsx(r.OutlinedInput,{label:s}),MenuProps:{PaperProps:{style:{maxHeight:m,maxWidth:h}}},children:R})]})}s.displayName="Option",exports.Option=s,exports.Select=i,exports.default=i;
 //# sourceMappingURL=Select.cjs.map

package/cjs/components/Select.cjs

@@ -1,2 +1,2 @@
-"use strict";var e=require("./Select/Select.cjs");exports.Select=e.Select;
+"use strict";var e=require("./Select/Select.cjs");exports.Option=e.Option,exports.Select=e.Select;
 //# sourceMappingURL=Select.cjs.map

package/components/Input/index.ts

@@ -0,0 +1 @@
+export * from '../../esm/components/Input';

package/esm/components/DateTimePicker/DateTimePicker.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../../_virtual/_tslib.js";import{j as t}from"../../_virtual/jsx-runtime.js";import a from"react";import{LocalizationProvider as i}from"../../node_modules/@mui/x-date-pickers/esm/LocalizationProvider/LocalizationProvider.js";import{AdapterDayjs as r}from"../../node_modules/@mui/x-date-pickers/esm/AdapterDayjs/AdapterDayjs.js";import{DateTimePicker as o}from"../../node_modules/@mui/x-date-pickers/esm/DateTimePicker/DateTimePicker.js";const s=s=>{var l,n,{label:m,selectedDateTime:d,onDateTimeChange:c,minDateTime:u,maxDateTime:p,disabled:x,readOnly:T,inputFormat:D,slotProps:b,clearButtonText:j,cancelButtonText:v,acceptButtonText:f}=s,h=e(s,["label","selectedDateTime","onDateTimeChange","minDateTime","maxDateTime","disabled","readOnly","inputFormat","slotProps","clearButtonText","cancelButtonText","acceptButtonText"]);const[g,B]=a.useState(null),O=a.useMemo((()=>{switch(g){case"minDate":case"maxDate":case"invalidDate":return"Formato de fecha/hora inválido";case"disableFuture":return"No se permiten fechas/horas futuras";case"disablePast":return"No se permiten fechas/horas pasadas";default:return""}}),[g]),P=a.useMemo((()=>{const e={};return j&&(e.clearButtonLabel=j),v&&(e.cancelButtonLabel=v),f&&(e.okButtonLabel=f),e}),[j,v,f]);return t.jsx(i,{dateAdapter:r,children:t.jsx(o,Object.assign({label:m,value:d,onChange:c,minDateTime:u,maxDateTime:p,disabled:x,readOnly:T,format:D||"DD/MM/YYYY HH:mm",slotProps:Object.assign(Object.assign({},b),{textField:Object.assign(Object.assign({},null==b?void 0:b.textField),{helperText:O||(null===(l=null==b?void 0:b.textField)||void 0===l?void 0:l.helperText),error:!!O||(null===(n=null==b?void 0:b.textField)||void 0===n?void 0:n.error)})}),localeText:Object.assign({},P)},h))})};export{s as DateTimePicker,s as default};
+import{__rest as e}from"../../_virtual/_tslib.js";import{j as t}from"../../_virtual/jsx-runtime.js";import a from"react";import{LocalizationProvider as i}from"../../node_modules/@mui/x-date-pickers/esm/LocalizationProvider/LocalizationProvider.js";import{AdapterDayjs as r}from"../../node_modules/@mui/x-date-pickers/esm/AdapterDayjs/AdapterDayjs.js";import{DateTimePicker as o}from"../../node_modules/@mui/x-date-pickers/esm/DateTimePicker/DateTimePicker.js";const s=s=>{var l,n,{label:m,selectedDateTime:d,onDateTimeChange:c,minDateTime:u,maxDateTime:p,disabled:x,readOnly:T,inputFormat:D,slotProps:b,clearButtonText:j,cancelButtonText:v,acceptButtonText:f}=s,h=e(s,["label","selectedDateTime","onDateTimeChange","minDateTime","maxDateTime","disabled","readOnly","inputFormat","slotProps","clearButtonText","cancelButtonText","acceptButtonText"]);const[g,B]=a.useState(null),O=a.useMemo((()=>{switch(g){case"minDate":case"maxDate":case"invalidDate":return"Formato de fecha/hora inválido";case"disableFuture":return"No se permiten fechas/horas futuras";case"disablePast":return"No se permiten fechas/horas pasadas";default:return""}}),[g]),P=a.useMemo((()=>{const e={};return j&&(e.clearButtonLabel=j),v&&(e.cancelButtonLabel=v),f&&(e.okButtonLabel=f),e}),[j,v,f]);return t.jsx(i,{dateAdapter:r,children:t.jsx(o,Object.assign({label:m,value:d,onChange:c,minDateTime:u,maxDateTime:p,disabled:x,readOnly:T,format:D||"DD/MM/YYYY HH:mm",slotProps:Object.assign(Object.assign({},b),{textField:Object.assign(Object.assign({fullWidth:!0},null==b?void 0:b.textField),{helperText:O||(null===(l=null==b?void 0:b.textField)||void 0===l?void 0:l.helperText),error:!!O||(null===(n=null==b?void 0:b.textField)||void 0===n?void 0:n.error)})}),localeText:Object.assign({},P)},h))})};export{s as DateTimePicker,s as default};
 //# sourceMappingURL=DateTimePicker.js.map

package/esm/components/Input/Input.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { TextFieldProps } from '@mui/material';
+export interface InputProps extends Omit<TextFieldProps, 'value' | 'onChange' | 'variant' | 'type' | 'inputProps'> {
+    value: string | number;
+    onChange: (value: string | number) => void;
+    type?: 'text' | 'number' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'date' | 'datetime-local' | 'month' | 'week' | 'time' | 'color';
+    variant?: 'outlined' | 'filled' | 'standard';
+    min?: number;
+    max?: number;
+    inputProps?: TextFieldProps['inputProps'];
+    disabled?: boolean;
+    readOnly?: boolean;
+}
+/**
+ * Componente Input personalizado de Material UI.
+ * Un wrapper para TextField que simplifica el manejo de diferentes tipos de input
+ * y proporciona una interfaz consistente para el valor y el evento onChange.
+ * Permite control explícito sobre el rango de números, asegurando que se puedan
+ * ingresar números negativos por defecto si no se especifica un 'min'.
+ */
+export declare const Input: React.FC<InputProps>;
+export default Input;

package/esm/components/Input/Input.definitions.d.ts

@@ -0,0 +1,11 @@
+export declare const BasicTextInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const BasicTextInputExample = () => {\n  const [value, setValue] = useState('Texto de ejemplo');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Nombre\"\n        value={value}\n        onChange={setValue}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const NumberInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const NumberInputExample = () => {\n  const [value, setValue] = useState(123);\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Cantidad\"\n        type=\"number\"\n        value={value}\n        onChange={setValue}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const EmailInputDefinition = "\nimport React, { useState } => from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const EmailInputExample = () => {\n  const [value, setValue] = useState('ejemplo@dominio.com');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Correo Electr\u00F3nico\"\n        type=\"email\"\n        value={value}\n        onChange={setValue}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const PasswordInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const PasswordInputExample = () => {\n  const [value, setValue] = useState('micontrase\u00F1a');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Contrase\u00F1a\"\n        type=\"password\"\n        value={value}\n        onChange={setValue}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const InputWithPlaceholderDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const InputWithPlaceholderExample = () => {\n  const [value, setValue] = useState('');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"B\u00FAsqueda\"\n        placeholder=\"Escribe tu t\u00E9rmino de b\u00FAsqueda...\"\n        value={value}\n        onChange={setValue}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value || 'Vac\u00EDo'}</Typography>\n    </Box>\n  );\n};\n";
+export declare const InputWithErrorDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const InputWithErrorExample = () => {\n  const [value, setValue] = useState('invalido');\n  const hasError = value.length < 5 && value.length > 0;\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Nombre de usuario\"\n        value={value}\n        onChange={setValue}\n        error={hasError}\n        helperText={hasError ? 'M\u00EDnimo 5 caracteres' : ''}\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const DisabledInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const DisabledInputExample = () => {\n  const [value, setValue] = useState('Campo deshabilitado');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Estado\"\n        value={value}\n        onChange={setValue}\n        disabled\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const ReadOnlyInputDefinition = "\nimport React, { useState } => from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const ReadOnlyInputExample = () => {\n  const [value, setValue] = useState('Valor de solo lectura');\n  return (\n    <Box sx={{ width: 300 }}>\n      <Input\n        label=\"Informaci\u00F3n\"\n        value={value}\n        onChange={setValue}\n        readOnly\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";
+export declare const InputVariantsDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const InputVariantsExample = () => {\n  const [valueOutlined, setValueOutlined] = useState('Outlined');\n  const [valueFilled, setValueFilled] = useState('Filled');\n  const [valueStandard, setValueStandard] = useState('Standard');\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3, width: 300 }}>\n      <Input\n        label=\"Esquema Outlined\"\n        value={valueOutlined}\n        onChange={setValueOutlined}\n        variant=\"outlined\"\n      />\n      <Input\n        label=\"Esquema Filled\"\n        value={valueFilled}\n        onChange={setValueFilled}\n        variant=\"filled\"\n      />\n      <Input\n        label=\"Esquema Standard\"\n        value={valueStandard}\n        onChange={setValueStandard}\n        variant=\"standard\"\n      />\n    </Box>\n  );\n};\n";
+export declare const InputSizesDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const InputSizesExample = () => {\n  const [valueMedium, setValueMedium] = useState('Tama\u00F1o Mediano');\n  const [valueSmall, setValueSmall] = useState('Tama\u00F1o Peque\u00F1o');\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3, width: 300 }}>\n      <Input\n        label=\"Input Mediano\"\n        value={valueMedium}\n        onChange={setValueMedium}\n        size=\"medium\"\n      />\n      <Input\n        label=\"Input Peque\u00F1o\"\n        value={valueSmall}\n        onChange={setValueSmall}\n        size=\"small\"\n      />\n    </Box>\n  );\n};\n";
+export declare const FullWidthInputDefinition = "\nimport React, { useState } from 'react';\nimport { Input } from './Input'; // Ajusta la ruta si es necesario\nimport { Box, Typography } from '@mui/material';\n\nexport const FullWidthInputExample = () => {\n  const [value, setValue] = useState('Ocupa todo el ancho');\n  return (\n    <Box sx={{ width: '100%' }}>\n      <Input\n        label=\"Input de Ancho Completo\"\n        value={value}\n        onChange={setValue}\n        fullWidth\n      />\n      <Typography sx={{ mt: 2 }}>Valor actual: {value}</Typography>\n    </Box>\n  );\n};\n";

package/esm/components/Input/Input.js

@@ -0,0 +1,2 @@
+import{__rest as t}from"../../_virtual/_tslib.js";import{j as a}from"../../_virtual/jsx-runtime.js";import{TextField as e}from"@mui/material";const i=i=>{var{value:n,onChange:r,type:s="text",variant:o="outlined",min:m,max:u,inputProps:l}=i,p=t(i,["value","onChange","type","variant","min","max","inputProps"]);const v=Object.assign({},l);return"number"===s&&(v.min=void 0!==m?m:Number.NEGATIVE_INFINITY,void 0!==u&&(v.max=u)),a.jsx(e,Object.assign({fullWidth:!0,value:n,onChange:t=>{const a=t.target.value;let e;if("number"===s)if(""===a||"-"===a)e=a;else{const t=parseFloat(a);e=isNaN(t)?a:t}else e=a;r(e)},type:s,variant:o,inputProps:v},p))};export{i as Input,i as default};
+//# sourceMappingURL=Input.js.map

package/esm/components/Input/Input.js.map

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

package/esm/components/Input/Input.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Input } from './Input';
+declare const meta: Meta<typeof Input>;
+export default meta;
+type Story = StoryObj<typeof Input>;
+export declare const BasicTextInput: Story;
+export declare const NumberInput: Story;
+export declare const EmailInput: Story;
+export declare const PasswordInput: Story;
+export declare const InputWithPlaceholder: Story;
+export declare const InputWithError: Story;
+export declare const DisabledInput: Story;
+export declare const ReadOnlyInput: Story;
+export declare const InputVariants: Story;
+export declare const InputSizes: Story;
+export declare const FullWidthInput: Story;

package/esm/components/Input/index.d.ts

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

package/esm/components/Input.js

@@ -0,0 +1,2 @@
+export{Input}from"./Input/Input.js";
+//# sourceMappingURL=Input.js.map

package/esm/components/Input.js.map

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

package/esm/components/Select/Select.d.ts

@@ -26,6 +26,7 @@ export interface SelectProps<TValue extends SelectOption['value'] = SelectOption
     maxWidth?: number | string;
     maxChipsToShow?: number;
     renderChipLabel?: RenderChipLabel;
+    chipVariant?: 'outlined' | 'filled';
 }
 export interface OptionProps {
     children: RenderOptionItem;
@@ -35,5 +36,5 @@ export declare namespace Option {
     var displayName: string;
 }
 export declare function Select<TValue extends SelectOption['value'] = SelectOption['value']>({ label, options, value, defaultValue, onChange, size, multiple, filterable, placeholder, children, maxHeight, maxWidth, maxChipsToShow, // Valor por defecto: mostrar 3 chips
-renderChipLabel, }: SelectProps<TValue>): import("react/jsx-runtime").JSX.Element;
+renderChipLabel, chipVariant, }: SelectProps<TValue>): import("react/jsx-runtime").JSX.Element;
 export default Select;

package/esm/components/Select/Select.js

@@ -1,2 +1,2 @@
-import{j as e}from"../../_virtual/jsx-runtime.js";import l,{useMemo as a,isValidElement as r,useState as t}from"react";import{ListSubheader as i,TextField as n,MenuItem as s,FormControl as o,InputLabel as u,Select as d,OutlinedInput as p,Typography as c,Box as h,Chip as m,Avatar as x}from"@mui/material";import f from"../../node_modules/@mui/icons-material/esm/Clear.js";function v({label:v,options:b,value:j,defaultValue:g,onChange:y,size:C="medium",multiple:P=!1,filterable:_=!1,placeholder:k,children:w,maxHeight:z=300,maxWidth:W,maxChipsToShow:E=3,renderChipLabel:S}){const L=a((()=>{var e;if(1===l.Children.count(w)){const a=l.Children.only(w);if(r(a)&&"Option"===(null===(e=a.type)||void 0===e?void 0:e.displayName))return a.props.children}return null}),[w]),[V,A]=t(""),D=a((()=>_&&V?b.filter((e=>e.label.toLowerCase().includes(V.toLowerCase()))):b),[V,_,b]),H=a((()=>{const e={};return D.forEach((l=>{const a=l.group||"__default";e[a]||(e[a]=[]),e[a].push(l)})),e}),[D]),I=a((()=>{const l=[];return _&&l.push(e.jsx(i,{sx:{px:2,pt:1,pb:1,backgroundColor:"background.paper",zIndex:1,position:"sticky",top:0},children:e.jsx(n,{placeholder:"Buscar...",variant:"standard",size:"small",fullWidth:!0,value:V,onChange:e=>A(e.target.value),inputProps:{autoFocus:!0},onClick:e=>e.stopPropagation(),onKeyDown:e=>e.stopPropagation()})},"search-header")),Object.entries(H).forEach((([a,r])=>{"__default"!==a&&l.push(e.jsx(i,{disableSticky:!0,children:a},a)),r.forEach((a=>{l.push(e.jsx(s,{value:a.value,disabled:a.disabled,children:L?L(a):a.label},a.value))}))})),l}),[H,L,_,V]);return e.jsxs(o,{fullWidth:!0,size:C,children:[v&&e.jsx(u,{children:v}),e.jsx(d,{label:v,value:null!=j?j:P?[]:"",defaultValue:g,multiple:P,onChange:e=>{y(e.target.value)},renderValue:l=>{var a;if(!l||Array.isArray(l)&&0===l.length)return e.jsx(c,{sx:{color:"text.disabled"},children:k||""});if(!P){const e=b.find((e=>e.value===l));return S&&e?S(e):null!==(a=null==e?void 0:e.label)&&void 0!==a?a:String(l)}const r=l,t=r.slice(0,E),i=r.length-E;return e.jsxs(h,{sx:{display:"flex",flexWrap:"wrap",gap:.5},children:[t.map((l=>{const a=b.find((e=>e.value===l));if(!a)return null;return e.jsx(m,{label:S?S(a):a.label,avatar:a.img?e.jsx(x,{src:a.img}):void 0,onDelete:()=>(e=>{const l=j.filter((l=>l!==e));y(l)})(l),deleteIcon:e.jsx(f,{})},l)})),i>0&&e.jsx(m,{label:`+${i} más`,size:"small"})]})},displayEmpty:!0,input:e.jsx(p,{label:v}),MenuProps:{PaperProps:{style:{maxHeight:z,maxWidth:W}}},children:I})]})}export{v as Select,v as default};
+import{j as e}from"../../_virtual/jsx-runtime.js";import l,{useMemo as a,isValidElement as r,useState as t}from"react";import{ListSubheader as i,TextField as n,MenuItem as o,FormControl as s,InputLabel as u,Select as d,OutlinedInput as p,Typography as c,Box as h,Chip as m,Avatar as x}from"@mui/material";import f from"../../node_modules/@mui/icons-material/esm/Clear.js";function v(e){return null}function b({label:v,options:b,value:j,defaultValue:g,onChange:y,size:C="medium",multiple:P=!1,filterable:_=!1,placeholder:k,children:w,maxHeight:W=300,maxWidth:z,maxChipsToShow:E=3,renderChipLabel:S,chipVariant:V="outlined"}){const L=a((()=>{var e;if(1===l.Children.count(w)){const a=l.Children.only(w);if(r(a)&&"Option"===(null===(e=a.type)||void 0===e?void 0:e.displayName))return a.props.children}return null}),[w]),[O,A]=t(""),D=a((()=>_&&O?b.filter((e=>e.label.toLowerCase().includes(O.toLowerCase()))):b),[O,_,b]),H=a((()=>{const e={};return D.forEach((l=>{const a=l.group||"__default";e[a]||(e[a]=[]),e[a].push(l)})),e}),[D]),I=a((()=>{const l=[];return _&&l.push(e.jsx(i,{sx:{px:2,pt:1,pb:1,backgroundColor:"background.paper",zIndex:1,position:"sticky",top:0},children:e.jsx(n,{placeholder:"Buscar...",variant:"standard",size:"small",fullWidth:!0,value:O,onChange:e=>A(e.target.value),inputProps:{autoFocus:!0},onClick:e=>e.stopPropagation(),onKeyDown:e=>e.stopPropagation()})},"search-header")),Object.entries(H).forEach((([a,r])=>{"__default"!==a&&l.push(e.jsx(i,{disableSticky:!0,children:a},a)),r.forEach((a=>{l.push(e.jsx(o,{value:a.value,disabled:a.disabled,children:L?L(a):a.label},a.value))}))})),l}),[H,L,_,O]);return e.jsxs(s,{fullWidth:!0,size:C,children:[v&&e.jsx(u,{children:v}),e.jsx(d,{label:v,value:null!=j?j:P?[]:"",defaultValue:g,multiple:P,onChange:e=>{y(e.target.value)},renderValue:l=>{var a;if(!l||Array.isArray(l)&&0===l.length)return e.jsx(c,{sx:{color:"text.disabled"},children:k||""});if(!P){const e=b.find((e=>e.value===l));return S&&e?S(e):null!==(a=null==e?void 0:e.label)&&void 0!==a?a:String(l)}const r=l,t=r.slice(0,E),i=r.length-E;return e.jsxs(h,{sx:{display:"flex",flexWrap:"wrap",gap:.5},children:[t.map((l=>{const a=b.find((e=>e.value===l));if(!a)return null;return e.jsx(m,{variant:V,color:"primary",label:S?S(a):a.label,avatar:a.img?e.jsx(x,{src:a.img}):void 0,onDelete:()=>(e=>{const l=j.filter((l=>l!==e));y(l)})(l),deleteIcon:e.jsx(f,{})},l)})),i>0&&e.jsx(m,{label:`+${i} más`,variant:V})]})},displayEmpty:!0,input:e.jsx(p,{label:v}),MenuProps:{PaperProps:{style:{maxHeight:W,maxWidth:z}}},children:I})]})}v.displayName="Option";export{v as Option,b as Select,b as default};
 //# sourceMappingURL=Select.js.map

package/esm/components/Select/index.d.ts

@@ -1 +1 @@
-export { default as Select } from './Select';
+export { default as Select, Option } from './Select';

package/esm/components/Select.js

@@ -1,2 +1,2 @@
-export{Select}from"./Select/Select.js";
+export{Option,Select}from"./Select/Select.js";
 //# sourceMappingURL=Select.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soyfri/shared-library",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -49,6 +49,11 @@
       "require": "./cjs/components/Select.cjs",
       "types": "./esm/components/Select/Select.d.ts"
     },
+    "./components/Input": {
+      "import": "./esm/components/Input.js",
+      "require": "./cjs/components/Input.cjs",
+      "types": "./esm/components/Input/Input.d.ts"
+    },
     "./components/Icon": {
       "import": "./esm/components/Icon.js",
       "require": "./cjs/components/Icon.cjs",