[{"data":1,"prerenderedAt":531},["ShallowReactive",2],{"navigation_docs":3,"-essentials-slots":170,"-essentials-slots-surround":526},[4,30,110,150,155],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"\u002Fgetting-started","1.getting-started",[10,15,20,25],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction","i-lucide-book-open",{"title":16,"path":17,"stem":18,"icon":19},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":21,"path":22,"stem":23,"icon":24},"Usage","\u002Fgetting-started\u002Fusage","1.getting-started\u002F3.usage","i-lucide-play",{"title":26,"path":27,"stem":28,"icon":29},"Migrate from 2.x","\u002Fgetting-started\u002Fmigration","1.getting-started\u002F4.migration","i-lucide-arrow-right-left",{"title":31,"path":32,"stem":33,"children":34,"page":6},"Essentials","\u002Fessentials","2.essentials",[35,40,45,50,55,60,65,70,75,80,85,90,95,100,105],{"title":36,"path":37,"stem":38,"icon":39},"Selection modes","\u002Fessentials\u002Fselection-modes","2.essentials\u002F01.selection-modes","i-lucide-mouse-pointer-click",{"title":41,"path":42,"stem":43,"icon":44},"Multiple calendars","\u002Fessentials\u002Fmultiple-calendars","2.essentials\u002F02.multiple-calendars","i-lucide-columns-2",{"title":46,"path":47,"stem":48,"icon":49},"Time picker","\u002Fessentials\u002Ftime-picker","2.essentials\u002F03.time-picker","i-lucide-clock",{"title":51,"path":52,"stem":53,"icon":54},"Limits and availability","\u002Fessentials\u002Flimits-and-availability","2.essentials\u002F04.limits-and-availability","i-lucide-ban",{"title":56,"path":57,"stem":58,"icon":59},"Marking","\u002Fessentials\u002Fmarking","2.essentials\u002F05.marking","i-lucide-bookmark",{"title":61,"path":62,"stem":63,"icon":64},"Layout and names","\u002Fessentials\u002Flayout-and-names","2.essentials\u002F06.layout-and-names","i-lucide-layout-template",{"title":66,"path":67,"stem":68,"icon":69},"Theming","\u002Fessentials\u002Ftheming","2.essentials\u002F07.theming","i-lucide-palette",{"title":71,"path":72,"stem":73,"icon":74},"Keyboard","\u002Fessentials\u002Fkeyboard","2.essentials\u002F08.keyboard","i-lucide-keyboard",{"title":76,"path":77,"stem":78,"icon":79},"Typeable input","\u002Fessentials\u002Ftypeable-input","2.essentials\u002F09.typeable-input","i-lucide-text-cursor-input",{"title":81,"path":82,"stem":83,"icon":84},"Locale and labels","\u002Fessentials\u002Flocale","2.essentials\u002F10.locale","i-lucide-languages",{"title":86,"path":87,"stem":88,"icon":89},"Presets","\u002Fessentials\u002Fpresets","2.essentials\u002F11.presets","i-lucide-zap",{"title":91,"path":92,"stem":93,"icon":94},"Accessibility","\u002Fessentials\u002Faccessibility","2.essentials\u002F12.accessibility","i-lucide-accessibility",{"title":96,"path":97,"stem":98,"icon":99},"Props","\u002Fessentials\u002Fprops","2.essentials\u002F13.props","i-lucide-list",{"title":101,"path":102,"stem":103,"icon":104},"Events","\u002Fessentials\u002Fevents","2.essentials\u002F14.events","i-lucide-radio",{"title":106,"path":107,"stem":108,"icon":109},"Slots","\u002Fessentials\u002Fslots","2.essentials\u002F15.slots","i-lucide-puzzle",{"title":111,"icon":112,"path":113,"stem":114,"children":115,"page":6},"Examples","i-lucide-layout-grid","\u002Fexamples","3.examples",[116,119,122,126,129,132,136,139,143,146],{"title":36,"path":117,"stem":118,"icon":39},"\u002Fexamples\u002Fselection-modes","3.examples\u002F01.selection-modes",{"title":41,"path":120,"stem":121,"icon":44},"\u002Fexamples\u002Fmultiple-calendars","3.examples\u002F02.multiple-calendars",{"title":123,"path":124,"stem":125,"icon":79},"Modal and typeable inputs","\u002Fexamples\u002Fmodal-and-inputs","3.examples\u002F03.modal-and-inputs",{"title":46,"path":127,"stem":128,"icon":49},"\u002Fexamples\u002Ftime-picker","3.examples\u002F04.time-picker",{"title":51,"path":130,"stem":131,"icon":54},"\u002Fexamples\u002Flimits-and-availability","3.examples\u002F05.limits-and-availability",{"title":133,"path":134,"stem":135,"icon":59},"Marking and layout","\u002Fexamples\u002Fmarking","3.examples\u002F06.marking",{"title":106,"path":137,"stem":138,"icon":109},"\u002Fexamples\u002Fslots","3.examples\u002F07.slots",{"title":140,"path":141,"stem":142,"icon":89},"Range presets","\u002Fexamples\u002Fpresets","3.examples\u002F08.presets",{"title":81,"path":144,"stem":145,"icon":84},"\u002Fexamples\u002Flocale","3.examples\u002F09.locale",{"title":147,"path":148,"stem":149,"icon":69},"Theming and dark mode","\u002Fexamples\u002Ftheming-and-dark-mode","3.examples\u002F10.theming-and-dark-mode",{"title":151,"path":152,"stem":153,"icon":154},"Playground","\u002Fplayground","4.playground","i-lucide-sliders-horizontal",{"title":156,"path":157,"stem":158,"children":159,"page":6},"Community","\u002Fcommunity","5.community",[160,165],{"title":161,"path":162,"stem":163,"icon":164},"Contributing","\u002Fcommunity\u002Fcontributing","5.community\u002F1.contributing","i-lucide-git-pull-request",{"title":166,"path":167,"stem":168,"icon":169},"Changelog","\u002Fcommunity\u002Fchangelog","5.community\u002F2.changelog","i-lucide-history",{"id":171,"title":106,"body":172,"description":519,"extension":520,"links":521,"meta":522,"navigation":523,"path":107,"seo":524,"stem":108,"__hash__":525},"docs\u002F2.essentials\u002F15.slots.md",{"type":173,"value":174,"toc":513},"minimark",[175,278,394,399,431,442,449,453,469,473,490,494,509],[176,177,178],"calendar-slots-demo",{},[179,180,185],"pre",{"className":181,"code":182,"language":183,"meta":184,"style":184},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CFunctionalCalendar v-model=\"value\" is-date-picker always-use-default-classes>\n  \u003Ctemplate #default=\"{ day }\">\n    \u003Cstrong v-if=\"isWeekend(day)\" style=\"pointer-events: none\">{{ day.day }}\u003C\u002Fstrong>\n    \u003Ctemplate v-else>{{ day.day }}\u003C\u002Ftemplate>\n  \u003C\u002Ftemplate>\n  \u003Ctemplate #navigationArrowLeft>←\u003C\u002Ftemplate>\n  \u003Ctemplate #navigationArrowRight>→\u003C\u002Ftemplate>\n  \u003Ctemplate #footer>\u003Csmall>Weekends are bold.\u003C\u002Fsmall>\u003C\u002Ftemplate>\n\u003C\u002FFunctionalCalendar>\n","vue","",[186,187,188,226,232,238,244,250,256,262,268],"code",{"__ignoreMap":184},[189,190,193,197,201,205,208,211,215,217,220,223],"span",{"class":191,"line":192},"line",1,[189,194,196],{"class":195},"sMK4o","\u003C",[189,198,200],{"class":199},"swJcz","FunctionalCalendar",[189,202,204],{"class":203},"spNyl"," v-model",[189,206,207],{"class":195},"=",[189,209,210],{"class":195},"\"",[189,212,214],{"class":213},"sTEyZ","value",[189,216,210],{"class":195},[189,218,219],{"class":203}," is-date-picker",[189,221,222],{"class":203}," always-use-default-classes",[189,224,225],{"class":195},">\n",[189,227,229],{"class":191,"line":228},2,[189,230,231],{"class":213},"  \u003Ctemplate #default=\"{ day }\">\n",[189,233,235],{"class":191,"line":234},3,[189,236,237],{"class":213},"    \u003Cstrong v-if=\"isWeekend(day)\" style=\"pointer-events: none\">{{ day.day }}\u003C\u002Fstrong>\n",[189,239,241],{"class":191,"line":240},4,[189,242,243],{"class":213},"    \u003Ctemplate v-else>{{ day.day }}\u003C\u002Ftemplate>\n",[189,245,247],{"class":191,"line":246},5,[189,248,249],{"class":213},"  \u003C\u002Ftemplate>\n",[189,251,253],{"class":191,"line":252},6,[189,254,255],{"class":213},"  \u003Ctemplate #navigationArrowLeft>←\u003C\u002Ftemplate>\n",[189,257,259],{"class":191,"line":258},7,[189,260,261],{"class":213},"  \u003Ctemplate #navigationArrowRight>→\u003C\u002Ftemplate>\n",[189,263,265],{"class":191,"line":264},8,[189,266,267],{"class":213},"  \u003Ctemplate #footer>\u003Csmall>Weekends are bold.\u003C\u002Fsmall>\u003C\u002Ftemplate>\n",[189,269,271,274,276],{"class":191,"line":270},9,[189,272,273],{"class":195},"\u003C\u002F",[189,275,200],{"class":199},[189,277,225],{"class":195},[279,280,281,296],"table",{},[282,283,284],"thead",{},[285,286,287,291,293],"tr",{},[288,289,290],"th",{},"Slot",[288,292,96],{},[288,294,295],{},"Replaces",[297,298,299,315,328,340,352,364,379],"tbody",{},[285,300,301,307,312],{},[302,303,304],"td",{},[186,305,306],{},"default",[302,308,309],{},[186,310,311],{},"{ week, day }",[302,313,314],{},"The content of a day cell",[285,316,317,322,325],{},[302,318,319],{},[186,320,321],{},"navigationArrowLeft",[302,323,324],{},"none",[302,326,327],{},"The previous month arrow",[285,329,330,335,337],{},[302,331,332],{},[186,333,334],{},"navigationArrowRight",[302,336,324],{},[302,338,339],{},"The next month arrow",[285,341,342,347,349],{},[302,343,344],{},[186,345,346],{},"cleaner",[302,348,324],{},[302,350,351],{},"The clear button of a range",[285,353,354,359,361],{},[302,355,356],{},[186,357,358],{},"footer",[302,360,324],{},[302,362,363],{},"Adds content below the calendar",[285,365,366,371,376],{},[302,367,368],{},[186,369,370],{},"dateRangeInputs",[302,372,373],{},[186,374,375],{},"{ startDate, endDate, isTypeable, dialogId }",[302,377,378],{},"The two inputs of a modal range",[285,380,381,386,391],{},[302,382,383],{},[186,384,385],{},"datePickerInput",[302,387,388],{},[186,389,390],{},"{ selectedDate, isTypeable, dialogId }",[302,392,393],{},"The input of a modal date picker",[395,396,398],"h2",{"id":397},"the-day-slot","The day slot",[400,401,402,405,406,411,412,415,416,419,420,419,423,426,427,430],"p",{},[186,403,404],{},"day"," is the ",[407,408,410],"a",{"href":409},"\u002Fessentials\u002Fevents#the-day-object","day object",". ",[186,413,414],{},"week"," has ",[186,417,418],{},"number",", ",[186,421,422],{},"start",[186,424,425],{},"end"," and ",[186,428,429],{},"days",".",[400,432,433,434,437,438,441],{},"A day slot removes the default ",[186,435,436],{},"vfc-span-day"," class from the cell. Pass ",[186,439,440],{},"alwaysUseDefaultClasses"," to keep it, along with its selection and range styling. Without it, you style the cell yourself.",[400,443,444,445,448],{},"The cell selects only when the click lands on the cell itself, as in 2.x. Set ",[186,446,447],{},"pointer-events: none"," on the elements inside your slot so clicks reach the cell.",[395,450,452],{"id":451},"arrows","Arrows",[400,454,455,456,426,459,462,463,426,466,430],{},"An arrow slot that contains a button or a link keeps its own focus. Any other content is wrapped with ",[186,457,458],{},"role=\"button\"",[186,460,461],{},"tabindex=\"0\"",", and responds to Enter and Space. The label comes from ",[186,464,465],{},"labels.previousMonth",[186,467,468],{},"labels.nextMonth",[395,470,472],{"id":471},"cleaner-and-footer","Cleaner and footer",[400,474,475,476,479,480,482,483,485,486,489],{},"The footer row renders when ",[186,477,478],{},"canClearRange"," is on or you set the ",[186,481,358],{}," slot. The ",[186,484,346],{}," slot replaces the default clear button inside that row, and clicking inside it clears the range. The default clear button needs ",[186,487,488],{},"isDateRange"," as well.",[395,491,493],{"id":492},"inputs","Inputs",[400,495,496,497,500,501,504,505,430],{},"The input slots only render in modal mode. Keep ",[186,498,499],{},":readonly=\"!isTypeable\""," on your inputs so they follow the ",[186,502,503],{},"isTypeable"," prop. See the ",[407,506,508],{"href":507},"\u002Fexamples\u002Fmodal-and-inputs#your-own-range-inputs","examples",[510,511,512],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":184,"searchDepth":228,"depth":228,"links":514},[515,516,517,518],{"id":397,"depth":228,"text":398},{"id":451,"depth":228,"text":452},{"id":471,"depth":228,"text":472},{"id":492,"depth":228,"text":493},"Replace parts of the calendar with your own markup.","md",null,{},{"icon":109},{"title":106,"description":519},"Oj1mFKQuzVmD9pc0MAc4A6rKW9swy6j2PUEaho8P-FY",[527,529],{"title":101,"path":102,"stem":103,"description":528,"icon":104,"children":-1},"Every event and its payload.",{"title":36,"path":117,"stem":118,"description":530,"icon":39,"children":-1},"Pick one date, a range, several dates or several ranges.",1792736104205]