[{"data":1,"prerenderedAt":1311},["ShallowReactive",2],{"navigation_docs":3,"-getting-started-usage":170,"-getting-started-usage-surround":1306},[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":21,"body":172,"description":1299,"extension":1300,"links":1301,"meta":1302,"navigation":1303,"path":22,"seo":1304,"stem":23,"__hash__":1305},"docs\u002F1.getting-started\u002F3.usage.md",{"type":173,"value":174,"toc":1289},"minimark",[175,180,189,377,380,443,447,450,531,545,561,730,743,747,874,882,889,898,974,978,988,1039,1073,1077,1080,1257,1285],[176,177,179],"h2",{"id":178},"a-first-calendar","A first calendar",[181,182,183,184,188],"p",{},"Bind the calendar with ",[185,186,187],"code",{},"v-model",". Without a selection mode it only displays dates, so turn one on.",[190,191,193],"calendar-demo",{":config":192},"{\"isDatePicker\":true}",[194,195,200],"pre",{"className":196,"code":197,"language":198,"meta":199,"style":199},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport { ref } from 'vue'\nimport { FunctionalCalendar } from 'vue-functional-calendar'\nimport 'vue-functional-calendar\u002Fstyle.css'\n\nconst value = ref({})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFunctionalCalendar v-model=\"value\" is-date-picker \u002F>\n\u003C\u002Ftemplate>\n","vue","",[185,201,202,222,251,272,284,291,315,325,330,340,368],{"__ignoreMap":199},[203,204,207,211,215,219],"span",{"class":205,"line":206},"line",1,[203,208,210],{"class":209},"sMK4o","\u003C",[203,212,214],{"class":213},"swJcz","script",[203,216,218],{"class":217},"spNyl"," setup",[203,220,221],{"class":209},">\n",[203,223,225,229,232,236,239,242,245,248],{"class":205,"line":224},2,[203,226,228],{"class":227},"s7zQu","import",[203,230,231],{"class":209}," {",[203,233,235],{"class":234},"sTEyZ"," ref",[203,237,238],{"class":209}," }",[203,240,241],{"class":227}," from",[203,243,244],{"class":209}," '",[203,246,198],{"class":247},"sfazB",[203,249,250],{"class":209},"'\n",[203,252,254,256,258,261,263,265,267,270],{"class":205,"line":253},3,[203,255,228],{"class":227},[203,257,231],{"class":209},[203,259,260],{"class":234}," FunctionalCalendar",[203,262,238],{"class":209},[203,264,241],{"class":227},[203,266,244],{"class":209},[203,268,269],{"class":247},"vue-functional-calendar",[203,271,250],{"class":209},[203,273,275,277,279,282],{"class":205,"line":274},4,[203,276,228],{"class":227},[203,278,244],{"class":209},[203,280,281],{"class":247},"vue-functional-calendar\u002Fstyle.css",[203,283,250],{"class":209},[203,285,287],{"class":205,"line":286},5,[203,288,290],{"emptyLinePlaceholder":289},true,"\n",[203,292,294,297,300,303,306,309,312],{"class":205,"line":293},6,[203,295,296],{"class":217},"const",[203,298,299],{"class":234}," value ",[203,301,302],{"class":209},"=",[203,304,235],{"class":305},"s2Zo4",[203,307,308],{"class":234},"(",[203,310,311],{"class":209},"{}",[203,313,314],{"class":234},")\n",[203,316,318,321,323],{"class":205,"line":317},7,[203,319,320],{"class":209},"\u003C\u002F",[203,322,214],{"class":213},[203,324,221],{"class":209},[203,326,328],{"class":205,"line":327},8,[203,329,290],{"emptyLinePlaceholder":289},[203,331,333,335,338],{"class":205,"line":332},9,[203,334,210],{"class":209},[203,336,337],{"class":213},"template",[203,339,221],{"class":209},[203,341,343,346,349,352,354,357,360,362,365],{"class":205,"line":342},10,[203,344,345],{"class":209},"  \u003C",[203,347,348],{"class":213},"FunctionalCalendar",[203,350,351],{"class":217}," v-model",[203,353,302],{"class":209},[203,355,356],{"class":209},"\"",[203,358,359],{"class":234},"value",[203,361,356],{"class":209},[203,363,364],{"class":217}," is-date-picker",[203,366,367],{"class":209}," \u002F>\n",[203,369,371,373,375],{"class":205,"line":370},11,[203,372,320],{"class":209},[203,374,337],{"class":213},[203,376,221],{"class":209},[176,378,36],{"id":379},"selection-modes",[381,382,383,396],"table",{},[384,385,386],"thead",{},[387,388,389,393],"tr",{},[390,391,392],"th",{},"Prop",[390,394,395],{},"What users pick",[397,398,399,410,420,430],"tbody",{},[387,400,401,407],{},[402,403,404],"td",{},[185,405,406],{},"isDatePicker",[402,408,409],{},"One date.",[387,411,412,417],{},[402,413,414],{},[185,415,416],{},"isMultipleDatePicker",[402,418,419],{},"Any number of single dates.",[387,421,422,427],{},[402,423,424],{},[185,425,426],{},"isDateRange",[402,428,429],{},"One range with a start and an end.",[387,431,432,440],{},[402,433,434,436,437],{},[185,435,426],{}," with ",[185,438,439],{},"isMultipleDateRange",[402,441,442],{},"Several ranges.",[176,444,446],{"id":445},"the-bound-value","The bound value",[181,448,449],{},"The calendar keeps its whole state in one object. Which keys matter depends on the mode.",[381,451,452,462],{},[384,453,454],{},[387,455,456,459],{},[390,457,458],{},"Mode",[390,460,461],{},"Where the value lives",[397,463,464,491,505,518],{},[387,465,466,469],{},[402,467,468],{},"Date picker",[402,470,471,474,475,478,479,482,483,486,487,490],{},[185,472,473],{},"selectedDate",", a string in ",[185,476,477],{},"dateFormat",". With the time picker, also ",[185,480,481],{},"selectedDateTime",", ",[185,484,485],{},"selectedHour"," and ",[185,488,489],{},"selectedMinute",".",[387,492,493,496],{},[402,494,495],{},"Multiple date picker",[402,497,498,501,502,490],{},[185,499,500],{},"selectedDates",", a list of ",[185,503,504],{},"{ date, dateTime, hour, minute }",[387,506,507,510],{},[402,508,509],{},"Date range",[402,511,512,486,515,490],{},[185,513,514],{},"dateRange.start",[185,516,517],{},"dateRange.end",[387,519,520,523],{},[402,521,522],{},"Multiple date range",[402,524,525,501,528,490],{},[185,526,527],{},"multipleDateRange",[185,529,530],{},"{ start, end }",[181,532,533,536,537,540,541,544],{},[185,534,535],{},"currentDate"," is a ",[185,538,539],{},"Date"," in the month on display. ",[185,542,543],{},"selectedDatesItem"," is the text in the tags input.",[181,546,547,548,551,552,554,555,557,558,560],{},"The calendar edits the object it receives and emits that same object. Typed dates, time picker changes and the clear button update it in place, without an ",[185,549,550],{},"update:modelValue"," event. A bound plain object that lacks calendar keys, such as ",[185,553,311],{},", stays your object: the calendar fills in the missing keys when it mounts. Assigning a new ",[185,556,311],{}," object later clears the selection. A readonly or frozen object, a non-plain value, and an object holding only ",[185,559,527],{}," are read into the calendar's own state and are never written to. If you want every key from the start, begin with a full model:",[194,562,566],{"className":563,"code":564,"language":565,"meta":199,"style":199},"language-js shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","const value = ref({\n  currentDate: new Date(),\n  selectedDate: false,\n  selectedDateTime: false,\n  selectedHour: '00',\n  selectedMinute: '00',\n  selectedDatesItem: '',\n  selectedDates: [],\n  dateRange: { start: '', end: '' },\n  multipleDateRange: [],\n})\n","js",[185,567,568,583,603,616,627,644,659,671,683,712,723],{"__ignoreMap":199},[203,569,570,572,574,576,578,580],{"class":205,"line":206},[203,571,296],{"class":217},[203,573,299],{"class":234},[203,575,302],{"class":209},[203,577,235],{"class":305},[203,579,308],{"class":234},[203,581,582],{"class":209},"{\n",[203,584,585,588,591,594,597,600],{"class":205,"line":224},[203,586,587],{"class":213},"  currentDate",[203,589,590],{"class":209},":",[203,592,593],{"class":209}," new",[203,595,596],{"class":305}," Date",[203,598,599],{"class":234},"()",[203,601,602],{"class":209},",\n",[203,604,605,608,610,614],{"class":205,"line":253},[203,606,607],{"class":213},"  selectedDate",[203,609,590],{"class":209},[203,611,613],{"class":612},"sfNiH"," false",[203,615,602],{"class":209},[203,617,618,621,623,625],{"class":205,"line":274},[203,619,620],{"class":213},"  selectedDateTime",[203,622,590],{"class":209},[203,624,613],{"class":612},[203,626,602],{"class":209},[203,628,629,632,634,636,639,642],{"class":205,"line":286},[203,630,631],{"class":213},"  selectedHour",[203,633,590],{"class":209},[203,635,244],{"class":209},[203,637,638],{"class":247},"00",[203,640,641],{"class":209},"'",[203,643,602],{"class":209},[203,645,646,649,651,653,655,657],{"class":205,"line":293},[203,647,648],{"class":213},"  selectedMinute",[203,650,590],{"class":209},[203,652,244],{"class":209},[203,654,638],{"class":247},[203,656,641],{"class":209},[203,658,602],{"class":209},[203,660,661,664,666,669],{"class":205,"line":317},[203,662,663],{"class":213},"  selectedDatesItem",[203,665,590],{"class":209},[203,667,668],{"class":209}," ''",[203,670,602],{"class":209},[203,672,673,676,678,681],{"class":205,"line":327},[203,674,675],{"class":213},"  selectedDates",[203,677,590],{"class":209},[203,679,680],{"class":234}," []",[203,682,602],{"class":209},[203,684,685,688,690,692,695,697,699,702,705,707,709],{"class":205,"line":332},[203,686,687],{"class":213},"  dateRange",[203,689,590],{"class":209},[203,691,231],{"class":209},[203,693,694],{"class":213}," start",[203,696,590],{"class":209},[203,698,668],{"class":209},[203,700,701],{"class":209},",",[203,703,704],{"class":213}," end",[203,706,590],{"class":209},[203,708,668],{"class":209},[203,710,711],{"class":209}," },\n",[203,713,714,717,719,721],{"class":205,"line":342},[203,715,716],{"class":213},"  multipleDateRange",[203,718,590],{"class":209},[203,720,680],{"class":234},[203,722,602],{"class":209},[203,724,725,728],{"class":205,"line":370},[203,726,727],{"class":209},"}",[203,729,314],{"class":234},[181,731,732,733,735,736,739,740,490],{},"Date strings use ",[185,734,477],{},", which is ",[185,737,738],{},"dd\u002Fmm\u002Fyyyy hh:MM"," by default. Day and month are not padded, so you read ",[185,741,742],{},"5\u002F3\u002F2026",[176,744,746],{"id":745},"listen-to-events","Listen to events",[194,748,750],{"className":196,"code":749,"language":198,"meta":199,"style":199},"\u003CFunctionalCalendar\n  v-model=\"value\"\n  is-date-range\n  @choseDay=\"day => console.log(day.date)\"\n  @selectedDaysCount=\"count => console.log(count)\"\n  @changedMonth=\"date => console.log(date)\"\n\u002F>\n",[185,751,752,759,773,778,815,842,869],{"__ignoreMap":199},[203,753,754,756],{"class":205,"line":206},[203,755,210],{"class":209},[203,757,758],{"class":213},"FunctionalCalendar\n",[203,760,761,764,766,768,770],{"class":205,"line":224},[203,762,763],{"class":217},"  v-model",[203,765,302],{"class":209},[203,767,356],{"class":209},[203,769,359],{"class":234},[203,771,772],{"class":209},"\"\n",[203,774,775],{"class":205,"line":253},[203,776,777],{"class":217},"  is-date-range\n",[203,779,780,783,786,788,790,794,797,800,802,805,808,810,813],{"class":205,"line":274},[203,781,782],{"class":209},"  @",[203,784,785],{"class":217},"choseDay",[203,787,302],{"class":209},[203,789,356],{"class":209},[203,791,793],{"class":792},"sHdIc","day",[203,795,796],{"class":217}," =>",[203,798,799],{"class":234}," console",[203,801,490],{"class":209},[203,803,804],{"class":305},"log",[203,806,807],{"class":234},"(day",[203,809,490],{"class":209},[203,811,812],{"class":234},"date)",[203,814,772],{"class":209},[203,816,817,819,822,824,826,829,831,833,835,837,840],{"class":205,"line":286},[203,818,782],{"class":209},[203,820,821],{"class":217},"selectedDaysCount",[203,823,302],{"class":209},[203,825,356],{"class":209},[203,827,828],{"class":792},"count",[203,830,796],{"class":217},[203,832,799],{"class":234},[203,834,490],{"class":209},[203,836,804],{"class":305},[203,838,839],{"class":234},"(count)",[203,841,772],{"class":209},[203,843,844,846,849,851,853,856,858,860,862,864,867],{"class":205,"line":293},[203,845,782],{"class":209},[203,847,848],{"class":217},"changedMonth",[203,850,302],{"class":209},[203,852,356],{"class":209},[203,854,855],{"class":792},"date",[203,857,796],{"class":217},[203,859,799],{"class":234},[203,861,490],{"class":209},[203,863,804],{"class":305},[203,865,866],{"class":234},"(date)",[203,868,772],{"class":209},[203,870,871],{"class":205,"line":317},[203,872,873],{"class":234},"\u002F>\n",[181,875,876,877,881],{},"See ",[878,879,880],"a",{"href":102},"events"," for every payload.",[176,883,885,886],{"id":884},"configure-with-props-or-configs","Configure with props or ",[185,887,888],{},"configs",[181,890,891,892,894,895,897],{},"Pass props one by one, or group them in a ",[185,893,888],{}," object. When you pass ",[185,896,888],{},", the calendar reads its settings from there and ignores the matching props.",[194,899,901],{"className":196,"code":900,"language":198,"meta":199,"style":199},"\u003CFunctionalCalendar\n  v-model=\"value\"\n  :configs=\"{ isDateRange: true, dateFormat: 'yyyy-mm-dd', showWeekNumbers: true }\"\n\u002F>\n",[185,902,903,909,921,970],{"__ignoreMap":199},[203,904,905,907],{"class":205,"line":206},[203,906,210],{"class":209},[203,908,758],{"class":213},[203,910,911,913,915,917,919],{"class":205,"line":224},[203,912,763],{"class":217},[203,914,302],{"class":209},[203,916,356],{"class":209},[203,918,359],{"class":234},[203,920,772],{"class":209},[203,922,923,926,928,930,932,935,938,940,943,945,948,950,952,955,957,959,962,964,966,968],{"class":205,"line":253},[203,924,925],{"class":209},"  :",[203,927,888],{"class":217},[203,929,302],{"class":209},[203,931,356],{"class":209},[203,933,934],{"class":209},"{",[203,936,937],{"class":213}," isDateRange",[203,939,590],{"class":209},[203,941,942],{"class":612}," true",[203,944,701],{"class":209},[203,946,947],{"class":213}," dateFormat",[203,949,590],{"class":209},[203,951,244],{"class":209},[203,953,954],{"class":247},"yyyy-mm-dd",[203,956,641],{"class":209},[203,958,701],{"class":209},[203,960,961],{"class":213}," showWeekNumbers",[203,963,590],{"class":209},[203,965,942],{"class":612},[203,967,238],{"class":209},[203,969,772],{"class":209},[203,971,972],{"class":205,"line":274},[203,973,873],{"class":234},[176,975,977],{"id":976},"props-are-read-once","Props are read once",[181,979,980,981,983,984,987],{},"The calendar reads most props when it is created. Changing ",[185,982,426],{}," or ",[185,985,986],{},"locale"," afterwards has no effect. Re-key the component to rebuild it.",[194,989,991],{"className":196,"code":990,"language":198,"meta":199,"style":199},"\u003CFunctionalCalendar :key=\"locale\" :locale=\"locale\" is-date-picker v-model=\"value\" \u002F>\n",[185,992,993],{"__ignoreMap":199},[203,994,995,997,999,1002,1005,1007,1009,1011,1013,1015,1017,1019,1021,1023,1025,1027,1029,1031,1033,1035,1037],{"class":205,"line":206},[203,996,210],{"class":209},[203,998,348],{"class":213},[203,1000,1001],{"class":209}," :",[203,1003,1004],{"class":217},"key",[203,1006,302],{"class":209},[203,1008,356],{"class":209},[203,1010,986],{"class":234},[203,1012,356],{"class":209},[203,1014,1001],{"class":209},[203,1016,986],{"class":217},[203,1018,302],{"class":209},[203,1020,356],{"class":209},[203,1022,986],{"class":234},[203,1024,356],{"class":209},[203,1026,364],{"class":217},[203,1028,351],{"class":217},[203,1030,302],{"class":209},[203,1032,356],{"class":209},[203,1034,359],{"class":234},[203,1036,356],{"class":209},[203,1038,367],{"class":209},[181,1040,1041,1044,1045,482,1048,482,1051,482,1054,482,1057,482,1060,482,1063,486,1066,1069,1070,1072],{},[185,1042,1043],{},"modelValue"," and the data props are watched, so changing those works on a live calendar. The data props are ",[185,1046,1047],{},"markedDates",[185,1049,1050],{},"markedDateRange",[185,1052,1053],{},"disabledDates",[185,1055,1056],{},"enabledDates",[185,1058,1059],{},"disabledDayNames",[185,1061,1062],{},"limits",[185,1064,1065],{},"calendarsCount",[185,1067,1068],{},"isDark",". The same keys inside ",[185,1071,888],{}," are watched too.",[176,1074,1076],{"id":1075},"call-methods","Call methods",[181,1078,1079],{},"Use a template ref to move the calendar from code.",[194,1081,1083],{"className":196,"code":1082,"language":198,"meta":199,"style":199},"\u003Cscript setup>\nconst calendar = ref(null)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CFunctionalCalendar ref=\"calendar\" v-model=\"value\" \u002F>\n  \u003Cbutton @click=\"calendar.PreMonth()\">Previous\u003C\u002Fbutton>\n  \u003Cbutton @click=\"calendar.NextMonth()\">Next\u003C\u002Fbutton>\n  \u003Cbutton @click=\"calendar.ChooseDate('today')\">Today\u003C\u002Fbutton>\n\u003C\u002Ftemplate>\n",[185,1084,1085,1095,1113,1121,1125,1133,1162,1193,1221,1249],{"__ignoreMap":199},[203,1086,1087,1089,1091,1093],{"class":205,"line":206},[203,1088,210],{"class":209},[203,1090,214],{"class":213},[203,1092,218],{"class":217},[203,1094,221],{"class":209},[203,1096,1097,1099,1102,1104,1106,1108,1111],{"class":205,"line":224},[203,1098,296],{"class":217},[203,1100,1101],{"class":234}," calendar ",[203,1103,302],{"class":209},[203,1105,235],{"class":305},[203,1107,308],{"class":234},[203,1109,1110],{"class":209},"null",[203,1112,314],{"class":234},[203,1114,1115,1117,1119],{"class":205,"line":253},[203,1116,320],{"class":209},[203,1118,214],{"class":213},[203,1120,221],{"class":209},[203,1122,1123],{"class":205,"line":274},[203,1124,290],{"emptyLinePlaceholder":289},[203,1126,1127,1129,1131],{"class":205,"line":286},[203,1128,210],{"class":209},[203,1130,337],{"class":213},[203,1132,221],{"class":209},[203,1134,1135,1137,1139,1141,1143,1145,1148,1150,1152,1154,1156,1158,1160],{"class":205,"line":293},[203,1136,345],{"class":209},[203,1138,348],{"class":213},[203,1140,235],{"class":217},[203,1142,302],{"class":209},[203,1144,356],{"class":209},[203,1146,1147],{"class":247},"calendar",[203,1149,356],{"class":209},[203,1151,351],{"class":217},[203,1153,302],{"class":209},[203,1155,356],{"class":209},[203,1157,359],{"class":234},[203,1159,356],{"class":209},[203,1161,367],{"class":209},[203,1163,1164,1166,1169,1172,1174,1176,1179,1181,1184,1187,1189,1191],{"class":205,"line":317},[203,1165,345],{"class":209},[203,1167,1168],{"class":213},"button",[203,1170,1171],{"class":217}," @click",[203,1173,302],{"class":209},[203,1175,356],{"class":209},[203,1177,1178],{"class":247},"calendar.PreMonth()",[203,1180,356],{"class":209},[203,1182,1183],{"class":209},">",[203,1185,1186],{"class":234},"Previous",[203,1188,320],{"class":209},[203,1190,1168],{"class":213},[203,1192,221],{"class":209},[203,1194,1195,1197,1199,1201,1203,1205,1208,1210,1212,1215,1217,1219],{"class":205,"line":327},[203,1196,345],{"class":209},[203,1198,1168],{"class":213},[203,1200,1171],{"class":217},[203,1202,302],{"class":209},[203,1204,356],{"class":209},[203,1206,1207],{"class":247},"calendar.NextMonth()",[203,1209,356],{"class":209},[203,1211,1183],{"class":209},[203,1213,1214],{"class":234},"Next",[203,1216,320],{"class":209},[203,1218,1168],{"class":213},[203,1220,221],{"class":209},[203,1222,1223,1225,1227,1229,1231,1233,1236,1238,1240,1243,1245,1247],{"class":205,"line":332},[203,1224,345],{"class":209},[203,1226,1168],{"class":213},[203,1228,1171],{"class":217},[203,1230,302],{"class":209},[203,1232,356],{"class":209},[203,1234,1235],{"class":247},"calendar.ChooseDate('today')",[203,1237,356],{"class":209},[203,1239,1183],{"class":209},[203,1241,1242],{"class":234},"Today",[203,1244,320],{"class":209},[203,1246,1168],{"class":213},[203,1248,221],{"class":209},[203,1250,1251,1253,1255],{"class":205,"line":342},[203,1252,320],{"class":209},[203,1254,337],{"class":213},[203,1256,221],{"class":209},[181,1258,1259,482,1262,482,1265,486,1268,1271,1272,1275,1276,1278,1279,1282,1283,490],{},[185,1260,1261],{},"PreMonth",[185,1263,1264],{},"NextMonth",[185,1266,1267],{},"PreYear",[185,1269,1270],{},"NextYear"," take an optional calendar index. ",[185,1273,1274],{},"ChooseDate"," takes a date in ",[185,1277,477],{}," or the word ",[185,1280,1281],{},"today",", and moves the calendar there. It refuses a month outside ",[185,1284,1062],{},[1286,1287,1288],"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 .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}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);}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":199,"searchDepth":224,"depth":224,"links":1290},[1291,1292,1293,1294,1295,1297,1298],{"id":178,"depth":224,"text":179},{"id":379,"depth":224,"text":36},{"id":445,"depth":224,"text":446},{"id":745,"depth":224,"text":746},{"id":884,"depth":224,"text":1296},"Configure with props or configs",{"id":976,"depth":224,"text":977},{"id":1075,"depth":224,"text":1076},"Render a calendar, read the bound value and configure it.","md",null,{},{"icon":24},{"title":21,"description":1299},"PEX5d7UjurBA8R7Qzg4WO-hpZSKpW-j84gQ7kb3UauE",[1307,1309],{"title":16,"path":17,"stem":18,"description":1308,"icon":19,"children":-1},"Install Vue Functional Calendar and load its styles.",{"title":26,"path":27,"stem":28,"description":1310,"icon":29,"children":-1},"Move a Vue 2 app on Vue Functional Calendar 2.x to the Vue 3 build.",1792736102158]