[{"data":1,"prerenderedAt":660},["ShallowReactive",2],{"navigation_docs_es":3,"-es-recipes-date-range":384,"-es-recipes-date-range-surround":655},[4,55,360],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Primeros Pasos",false,"/es/getting-started","es/1.getting-started",[10,15,20,25,30,35,40,45,50],{"title":11,"path":12,"stem":13,"icon":14},"Introducción","/es/getting-started/introduction","es/1.getting-started/2.introduction","i-lucide-house",{"title":16,"path":17,"stem":18,"icon":19},"Instalación","/es/getting-started/installation","es/1.getting-started/3.installation","i-lucide-download",{"title":21,"path":22,"stem":23,"icon":24},"Skill de IA","/es/getting-started/ai-skill","es/1.getting-started/4.ai-skill","i-lucide-bot",{"title":26,"path":27,"stem":28,"icon":29},"Estructura del proyecto","/es/getting-started/project-structure","es/1.getting-started/5.project-structure","i-lucide-folder-tree",{"title":31,"path":32,"stem":33,"icon":34},"Componentes","/es/getting-started/components","es/1.getting-started/6.components","i-lucide-layout-grid",{"title":36,"path":37,"stem":38,"icon":39},"Configuración i18n","/es/getting-started/i18n","es/1.getting-started/7.i18n","i-lucide-globe",{"title":41,"path":42,"stem":43,"icon":44},"Migración","/es/getting-started/migration","es/1.getting-started/8.migration","i-lucide-replace",{"title":46,"path":47,"stem":48,"icon":49},"Solución de problemas","/es/getting-started/troubleshooting","es/1.getting-started/9.troubleshooting","i-lucide-wrench",{"title":51,"path":52,"stem":53,"icon":54},"Roadmap","/es/getting-started/roadmap","es/1.getting-started/99.roadmap","i-lucide-map",{"title":31,"icon":6,"path":56,"stem":57,"children":58,"page":6},"/es/components","es/2.components",[59,114,148,213,258,310,340],{"title":60,"icon":6,"path":61,"stem":62,"children":63,"page":6},"Entrada de datos","/es/components/data-input","es/2.components/1.data-input",[64,69,74,79,84,89,94,99,104,109],{"title":65,"path":66,"stem":67,"icon":68},"Input","/es/components/data-input/input","es/2.components/1.data-input/1.input","i-lucide-text-cursor-input",{"title":70,"path":71,"stem":72,"icon":73},"Select","/es/components/data-input/select","es/2.components/1.data-input/11.select","i-lucide-chevrons-up-down",{"title":75,"path":76,"stem":77,"icon":78},"InputAmount","/es/components/data-input/input-amount","es/2.components/1.data-input/2.input-amount","i-lucide-dollar-sign",{"title":80,"path":81,"stem":82,"icon":83},"InputDate","/es/components/data-input/input-date","es/2.components/1.data-input/3.input-date","i-lucide-calendar",{"title":85,"path":86,"stem":87,"icon":88},"InputIncrement","/es/components/data-input/input-increment","es/2.components/1.data-input/4.input-increment","i-mdi-plus-minus",{"title":90,"path":91,"stem":92,"icon":93},"InputMask","/es/components/data-input/input-mask","es/2.components/1.data-input/5.input-mask","i-lucide-key-round",{"title":95,"path":96,"stem":97,"icon":98},"InputOtp","/es/components/data-input/input-otp","es/2.components/1.data-input/6.input-otp","i-lucide-shield-check",{"title":100,"path":101,"stem":102,"icon":103},"InputPassword","/es/components/data-input/input-password","es/2.components/1.data-input/7.input-password","i-lucide-lock",{"title":105,"path":106,"stem":107,"icon":108},"InputTag","/es/components/data-input/input-tag","es/2.components/1.data-input/8.input-tag","i-lucide-tag",{"title":110,"path":111,"stem":112,"icon":113},"Textarea","/es/components/data-input/textarea","es/2.components/1.data-input/9.textarea","i-lucide-text-select",{"title":115,"icon":6,"path":116,"stem":117,"children":118,"page":6},"Selectores","/es/components/selectors","es/2.components/2.selectors",[119,124,129,133,138,143],{"title":120,"path":121,"stem":122,"icon":123},"Checkbox","/es/components/selectors/checkbox","es/2.components/2.selectors/1.checkbox","i-lucide-check-square",{"title":125,"path":126,"stem":127,"icon":128},"Radio","/es/components/selectors/radio","es/2.components/2.selectors/2.radio","i-lucide-circle-dot",{"title":130,"path":131,"stem":132,"icon":128},"Radio Group","/es/components/selectors/radio-group","es/2.components/2.selectors/3.radio-group",{"title":134,"path":135,"stem":136,"icon":137},"Switch","/es/components/selectors/switch","es/2.components/2.selectors/4.switch","i-lucide-toggle-right",{"title":139,"path":140,"stem":141,"icon":142},"Selector","/es/components/selectors/selector","es/2.components/2.selectors/5.selector","i-lucide-pointer",{"title":144,"path":145,"stem":146,"icon":147},"Multi Selector","/es/components/selectors/multi-selector","es/2.components/2.selectors/6.multi-selector","i-lucide-list-checks",{"title":149,"icon":6,"path":150,"stem":151,"children":152,"page":6},"Visualización","/es/components/display","es/2.components/3.display",[153,158,163,168,173,178,183,188,193,198,203,208],{"title":154,"path":155,"stem":156,"icon":157},"Alert","/es/components/display/alert","es/2.components/3.display/1.alert","i-lucide-alert-circle",{"title":159,"path":160,"stem":161,"icon":162},"Skeleton","/es/components/display/skeleton","es/2.components/3.display/10.skeleton","i-lucide-loader-circle",{"title":164,"path":165,"stem":166,"icon":167},"Definition Term","/es/components/display/definition-term","es/2.components/3.display/11.definition-term","i-lucide-book-type",{"title":169,"path":170,"stem":171,"icon":172},"Placetopay Logo","/es/components/display/placetopay-logo","es/2.components/3.display/12.placetopay-logo","i-lucide-image",{"title":174,"path":175,"stem":176,"icon":177},"Avatar","/es/components/display/avatar","es/2.components/3.display/2.avatar","i-lucide-user-circle",{"title":179,"path":180,"stem":181,"icon":182},"Badge","/es/components/display/badge","es/2.components/3.display/3.badge","i-lucide-badge",{"title":184,"path":185,"stem":186,"icon":187},"Card","/es/components/display/card","es/2.components/3.display/4.card","i-lucide-square",{"title":189,"path":190,"stem":191,"icon":192},"Card Brand","/es/components/display/card-brand","es/2.components/3.display/5.card-brand","i-lucide-credit-card",{"title":194,"path":195,"stem":196,"icon":197},"Caption","/es/components/display/caption","es/2.components/3.display/6.caption","i-lucide-type",{"title":199,"path":200,"stem":201,"icon":202},"Link","/es/components/display/link","es/2.components/3.display/7.link","i-lucide-link",{"title":204,"path":205,"stem":206,"icon":207},"Toast","/es/components/display/toast","es/2.components/3.display/8.toast","i-lucide-bell-ring",{"title":209,"path":210,"stem":211,"icon":212},"Breadcrumbs","/es/components/display/breadcrumbs","es/2.components/3.display/9.breadcrumbs","i-lucide-navigation",{"title":214,"icon":6,"path":215,"stem":216,"children":217,"page":6},"Modales y Overlays","/es/components/modals","es/2.components/4.modals",[218,223,228,233,238,243,248,253],{"title":219,"path":220,"stem":221,"icon":222},"Modal","/es/components/modals/modal","es/2.components/4.modals/1.modal","i-lucide-square-dashed",{"title":224,"path":225,"stem":226,"icon":227},"Modal Card","/es/components/modals/modal-card","es/2.components/4.modals/2.modal-card","i-lucide-panel-top",{"title":229,"path":230,"stem":231,"icon":232},"Modal Confirm","/es/components/modals/modal-confirm","es/2.components/4.modals/3.modal-confirm","i-lucide-check-circle-2",{"title":234,"path":235,"stem":236,"icon":237},"Modal Left","/es/components/modals/modal-left","es/2.components/4.modals/4.modal-left","i-lucide-panel-left",{"title":239,"path":240,"stem":241,"icon":242},"Modal Side","/es/components/modals/modal-side","es/2.components/4.modals/5.modal-side","i-lucide-panel-right",{"title":244,"path":245,"stem":246,"icon":247},"Popover","/es/components/modals/popover","es/2.components/4.modals/6.popover","i-lucide-message-circle",{"title":249,"path":250,"stem":251,"icon":252},"Tooltip","/es/components/modals/tooltip","es/2.components/4.modals/7.tooltip","i-lucide-info",{"title":254,"path":255,"stem":256,"icon":257},"Dropdown","/es/components/modals/dropdown","es/2.components/4.modals/8.dropdown","i-lucide-chevron-down-circle",{"title":259,"icon":6,"path":260,"stem":261,"children":262,"page":6},"Estructura y Layout","/es/components/structure","es/2.components/5.structure",[263,267,272,276,281,286,290,295,300,305],{"title":264,"path":265,"stem":266,"icon":73},"Accordion","/es/components/structure/accordion","es/2.components/5.structure/1.accordion",{"title":268,"path":269,"stem":270,"icon":271},"ButtonGroup","/es/components/structure/button-group","es/2.components/5.structure/10.button-group","i-lucide-group",{"title":273,"path":274,"stem":275,"icon":237},"Sidebar","/es/components/structure/sidebar","es/2.components/5.structure/2.sidebar",{"title":277,"path":278,"stem":279,"icon":280},"Tab","/es/components/structure/tab","es/2.components/5.structure/3.tab","i-lucide-notebook-tabs",{"title":282,"path":283,"stem":284,"icon":285},"Table","/es/components/structure/table","es/2.components/5.structure/4.table","i-lucide-table",{"title":287,"path":288,"stem":289,"icon":285},"DTable","/es/components/structure/dtable","es/2.components/5.structure/5.dtable",{"title":291,"path":292,"stem":293,"icon":294},"TemplateHeaderTable","/es/components/structure/template-header-table","es/2.components/5.structure/6.template-header-table","i-lucide-table-properties",{"title":296,"path":297,"stem":298,"icon":299},"Steps","/es/components/structure/steps","es/2.components/5.structure/7.steps","i-lucide-footprints",{"title":301,"path":302,"stem":303,"icon":304},"Paginator","/es/components/structure/paginator","es/2.components/5.structure/8.paginator","i-lucide-ellipsis",{"title":306,"path":307,"stem":308,"icon":309},"StackedList","/es/components/structure/stacked-list","es/2.components/5.structure/9.stacked-list","i-lucide-list",{"title":311,"icon":6,"path":312,"stem":313,"children":314,"page":6},"Utilidades","/es/components/utilities","es/2.components/6.utilities",[315,320,325,330,335],{"title":316,"path":317,"stem":318,"icon":319},"Button","/es/components/utilities/button","es/2.components/6.utilities/1.button","i-lucide-mouse-pointer-click",{"title":321,"path":322,"stem":323,"icon":324},"Label","/es/components/utilities/label","es/2.components/6.utilities/2.label","i-lucide-signpost",{"title":326,"path":327,"stem":328,"icon":329},"Filter","/es/components/utilities/filter","es/2.components/6.utilities/3.filter","i-lucide-filter",{"title":331,"path":332,"stem":333,"icon":334},"ColorSwitch","/es/components/utilities/color-switch","es/2.components/6.utilities/5.color-switch","i-lucide-sun-moon",{"title":336,"path":337,"stem":338,"icon":339},"Copy","/es/components/utilities/copy","es/2.components/6.utilities/6.copy","i-lucide-copy",{"title":341,"path":342,"stem":343,"children":344,"page":6},"Typography","/es/components/typography","es/2.components/7.typography",[345,350,355],{"title":346,"path":347,"stem":348,"icon":349},"Page Title","/es/components/typography/page-title","es/2.components/7.typography/1.page-title","i-lucide-heading",{"title":351,"path":352,"stem":353,"icon":354},"Section Title","/es/components/typography/section-title","es/2.components/7.typography/2.section-title","i-lucide-heading-1",{"title":356,"path":357,"stem":358,"icon":359},"Section Description","/es/components/typography/section-description","es/2.components/7.typography/3.section-description","i-lucide-heading-2",{"title":361,"icon":6,"path":362,"stem":363,"children":364,"page":6},"Recetas","/es/recipes","es/3.recipes",[365,370,374,379],{"title":366,"path":367,"stem":368,"icon":369},"Selector + Input","/es/recipes/document-type-input","es/3.recipes/1.document-type-input","i-lucide-id-card",{"title":371,"path":372,"stem":373,"icon":78},"Selector + InputAmount","/es/recipes/currency-amount","es/3.recipes/2.currency-amount",{"title":375,"path":376,"stem":377,"icon":378},"Rango de fechas","/es/recipes/date-range","es/3.recipes/3.date-range","i-lucide-calendar-range",{"title":380,"path":381,"stem":382,"icon":383},"Selectores en cascada","/es/recipes/cascading-location","es/3.recipes/4.cascading-location","i-lucide-list-tree",{"id":385,"title":375,"body":386,"description":646,"extension":647,"links":648,"meta":649,"navigation":650,"path":376,"seo":651,"stem":377,"__hash__":654},"docs_es/es/3.recipes/3.date-range.md",{"type":387,"value":388,"toc":631},"minimark",[389,398,402,407,424,428,433,455,459,476,487,491,506,512,516,523,527,573,577,616,620],[390,391,392,393,397],"p",{},"Captura un rango temporal \"desde / hasta\" con dos ",[394,395,396],"code",{},"SInputDate"," independientes, uno por cada extremo del rango.",[399,400],"component-preview",{"file":401},"recipes/date-range",[403,404,406],"h2",{"id":405},"cuándo-usarla","Cuándo usarla",[408,409,410,414,417],"ul",{},[411,412,413],"li",{},"Filtros de reportes, dashboards y auditorías donde el usuario elige un periodo.",[411,415,416],{},"Formularios de reserva (check-in / check-out) donde cada fecha abre un calendario propio.",[411,418,419,420,423],{},"Casos donde el usuario debería poder editar cada extremo sin perder el otro — un inconveniente conocido de ",[394,421,422],{},"selectionMode=\"range\""," cuando la persona quiere cambiar solo \"hasta\".",[403,425,427],{"id":426},"decisiones-de-diseño","Decisiones de diseño",[429,430,432],"h3",{"id":431},"pegado-visual","Pegado visual",[390,434,435,439,440,442,443,446,447,450,451,454],{},[436,437,438],"strong",{},"Los dos inputs no se pegan."," ",[394,441,396],{}," no expone ",[394,444,445],{},"rounded",", y además cada extremo tiene su propia ventana de calendario. Colócalos lado a lado con ",[394,448,449],{},"grid grid-cols-2 gap-3"," o ",[394,452,453],{},"flex gap-3",". Un microtítulo (\"Desde\" / \"Hasta\") encima de cada uno aclara su rol sin requerir iconos.",[429,456,458],{"id":457},"forma-del-v-model","Forma del v-model",[390,460,461,464,465,468,469,472,473,475],{},[436,462,463],{},"Recomendado",": dos refs independientes ",[394,466,467],{},"from: Date | null"," y ",[394,470,471],{},"to: Date | null",". Cada ",[394,474,396],{}," es totalmente autónomo y se valida por su cuenta.",[390,477,478,479,482,483,486],{},"Alternativa: un objeto ",[394,480,481],{},"{ from, to }"," si tu back-end espera ese formato literal. Construir el objeto en una ",[394,484,485],{},"computed"," al momento de enviar suele ser más limpio que mantenerlo como estado reactivo.",[429,488,490],{"id":489},"coordinación-del-error","Coordinación del error",[390,492,493,494,497,498,501,502,505],{},"Cuando ",[394,495,496],{},"to \u003C from",", marca ",[394,499,500],{},"error"," en ",[436,503,504],{},"ambos"," inputs. Este es el caso más común; la regla del combo (\"ambos en rojo cuando falla la relación\") aplica igual que en las recetas de selector + input, aunque aquí los inputs no estén pegados.",[390,507,508,509,511],{},"Para errores por extremo (por ejemplo, solo \"desde\" está fuera de un rango permitido), marca ",[394,510,500],{}," solo en el extremo afectado.",[429,513,515],{"id":514},"etiqueta-y-mensaje","Etiqueta y mensaje",[390,517,518,519,522],{},"Una ",[394,520,521],{},"SLabel"," única sobre el combo con el nombre del rango (\"Rango de fechas\", \"Periodo del reporte\"). Debajo del par, un único párrafo describe el error en términos del rango (\"La fecha final no puede ser anterior a la inicial\") en lugar de repetirlo por input.",[429,524,526],{"id":525},"accesibilidad","Accesibilidad",[408,528,529,555,562],{},[411,530,531,532,534,535,538,539,542,543,546,547,550,551,554],{},"Cada ",[394,533,396],{}," lleva su propio ",[394,536,537],{},"id"," (",[394,540,541],{},"range-from",", ",[394,544,545],{},"range-to","). Los microtítulos \"Desde\"/\"Hasta\" pueden ser ",[394,548,549],{},"\u003Cspan>"," decorativos o ",[394,552,553],{},"\u003Clabel for>"," si necesitas el vínculo explícito.",[411,556,557,558,561],{},"Si muestras un error, añade ",[394,559,560],{},"aria-describedby"," en ambos inputs apuntando al párrafo de error compartido.",[411,563,564,565,568,569,572],{},"Tabulación natural: ",[394,566,567],{},"from"," → ",[394,570,571],{},"to",". Respeta el orden visual.",[403,574,576],{"id":575},"variantes","Variantes",[408,578,579,590,596],{},[411,580,581,586,587,589],{},[436,582,583,584],{},"Un solo input con ",[394,585,422],{},": ",[394,588,396],{}," nativo permite capturar el rango en un único input con un solo calendario. Es más compacto y evita la validación cruzada. Usa esa forma cuando el espacio es limitado (celdas de tabla, filtros móviles); usa esta receta cuando el usuario necesita ver y editar cada extremo por separado.",[411,591,592,595],{},[436,593,594],{},"Con atajos rápidos",": agrega botones \"Hoy\", \"Esta semana\", \"Este mes\" encima o al lado del par que escriben ambas fechas de una vez. Ayuda a filtros de reportes.",[411,597,598,601,602,604,605,542,608,611,612,615],{},[436,599,600],{},"Fecha mínima / máxima",": cada ",[394,603,396],{}," acepta restricciones propias (",[394,606,607],{},"minDate",[394,609,610],{},"maxDate","). Usa el valor del otro extremo como límite dinámico (",[394,613,614],{},"minDate: from",") para evitar inversiones desde el calendario.",[403,617,619],{"id":618},"relacionado","Relacionado",[408,621,622,627],{},[411,623,624],{},[625,626,396],"a",{"href":81},[411,628,629],{},[625,630,521],{"href":322},{"title":632,"searchDepth":633,"depth":633,"links":634},"",2,[635,636,644,645],{"id":405,"depth":633,"text":406},{"id":426,"depth":633,"text":427,"children":637},[638,640,641,642,643],{"id":431,"depth":639,"text":432},3,{"id":457,"depth":639,"text":458},{"id":489,"depth":639,"text":490},{"id":514,"depth":639,"text":515},{"id":525,"depth":639,"text":526},{"id":575,"depth":633,"text":576},{"id":618,"depth":633,"text":619},"Patrón para capturar un rango \"desde / hasta\" usando dos SInputDate independientes con validación cruzada del orden.","md",null,{},{"icon":378},{"title":652,"description":653},"Receta Rango de fechas - Spartan Vue","Captura rangos de fechas con dos SInputDate \"desde\" y \"hasta\". Decisiones sobre layout lado a lado, validación cruzada y error coordinado.","mbs4pRY0NxI4TFvyCQwQiZJ6IOXAPxkSJYDwruHGy0w",[656,658],{"title":371,"path":372,"stem":373,"description":657,"icon":78,"children":-1},"Patrón para capturar moneda y monto como un único control usando SSelector junto a SInputAmount pegados mediante la prop rounded.",{"title":380,"path":381,"stem":382,"description":659,"icon":383,"children":-1},"Patrón para componer varios SSelector donde cada nivel depende del anterior, típico en direcciones país → departamento → ciudad.",1778801808172]