[{"data":1,"prerenderedAt":1575},["ShallowReactive",2],{"navigation_docs":3,"-essentials-theming":170,"-essentials-theming-surround":1570},[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":66,"body":172,"description":1563,"extension":1564,"links":1565,"meta":1566,"navigation":1567,"path":67,"seo":1568,"stem":68,"__hash__":1569},"docs\u002F2.essentials\u002F07.theming.md",{"type":173,"value":174,"toc":1553},"minimark",[175,188,326,331,406,416,465,474,518,522,553,558,603,608,612,987,991,1056,1060,1063,1217,1221,1235,1357,1368,1372,1385,1527,1539,1543,1550],[176,177,178,179,183,184,187],"p",{},"The calendar reads its colors, sizes and fonts from ",[180,181,182],"code",{},"--vfc-*"," custom properties. Set one on the calendar, on any ancestor, or on ",[180,185,186],{},":root",". Pick a theme below and watch the tokens change.",[189,190,191],"calendar-theme-demo",{},[192,193,198],"pre",{"className":194,"code":195,"language":196,"meta":197,"style":197},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cdiv class=\"my-calendar\">\n  \u003CFunctionalCalendar v-model=\"value\" is-date-range can-clear-range \u002F>\n\u003C\u002Fdiv>\n\n\u003Cstyle>\n.my-calendar {\n  --vfc-primary: #e11d48;\n  --vfc-on-primary: #ffffff;\n}\n\u003C\u002Fstyle>\n","vue","",[180,199,200,232,239,249,256,266,278,296,311,317],{"__ignoreMap":197},[201,202,205,209,213,217,220,223,227,229],"span",{"class":203,"line":204},"line",1,[201,206,208],{"class":207},"sMK4o","\u003C",[201,210,212],{"class":211},"swJcz","div",[201,214,216],{"class":215},"spNyl"," class",[201,218,219],{"class":207},"=",[201,221,222],{"class":207},"\"",[201,224,226],{"class":225},"sfazB","my-calendar",[201,228,222],{"class":207},[201,230,231],{"class":207},">\n",[201,233,235],{"class":203,"line":234},2,[201,236,238],{"class":237},"sTEyZ","  \u003CFunctionalCalendar v-model=\"value\" is-date-range can-clear-range \u002F>\n",[201,240,242,245,247],{"class":203,"line":241},3,[201,243,244],{"class":207},"\u003C\u002F",[201,246,212],{"class":211},[201,248,231],{"class":207},[201,250,252],{"class":203,"line":251},4,[201,253,255],{"emptyLinePlaceholder":254},true,"\n",[201,257,259,261,264],{"class":203,"line":258},5,[201,260,208],{"class":207},[201,262,263],{"class":211},"style",[201,265,231],{"class":207},[201,267,269,272,275],{"class":203,"line":268},6,[201,270,271],{"class":207},".",[201,273,226],{"class":274},"sBMFI",[201,276,277],{"class":207}," {\n",[201,279,281,284,287,290,293],{"class":203,"line":280},7,[201,282,283],{"class":237},"  --vfc-primary",[201,285,286],{"class":207},":",[201,288,289],{"class":207}," #",[201,291,292],{"class":237},"e11d48",[201,294,295],{"class":207},";\n",[201,297,299,302,304,306,309],{"class":203,"line":298},8,[201,300,301],{"class":237},"  --vfc-on-primary",[201,303,286],{"class":207},[201,305,289],{"class":207},[201,307,308],{"class":237},"ffffff",[201,310,295],{"class":207},[201,312,314],{"class":203,"line":313},9,[201,315,316],{"class":207},"}\n",[201,318,320,322,324],{"class":203,"line":319},10,[201,321,244],{"class":207},[201,323,263],{"class":211},[201,325,231],{"class":207},[327,328,330],"h2",{"id":329},"where-to-set-tokens","Where to set tokens",[192,332,336],{"className":333,"code":334,"language":335,"meta":197,"style":197},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight",":root {\n  --vfc-radius: 4px;\n}\n\n.booking-form {\n  --vfc-primary: #0d9488;\n  --vfc-on-primary: #ffffff;\n}\n","css",[180,337,338,347,360,364,368,377,390,402],{"__ignoreMap":197},[201,339,340,342,345],{"class":203,"line":204},[201,341,286],{"class":207},[201,343,344],{"class":215},"root",[201,346,277],{"class":207},[201,348,349,352,354,358],{"class":203,"line":234},[201,350,351],{"class":237},"  --vfc-radius",[201,353,286],{"class":207},[201,355,357],{"class":356},"sbssI"," 4px",[201,359,295],{"class":207},[201,361,362],{"class":203,"line":241},[201,363,316],{"class":207},[201,365,366],{"class":203,"line":251},[201,367,255],{"emptyLinePlaceholder":254},[201,369,370,372,375],{"class":203,"line":258},[201,371,271],{"class":207},[201,373,374],{"class":274},"booking-form",[201,376,277],{"class":207},[201,378,379,381,383,385,388],{"class":203,"line":268},[201,380,283],{"class":237},[201,382,286],{"class":207},[201,384,289],{"class":207},[201,386,387],{"class":237},"0d9488",[201,389,295],{"class":207},[201,391,392,394,396,398,400],{"class":203,"line":280},[201,393,301],{"class":237},[201,395,286],{"class":207},[201,397,289],{"class":207},[201,399,308],{"class":237},[201,401,295],{"class":207},[201,403,404],{"class":203,"line":298},[201,405,316],{"class":207},[176,407,408,409,411,412,415],{},"You can also set them on one calendar with a ",[180,410,263],{}," or ",[180,413,414],{},"class"," attribute. Both land on the root element of the component.",[192,417,419],{"className":194,"code":418,"language":196,"meta":197,"style":197},"\u003CFunctionalCalendar style=\"--vfc-primary: #0d9488; --vfc-on-primary: #fff\" is-date-picker \u002F>\n",[180,420,421],{"__ignoreMap":197},[201,422,423,425,428,431,433,435,438,440,442,444,447,450,452,454,457,459,462],{"class":203,"line":204},[201,424,208],{"class":207},[201,426,427],{"class":211},"FunctionalCalendar",[201,429,430],{"class":215}," style",[201,432,219],{"class":207},[201,434,222],{"class":207},[201,436,437],{"class":237},"--vfc-primary",[201,439,286],{"class":207},[201,441,289],{"class":207},[201,443,387],{"class":237},[201,445,446],{"class":207},";",[201,448,449],{"class":237}," --vfc-on-primary",[201,451,286],{"class":207},[201,453,289],{"class":207},[201,455,456],{"class":237},"fff",[201,458,222],{"class":207},[201,460,461],{"class":215}," is-date-picker",[201,463,464],{"class":207}," \u002F>\n",[176,466,467,468,470,471,286],{},"A token on ",[180,469,186],{}," applies in light and dark. To change a value in dark mode only, scope it to ",[180,472,473],{},".vfc-dark",[192,475,477],{"className":333,"code":476,"language":335,"meta":197,"style":197},".vfc-dark {\n  --vfc-primary: #2dd4bf;\n  --vfc-on-primary: #042f2e;\n}\n",[180,478,479,488,501,514],{"__ignoreMap":197},[201,480,481,483,486],{"class":203,"line":204},[201,482,271],{"class":207},[201,484,485],{"class":274},"vfc-dark",[201,487,277],{"class":207},[201,489,490,492,494,496,499],{"class":203,"line":234},[201,491,283],{"class":237},[201,493,286],{"class":207},[201,495,289],{"class":207},[201,497,498],{"class":237},"2dd4bf",[201,500,295],{"class":207},[201,502,503,505,507,509,512],{"class":203,"line":241},[201,504,301],{"class":237},[201,506,286],{"class":207},[201,508,289],{"class":207},[201,510,511],{"class":237},"042f2e",[201,513,295],{"class":207},[201,515,516],{"class":203,"line":251},[201,517,316],{"class":207},[327,519,521],{"id":520},"dark-mode","Dark mode",[176,523,524,527,528,530,531,534,535,538,539,542,543,538,546,549,550,552],{},[180,525,526],{},"isDark"," adds the ",[180,529,485],{}," class to the calendar and its input. The dark block changes colors and shadows only. Radius, spacing, fonts, ",[180,532,533],{},"--vfc-day-size",", ",[180,536,537],{},"--vfc-header-height"," and ",[180,540,541],{},"--vfc-transition"," keep their values. ",[180,544,545],{},"--vfc-today",[180,547,548],{},"--vfc-focus"," default to ",[180,551,437],{},", so they follow the dark primary.",[176,554,555,556,286],{},"To follow your site theme, bind ",[180,557,526],{},[192,559,561],{"className":194,"code":560,"language":196,"meta":197,"style":197},"\u003CFunctionalCalendar :is-dark=\"colorMode.value === 'dark'\" is-date-picker \u002F>\n",[180,562,563],{"__ignoreMap":197},[201,564,565,567,569,572,575,577,579,582,584,587,590,593,596,599,601],{"class":203,"line":204},[201,566,208],{"class":207},[201,568,427],{"class":211},[201,570,571],{"class":207}," :",[201,573,574],{"class":215},"is-dark",[201,576,219],{"class":207},[201,578,222],{"class":207},[201,580,581],{"class":237},"colorMode",[201,583,271],{"class":207},[201,585,586],{"class":237},"value ",[201,588,589],{"class":207},"===",[201,591,592],{"class":207}," '",[201,594,595],{"class":225},"dark",[201,597,598],{"class":207},"'\"",[201,600,461],{"class":215},[201,602,464],{"class":207},[176,604,605,607],{},[180,606,526],{}," is watched, so the calendar follows the theme without a re-key.",[327,609,611],{"id":610},"color-tokens","Color tokens",[613,614,615,634],"table",{},[616,617,618],"thead",{},[619,620,621,625,628,631],"tr",{},[622,623,624],"th",{},"Token",[622,626,627],{},"Light",[622,629,630],{},"Dark",[622,632,633],{},"Used for",[635,636,637,657,677,696,715,735,755,775,795,815,835,855,875,895,915,932,949,969],"tbody",{},[619,638,639,644,649,654],{},[640,641,642],"td",{},[180,643,437],{},[640,645,646],{},[180,647,648],{},"hsl(228 70% 50%)",[640,650,651],{},[180,652,653],{},"hsl(228 88% 68%)",[640,655,656],{},"Selected days, active controls",[619,658,659,664,669,674],{},[640,660,661],{},[180,662,663],{},"--vfc-on-primary",[640,665,666],{},[180,667,668],{},"hsl(0 0% 100%)",[640,670,671],{},[180,672,673],{},"hsl(228 40% 8%)",[640,675,676],{},"Text on the primary color",[619,678,679,684,688,693],{},[640,680,681],{},[180,682,683],{},"--vfc-bg",[640,685,686],{},[180,687,668],{},[640,689,690],{},[180,691,692],{},"hsl(228 24% 9%)",[640,694,695],{},"Calendar background",[619,697,698,703,707,712],{},[640,699,700],{},[180,701,702],{},"--vfc-bg-raised",[640,704,705],{},[180,706,683],{},[640,708,709],{},[180,710,711],{},"#1c1f27",[640,713,714],{},"Pickers and presets",[619,716,717,722,727,732],{},[640,718,719],{},[180,720,721],{},"--vfc-text",[640,723,724],{},[180,725,726],{},"hsl(228 32% 12%)",[640,728,729],{},[180,730,731],{},"hsl(228 20% 96%)",[640,733,734],{},"Main text",[619,736,737,742,747,752],{},[640,738,739],{},[180,740,741],{},"--vfc-text-muted",[640,743,744],{},[180,745,746],{},"#60636d",[640,748,749],{},[180,750,751],{},"#abacb1",[640,753,754],{},"Day names, neighbor month days",[619,756,757,762,767,772],{},[640,758,759],{},[180,760,761],{},"--vfc-text-disabled",[640,763,764],{},[180,765,766],{},"#b4b5ba",[640,768,769],{},[180,770,771],{},"#595c62",[640,773,774],{},"Disabled days",[619,776,777,782,787,792],{},[640,778,779],{},[180,780,781],{},"--vfc-border",[640,783,784],{},[180,785,786],{},"#e3e3e5",[640,788,789],{},[180,790,791],{},"#2c2f36",[640,793,794],{},"Dividers and outlines",[619,796,797,802,807,812],{},[640,798,799],{},[180,800,801],{},"--vfc-border-strong",[640,803,804],{},[180,805,806],{},"#7e8189",[640,808,809],{},[180,810,811],{},"#82848a",[640,813,814],{},"Input and button borders",[619,816,817,822,827,832],{},[640,818,819],{},[180,820,821],{},"--vfc-hover",[640,823,824],{},[180,825,826],{},"#f1f1f2",[640,828,829],{},[180,830,831],{},"#23262e",[640,833,834],{},"Hover background",[619,836,837,842,847,852],{},[640,838,839],{},[180,840,841],{},"--vfc-primary-hover",[640,843,844],{},[180,845,846],{},"#2443c0",[640,848,849],{},[180,850,851],{},"#7a92f5",[640,853,854],{},"Hover on primary parts",[619,856,857,862,867,872],{},[640,858,859],{},[180,860,861],{},"--vfc-range-mix",[640,863,864],{},[180,865,866],{},"12%",[640,868,869],{},[180,870,871],{},"26%",[640,873,874],{},"Share of primary in the range colors",[619,876,877,882,887,892],{},[640,878,879],{},[180,880,881],{},"--vfc-range",[640,883,884],{},[180,885,886],{},"#e5e9fa",[640,888,889],{},[180,890,891],{},"#273154",[640,893,894],{},"Range fill",[619,896,897,902,907,912],{},[640,898,899],{},[180,900,901],{},"--vfc-range-strong",[640,903,904],{},[180,905,906],{},"#dbe1f9",[640,908,909],{},[180,910,911],{},"#303c6b",[640,913,914],{},"Range ends and hover",[619,916,917,921,925,929],{},[640,918,919],{},[180,920,545],{},[640,922,923],{},[180,924,437],{},[640,926,927],{},[180,928,437],{},[640,930,931],{},"Today marker",[619,933,934,938,942,946],{},[640,935,936],{},[180,937,548],{},[640,939,940],{},[180,941,437],{},[640,943,944],{},[180,945,437],{},[640,947,948],{},"Focus ring",[619,950,951,956,961,966],{},[640,952,953],{},[180,954,955],{},"--vfc-danger",[640,957,958],{},[180,959,960],{},"hsl(0 70% 42%)",[640,962,963],{},[180,964,965],{},"hsl(0 84% 68%)",[640,967,968],{},"Remove badge on a range",[619,970,971,976,980,984],{},[640,972,973],{},[180,974,975],{},"--vfc-on-danger",[640,977,978],{},[180,979,668],{},[640,981,982],{},[180,983,673],{},[640,985,986],{},"Text on the danger color",[327,988,990],{"id":989},"shadow-tokens","Shadow tokens",[613,992,993,1003],{},[616,994,995],{},[619,996,997,999,1001],{},[622,998,624],{},[622,1000,627],{},[622,1002,630],{},[635,1004,1005,1022,1039],{},[619,1006,1007,1012,1017],{},[640,1008,1009],{},[180,1010,1011],{},"--vfc-shadow-sm",[640,1013,1014],{},[180,1015,1016],{},"0 1px 2px hsl(228 40% 10% \u002F 0.08)",[640,1018,1019],{},[180,1020,1021],{},"0 1px 2px hsl(228 50% 2% \u002F 0.4)",[619,1023,1024,1029,1034],{},[640,1025,1026],{},[180,1027,1028],{},"--vfc-shadow-md",[640,1030,1031],{},[180,1032,1033],{},"0 4px 12px hsl(228 40% 10% \u002F 0.1), 0 1px 3px hsl(228 40% 10% \u002F 0.08)",[640,1035,1036],{},[180,1037,1038],{},"0 4px 12px hsl(228 50% 2% \u002F 0.5), 0 1px 3px hsl(228 50% 2% \u002F 0.4)",[619,1040,1041,1046,1051],{},[640,1042,1043],{},[180,1044,1045],{},"--vfc-shadow-lg",[640,1047,1048],{},[180,1049,1050],{},"0 16px 32px hsl(228 40% 10% \u002F 0.12), 0 4px 8px hsl(228 40% 10% \u002F 0.08)",[640,1052,1053],{},[180,1054,1055],{},"0 16px 32px hsl(228 50% 2% \u002F 0.6), 0 4px 8px hsl(228 50% 2% \u002F 0.5)",[327,1057,1059],{"id":1058},"shape-spacing-and-type-tokens","Shape, spacing and type tokens",[176,1061,1062],{},"These are the same in light and dark.",[613,1064,1065,1074],{},[616,1066,1067],{},[619,1068,1069,1071],{},[622,1070,624],{},[622,1072,1073],{},"Default",[635,1075,1076,1100,1126,1138,1160,1184,1195,1206],{},[619,1077,1078,1089],{},[640,1079,1080,534,1083,534,1086],{},[180,1081,1082],{},"--vfc-radius-sm",[180,1084,1085],{},"--vfc-radius",[180,1087,1088],{},"--vfc-radius-lg",[640,1090,1091,534,1094,534,1097],{},[180,1092,1093],{},"6px",[180,1095,1096],{},"8px",[180,1098,1099],{},"12px",[619,1101,1102,1111],{},[640,1103,1104,1107,1108],{},[180,1105,1106],{},"--vfc-space-1"," to ",[180,1109,1110],{},"--vfc-space-5",[640,1112,1113,534,1116,534,1118,534,1120,534,1123],{},[180,1114,1115],{},"4px",[180,1117,1096],{},[180,1119,1099],{},[180,1121,1122],{},"16px",[180,1124,1125],{},"24px",[619,1127,1128,1133],{},[640,1129,1130],{},[180,1131,1132],{},"--vfc-font",[640,1134,1135],{},[180,1136,1137],{},"ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif",[619,1139,1140,1151],{},[640,1141,1142,534,1145,534,1148],{},[180,1143,1144],{},"--vfc-font-size-xs",[180,1146,1147],{},"-sm",[180,1149,1150],{},"-md",[640,1152,1153,534,1155,534,1158],{},[180,1154,1099],{},[180,1156,1157],{},"14px",[180,1159,1122],{},[619,1161,1162,1173],{},[640,1163,1164,534,1167,534,1170],{},[180,1165,1166],{},"--vfc-font-weight",[180,1168,1169],{},"-medium",[180,1171,1172],{},"-strong",[640,1174,1175,534,1178,534,1181],{},[180,1176,1177],{},"400",[180,1179,1180],{},"500",[180,1182,1183],{},"600",[619,1185,1186,1190],{},[640,1187,1188],{},[180,1189,533],{},[640,1191,1192],{},[180,1193,1194],{},"36px",[619,1196,1197,1201],{},[640,1198,1199],{},[180,1200,537],{},[640,1202,1203],{},[180,1204,1205],{},"40px",[619,1207,1208,1212],{},[640,1209,1210],{},[180,1211,541],{},[640,1213,1214],{},[180,1215,1216],{},"150ms ease",[327,1218,1220],{"id":1219},"derived-colors","Derived colors",[176,1222,1223,1224,1227,1228,534,1230,411,1232,1234],{},"Where the browser supports ",[180,1225,1226],{},"color-mix()",", eight tokens derive from three base colors, so changing ",[180,1229,437],{},[180,1231,683],{},[180,1233,721],{}," recolors the whole calendar.",[613,1236,1237,1246],{},[616,1238,1239],{},[619,1240,1241,1243],{},[622,1242,624],{},[622,1244,1245],{},"Derived as",[635,1247,1248,1261,1274,1287,1300,1313,1326,1342],{},[619,1249,1250,1254],{},[640,1251,1252],{},[180,1253,741],{},[640,1255,1256,1258,1259],{},[180,1257,721],{}," 68% over ",[180,1260,683],{},[619,1262,1263,1267],{},[640,1264,1265],{},[180,1266,761],{},[640,1268,1269,1271,1272],{},[180,1270,721],{}," 32% over ",[180,1273,683],{},[619,1275,1276,1280],{},[640,1277,1278],{},[180,1279,781],{},[640,1281,1282,1284,1285],{},[180,1283,721],{}," 12% over ",[180,1286,683],{},[619,1288,1289,1293],{},[640,1290,1291],{},[180,1292,801],{},[640,1294,1295,1297,1298],{},[180,1296,721],{}," 55% over ",[180,1299,683],{},[619,1301,1302,1306],{},[640,1303,1304],{},[180,1305,821],{},[640,1307,1308,1310,1311],{},[180,1309,721],{}," 7% over ",[180,1312,683],{},[619,1314,1315,1319],{},[640,1316,1317],{},[180,1318,841],{},[640,1320,1321,1323,1324],{},[180,1322,437],{}," 86% over ",[180,1325,721],{},[619,1327,1328,1332],{},[640,1329,1330],{},[180,1331,881],{},[640,1333,1334,1336,1337,1339,1340],{},[180,1335,437],{}," at ",[180,1338,861],{}," over ",[180,1341,683],{},[619,1343,1344,1348],{},[640,1345,1346],{},[180,1347,901],{},[640,1349,1350,1352,1353,1339,1355],{},[180,1351,437],{}," at 1.4 times ",[180,1354,861],{},[180,1356,683],{},[176,1358,1359,1360,1362,1363,1365,1366,271],{},"In dark mode, ",[180,1361,702],{}," also derives, as ",[180,1364,721],{}," 5% over ",[180,1367,683],{},[327,1369,1371],{"id":1370},"browsers-without-color-mix","Browsers without color-mix",[176,1373,1374,1375,1377,1378,534,1380,411,1382,1384],{},"Safari below 16.2 and other browsers without ",[180,1376,1226],{}," use the fixed values from the tables above. They match the default colors only. If you change ",[180,1379,437],{},[180,1381,683],{},[180,1383,721],{},", override the derived tokens together:",[192,1386,1388],{"className":333,"code":1387,"language":335,"meta":197,"style":197},".my-calendar {\n  --vfc-primary: #0d9488;\n  --vfc-primary-hover: #0f766e;\n  --vfc-range: #ccfbf1;\n  --vfc-range-strong: #99f6e4;\n  --vfc-text-muted: #5b6770;\n  --vfc-text-disabled: #b3bcc2;\n  --vfc-border: #e2e8ec;\n  --vfc-border-strong: #7b8a94;\n  --vfc-hover: #f0f4f6;\n}\n",[180,1389,1390,1398,1410,1424,1438,1452,1466,1480,1494,1508,1522],{"__ignoreMap":197},[201,1391,1392,1394,1396],{"class":203,"line":204},[201,1393,271],{"class":207},[201,1395,226],{"class":274},[201,1397,277],{"class":207},[201,1399,1400,1402,1404,1406,1408],{"class":203,"line":234},[201,1401,283],{"class":237},[201,1403,286],{"class":207},[201,1405,289],{"class":207},[201,1407,387],{"class":237},[201,1409,295],{"class":207},[201,1411,1412,1415,1417,1419,1422],{"class":203,"line":241},[201,1413,1414],{"class":237},"  --vfc-primary-hover",[201,1416,286],{"class":207},[201,1418,289],{"class":207},[201,1420,1421],{"class":237},"0f766e",[201,1423,295],{"class":207},[201,1425,1426,1429,1431,1433,1436],{"class":203,"line":251},[201,1427,1428],{"class":237},"  --vfc-range",[201,1430,286],{"class":207},[201,1432,289],{"class":207},[201,1434,1435],{"class":237},"ccfbf1",[201,1437,295],{"class":207},[201,1439,1440,1443,1445,1447,1450],{"class":203,"line":258},[201,1441,1442],{"class":237},"  --vfc-range-strong",[201,1444,286],{"class":207},[201,1446,289],{"class":207},[201,1448,1449],{"class":237},"99f6e4",[201,1451,295],{"class":207},[201,1453,1454,1457,1459,1461,1464],{"class":203,"line":268},[201,1455,1456],{"class":237},"  --vfc-text-muted",[201,1458,286],{"class":207},[201,1460,289],{"class":207},[201,1462,1463],{"class":237},"5b6770",[201,1465,295],{"class":207},[201,1467,1468,1471,1473,1475,1478],{"class":203,"line":280},[201,1469,1470],{"class":237},"  --vfc-text-disabled",[201,1472,286],{"class":207},[201,1474,289],{"class":207},[201,1476,1477],{"class":237},"b3bcc2",[201,1479,295],{"class":207},[201,1481,1482,1485,1487,1489,1492],{"class":203,"line":298},[201,1483,1484],{"class":237},"  --vfc-border",[201,1486,286],{"class":207},[201,1488,289],{"class":207},[201,1490,1491],{"class":237},"e2e8ec",[201,1493,295],{"class":207},[201,1495,1496,1499,1501,1503,1506],{"class":203,"line":313},[201,1497,1498],{"class":237},"  --vfc-border-strong",[201,1500,286],{"class":207},[201,1502,289],{"class":207},[201,1504,1505],{"class":237},"7b8a94",[201,1507,295],{"class":207},[201,1509,1510,1513,1515,1517,1520],{"class":203,"line":319},[201,1511,1512],{"class":237},"  --vfc-hover",[201,1514,286],{"class":207},[201,1516,289],{"class":207},[201,1518,1519],{"class":237},"f0f4f6",[201,1521,295],{"class":207},[201,1523,1525],{"class":203,"line":1524},11,[201,1526,316],{"class":207},[176,1528,1529,1530,1532,1533,1535,1536,1538],{},"Add ",[180,1531,702],{}," under ",[180,1534,473],{}," as well. ",[180,1537,861],{}," has no effect in these browsers.",[327,1540,1542],{"id":1541},"class-overrides","Class overrides",[176,1544,1545,1546,1549],{},"The ",[180,1547,1548],{},"vfc-*"," class names are the same as in 2.x, so CSS overrides written for 2.x keep working. Tokens and class rules mix freely.",[263,1551,1552],{},"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 .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":197,"searchDepth":234,"depth":234,"links":1554},[1555,1556,1557,1558,1559,1560,1561,1562],{"id":329,"depth":234,"text":330},{"id":520,"depth":234,"text":521},{"id":610,"depth":234,"text":611},{"id":989,"depth":234,"text":990},{"id":1058,"depth":234,"text":1059},{"id":1219,"depth":234,"text":1220},{"id":1370,"depth":234,"text":1371},{"id":1541,"depth":234,"text":1542},"Style the calendar with --vfc-* custom properties, in light and dark.","md",null,{},{"icon":69},{"title":66,"description":1563},"ApNOuz8guEs-SQFEUV-hBCbaSxirajffKR-gE346FOw",[1571,1573],{"title":61,"path":62,"stem":63,"description":1572,"icon":64,"children":-1},"Hide parts, move the title and arrows, and rename days and months.",{"title":71,"path":72,"stem":73,"description":1574,"icon":74,"children":-1},"Every key the calendar handles.",1792736103334]