[{"data":1,"prerenderedAt":1690},["ShallowReactive",2],{"navigation_docs":3,"-components-tooltip":279,"-components-tooltip-surround":1685},[4,26,112,211],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":25},"Getting Started","i-lucide-rocket","\u002Fgetting-started","1.getting-started",[10,15,20],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction","i-lucide-house",{"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},"Migrate from 0.6","\u002Fgetting-started\u002Fmigration","1.getting-started\u002F3.migration","i-lucide-arrow-up-circle",false,{"title":27,"icon":28,"path":29,"stem":30,"children":31,"page":25},"Guides","i-lucide-book-open","\u002Fguides","2.guides",[32,37,42,47,52,57,62,67,72,77,82,87,92,97,102,107],{"title":33,"path":34,"stem":35,"icon":36},"Customize","\u002Fguides\u002Fcustomize","2.guides\u002F01.customize","i-lucide-paintbrush",{"title":38,"path":39,"stem":40,"icon":41},"Axis Domain and Ticks","\u002Fguides\u002Faxis-domain-and-ticks","2.guides\u002F03.axis-domain-and-ticks","i-lucide-ruler",{"title":43,"path":44,"stem":45,"icon":46},"Chart Size","\u002Fguides\u002Fchart-size","2.guides\u002F05.chart-size","i-lucide-maximize",{"title":48,"path":49,"stem":50,"icon":51},"Z-Order and Layers","\u002Fguides\u002Fz-order-and-layers","2.guides\u002F06.z-order-and-layers","i-lucide-layers",{"title":53,"path":54,"stem":55,"icon":56},"Coordinate Systems","\u002Fguides\u002Fcoordinate-systems","2.guides\u002F07.coordinate-systems","i-lucide-crosshair",{"title":58,"path":59,"stem":60,"icon":61},"Performance","\u002Fguides\u002Fperformance","2.guides\u002F08.performance","i-lucide-zap",{"title":63,"path":64,"stem":65,"icon":66},"Rounded Bar Corners","\u002Fguides\u002Frounded-bar-corners","2.guides\u002F09.rounded-bar-corners","i-lucide-square",{"title":68,"path":69,"stem":70,"icon":71},"Bar Alignment","\u002Fguides\u002Fbar-alignment","2.guides\u002F10.bar-alignment","i-lucide-align-center",{"title":73,"path":74,"stem":75,"icon":76},"Nuxt and SSR","\u002Fguides\u002Fnuxt-and-ssr","2.guides\u002F11.nuxt-and-ssr","i-lucide-server",{"title":78,"path":79,"stem":80,"icon":81},"Animation","\u002Fguides\u002Fanimation","2.guides\u002F12.animation","i-lucide-sparkles",{"title":83,"path":84,"stem":85,"icon":86},"Events and v-model","\u002Fguides\u002Fevents-and-models","2.guides\u002F13.events-and-models","i-lucide-mouse-pointer-click",{"title":88,"path":89,"stem":90,"icon":91},"TypeScript","\u002Fguides\u002Ftypescript","2.guides\u002F14.typescript","i-lucide-file-code",{"title":93,"path":94,"stem":95,"icon":96},"Theming and dark mode","\u002Fguides\u002Ftheming","2.guides\u002F15.theming","i-lucide-palette",{"title":98,"path":99,"stem":100,"icon":101},"shadcn-vue","\u002Fguides\u002Fshadcn-vue","2.guides\u002F16.shadcn-vue","i-lucide-component",{"title":103,"path":104,"stem":105,"icon":106},"Dashboard recipes","\u002Fguides\u002Fdashboard-recipes","2.guides\u002F17.dashboard-recipes","i-lucide-layout-dashboard",{"title":108,"path":109,"stem":110,"icon":111},"Accessibility","\u002Fguides\u002Faccessibility","2.guides\u002F18.accessibility","i-lucide-accessibility",{"title":113,"icon":114,"path":115,"stem":116,"children":117,"page":25},"Charts","i-lucide-bar-chart-3","\u002Fcharts","3.charts",[118,123,128,133,138,143,148,153,158,163,167,172,177,182,187,192,197,201,206],{"title":119,"path":120,"stem":121,"icon":122},"Chart Containers","\u002Fcharts\u002Fchart-containers","3.charts\u002F0.chart-containers","i-lucide-box",{"title":124,"path":125,"stem":126,"icon":127},"Area Chart","\u002Fcharts\u002Farea-chart","3.charts\u002F01.area-chart","i-lucide-area-chart",{"title":129,"path":130,"stem":131,"icon":132},"Bar Chart","\u002Fcharts\u002Fbar-chart","3.charts\u002F02.bar-chart","i-lucide-bar-chart",{"title":134,"path":135,"stem":136,"icon":137},"Line Chart","\u002Fcharts\u002Fline-chart","3.charts\u002F03.line-chart","i-lucide-trending-up",{"title":139,"path":140,"stem":141,"icon":142},"Pie Chart","\u002Fcharts\u002Fpie-chart","3.charts\u002F04.pie-chart","i-lucide-pie-chart",{"title":144,"path":145,"stem":146,"icon":147},"Radar Chart","\u002Fcharts\u002Fradar-chart","3.charts\u002F05.radar-chart","i-lucide-radar",{"title":149,"path":150,"stem":151,"icon":152},"Radial Bar Chart","\u002Fcharts\u002Fradial-bar-chart","3.charts\u002F06.radial-bar-chart","i-lucide-circle-dot",{"title":154,"path":155,"stem":156,"icon":157},"Scatter Chart","\u002Fcharts\u002Fscatter-chart","3.charts\u002F07.scatter-chart","i-lucide-scatter-chart",{"title":159,"path":160,"stem":161,"icon":162},"Funnel Chart","\u002Fcharts\u002Ffunnel-chart","3.charts\u002F08.funnel-chart","i-lucide-filter",{"title":164,"path":165,"stem":166,"icon":51},"Composed Chart","\u002Fcharts\u002Fcomposed-chart","3.charts\u002F09.composed-chart",{"title":168,"path":169,"stem":170,"icon":171},"Treemap","\u002Fcharts\u002Ftreemap","3.charts\u002F10.treemap","i-lucide-layout-grid",{"title":173,"path":174,"stem":175,"icon":176},"Sunburst Chart","\u002Fcharts\u002Fsunburst-chart","3.charts\u002F11.sunburst-chart","i-lucide-sun",{"title":178,"path":179,"stem":180,"icon":181},"Sankey","\u002Fcharts\u002Fsankey","3.charts\u002F12.sankey","i-lucide-git-fork",{"title":183,"path":184,"stem":185,"icon":186},"Tracker","\u002Fcharts\u002Ftracker","3.charts\u002F13.tracker","i-lucide-activity",{"title":188,"path":189,"stem":190,"icon":191},"Calendar Heatmap","\u002Fcharts\u002Fcalendar-heatmap","3.charts\u002F14.calendar-heatmap","i-lucide-calendar-days",{"title":193,"path":194,"stem":195,"icon":196},"Heatmap and CohortChart","\u002Fcharts\u002Fheatmap","3.charts\u002F15.heatmap","i-lucide-grid-3x3",{"title":198,"path":199,"stem":200,"icon":137},"Sparkline","\u002Fcharts\u002Fsparkline","3.charts\u002F16.sparkline",{"title":202,"path":203,"stem":204,"icon":205},"Bar List","\u002Fcharts\u002Fbar-list","3.charts\u002F17.bar-list","i-lucide-list-ordered",{"title":207,"path":208,"stem":209,"icon":210},"Journey Sankey","\u002Fcharts\u002Fjourney-sankey","3.charts\u002F18.journey-sankey","i-lucide-split",{"title":212,"icon":213,"path":214,"stem":215,"children":216,"page":25},"Components","i-lucide-code","\u002Fcomponents","4.components",[217,222,227,231,236,240,245,249,254,259,264,269,274],{"title":218,"path":219,"stem":220,"icon":221},"Tooltip","\u002Fcomponents\u002Ftooltip","4.components\u002F01.tooltip","i-lucide-message-square",{"title":223,"path":224,"stem":225,"icon":226},"Legend","\u002Fcomponents\u002Flegend","4.components\u002F02.legend","i-lucide-list",{"title":228,"path":229,"stem":230,"icon":196},"CartesianGrid","\u002Fcomponents\u002Fcartesian-grid","4.components\u002F03.cartesian-grid",{"title":232,"path":233,"stem":234,"icon":235},"Axes","\u002Fcomponents\u002Faxis","4.components\u002F04.axis","i-lucide-move",{"title":237,"path":238,"stem":239,"icon":147},"Polar Axes and Grid","\u002Fcomponents\u002Fpolar-axes","4.components\u002F05.polar-axes",{"title":241,"path":242,"stem":243,"icon":244},"Brush","\u002Fcomponents\u002Fbrush","4.components\u002F06.brush","i-lucide-sliders-horizontal",{"title":246,"path":247,"stem":248,"icon":56},"Reference Elements","\u002Fcomponents\u002Freference-elements","4.components\u002F07.reference-elements",{"title":250,"path":251,"stem":252,"icon":253},"ErrorBar","\u002Fcomponents\u002Ferror-bar","4.components\u002F08.error-bar","i-lucide-chevrons-up-down",{"title":255,"path":256,"stem":257,"icon":258},"Labels and Cell","\u002Fcomponents\u002Flabels","4.components\u002F09.labels","i-lucide-tag",{"title":260,"path":261,"stem":262,"icon":263},"Text","\u002Fcomponents\u002Ftext","4.components\u002F10.text","i-lucide-type",{"title":265,"path":266,"stem":267,"icon":268},"Shapes","\u002Fcomponents\u002Fshapes","4.components\u002F11.shapes","i-lucide-shapes",{"title":270,"path":271,"stem":272,"icon":273},"Composables","\u002Fcomponents\u002Fcomposables","4.components\u002F12.composables","i-lucide-function-square",{"title":275,"path":276,"stem":277,"icon":278},"Custom overlays","\u002Fcomponents\u002Fcustom-overlays","4.components\u002F13.custom-overlays","i-lucide-pencil-ruler",{"id":280,"title":218,"body":281,"description":1678,"extension":1679,"links":1680,"meta":1681,"navigation":1682,"path":219,"seo":1683,"stem":220,"__hash__":1684},"docs\u002F4.components\u002F01.tooltip.md",{"type":282,"value":283,"toc":1666},"minimark",[284,293,298,304,398,402,409,476,480,487,493,520,524,531,536,562,566,583,622,634,638,641,658,672,697,701,727,731,1234,1238,1256,1399,1421,1425,1484,1654,1663],[285,286,287,288,292],"p",{},"The ",[289,290,291],"code",{},"\u003CTooltip>"," component displays data values when users hover over chart elements.",[294,295,297],"h2",{"id":296},"add-a-tooltip","Add a tooltip",[285,299,300,301,303],{},"Place ",[289,302,291],{}," inside any chart container:",[305,306,311],"pre",{"className":307,"code":308,"language":309,"meta":310,"style":310},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CBarChart :width=\"500\" :height=\"300\" :data=\"data\">\n  \u003CBar data-key=\"value\" fill=\"#8884d8\" \u002F>\n  \u003CTooltip \u002F>\n\u003C\u002FBarChart>\n","vue","",[289,312,313,376,382,388],{"__ignoreMap":310},[314,315,318,322,326,329,333,336,339,343,345,347,350,352,354,357,359,361,364,366,368,371,373],"span",{"class":316,"line":317},"line",1,[314,319,321],{"class":320},"sMK4o","\u003C",[314,323,325],{"class":324},"swJcz","BarChart",[314,327,328],{"class":320}," :",[314,330,332],{"class":331},"spNyl","width",[314,334,335],{"class":320},"=",[314,337,338],{"class":320},"\"",[314,340,342],{"class":341},"sbssI","500",[314,344,338],{"class":320},[314,346,328],{"class":320},[314,348,349],{"class":331},"height",[314,351,335],{"class":320},[314,353,338],{"class":320},[314,355,356],{"class":341},"300",[314,358,338],{"class":320},[314,360,328],{"class":320},[314,362,363],{"class":331},"data",[314,365,335],{"class":320},[314,367,338],{"class":320},[314,369,363],{"class":370},"sTEyZ",[314,372,338],{"class":320},[314,374,375],{"class":320},">\n",[314,377,379],{"class":316,"line":378},2,[314,380,381],{"class":370},"  \u003CBar data-key=\"value\" fill=\"#8884d8\" \u002F>\n",[314,383,385],{"class":316,"line":384},3,[314,386,387],{"class":370},"  \u003CTooltip \u002F>\n",[314,389,391,394,396],{"class":316,"line":390},4,[314,392,393],{"class":320},"\u003C\u002F",[314,395,325],{"class":324},[314,397,375],{"class":320},[294,399,401],{"id":400},"customize-tooltip-content","Customize tooltip content",[285,403,404,405,408],{},"Use the ",[289,406,407],{},"#content"," slot for full control:",[305,410,412],{"className":307,"code":411,"language":309,"meta":310,"style":310},"\u003CTooltip>\n  \u003Ctemplate #content=\"{ active, payload, label }\">\n    \u003Cdiv v-if=\"active && payload?.length\" class=\"bg-background border rounded p-2 shadow\">\n      \u003Cp class=\"font-medium\">{{ label }}\u003C\u002Fp>\n      \u003Cp v-for=\"entry in payload\" :key=\"entry.dataKey\" :style=\"{ color: entry.color }\">\n        {{ entry.name }}: {{ entry.value }}\n      \u003C\u002Fp>\n    \u003C\u002Fdiv>\n  \u003C\u002Ftemplate>\n\u003C\u002FTooltip>\n",[289,413,414,422,427,432,437,443,449,455,461,467],{"__ignoreMap":310},[314,415,416,418,420],{"class":316,"line":317},[314,417,321],{"class":320},[314,419,218],{"class":324},[314,421,375],{"class":320},[314,423,424],{"class":316,"line":378},[314,425,426],{"class":370},"  \u003Ctemplate #content=\"{ active, payload, label }\">\n",[314,428,429],{"class":316,"line":384},[314,430,431],{"class":370},"    \u003Cdiv v-if=\"active && payload?.length\" class=\"bg-background border rounded p-2 shadow\">\n",[314,433,434],{"class":316,"line":390},[314,435,436],{"class":370},"      \u003Cp class=\"font-medium\">{{ label }}\u003C\u002Fp>\n",[314,438,440],{"class":316,"line":439},5,[314,441,442],{"class":370},"      \u003Cp v-for=\"entry in payload\" :key=\"entry.dataKey\" :style=\"{ color: entry.color }\">\n",[314,444,446],{"class":316,"line":445},6,[314,447,448],{"class":370},"        {{ entry.name }}: {{ entry.value }}\n",[314,450,452],{"class":316,"line":451},7,[314,453,454],{"class":370},"      \u003C\u002Fp>\n",[314,456,458],{"class":316,"line":457},8,[314,459,460],{"class":370},"    \u003C\u002Fdiv>\n",[314,462,464],{"class":316,"line":463},9,[314,465,466],{"class":370},"  \u003C\u002Ftemplate>\n",[314,468,470,472,474],{"class":316,"line":469},10,[314,471,393],{"class":320},[314,473,218],{"class":324},[314,475,375],{"class":320},[294,477,479],{"id":478},"pre-select-a-tooltip-index","Pre-select a tooltip index",[285,481,482,483,486],{},"Use ",[289,484,485],{},"default-index"," to show the tooltip at a data index on the first render. Users can still\nhover to move it.",[488,489],"chart-demo",{"description":490,"name":491,"src":492},"Bar chart with the tooltip at index 2 on the first render.","Default Index","guide-charts\u002Fdefault-index-chart",[305,494,496],{"className":307,"code":495,"language":309,"meta":310,"style":310},"\u003CTooltip :default-index=\"2\" \u002F>\n",[289,497,498],{"__ignoreMap":310},[314,499,500,502,504,506,508,510,512,515,517],{"class":316,"line":317},[314,501,321],{"class":320},[314,503,218],{"class":324},[314,505,328],{"class":320},[314,507,485],{"class":331},[314,509,335],{"class":320},[314,511,338],{"class":320},[314,513,514],{"class":341},"2",[314,516,338],{"class":320},[314,518,519],{"class":320}," \u002F>\n",[294,521,523],{"id":522},"activate-on-click","Activate on click",[285,525,526,527,530],{},"With ",[289,528,529],{},"trigger=\"click\"",", the tooltip appears when the user clicks, and stays until the user\nclicks elsewhere.",[488,532],{"description":533,"name":534,"src":535},"Bar chart where the tooltip opens on click.","Click Tooltip","guide-charts\u002Fclick-tooltip-chart",[305,537,539],{"className":307,"code":538,"language":309,"meta":310,"style":310},"\u003CTooltip trigger=\"click\" \u002F>\n",[289,540,541],{"__ignoreMap":310},[314,542,543,545,547,550,552,554,558,560],{"class":316,"line":317},[314,544,321],{"class":320},[314,546,218],{"class":324},[314,548,549],{"class":331}," trigger",[314,551,335],{"class":320},[314,553,338],{"class":320},[314,555,557],{"class":556},"sfazB","click",[314,559,338],{"class":320},[314,561,519],{"class":320},[294,563,565],{"id":564},"keep-the-tooltip-open","Keep the tooltip open",[285,567,568,571,572,575,576,579,580,582],{},[289,569,570],{},"active"," overrides the chart: ",[289,573,574],{},"true"," keeps the tooltip visible, ",[289,577,578],{},"false"," hides it. Combine it\nwith ",[289,581,485],{}," to pin the tooltip to one point:",[305,584,586],{"className":307,"code":585,"language":309,"meta":310,"style":310},"\u003CTooltip :active=\"true\" :default-index=\"3\" \u002F>\n",[289,587,588],{"__ignoreMap":310},[314,589,590,592,594,596,598,600,602,605,607,609,611,613,615,618,620],{"class":316,"line":317},[314,591,321],{"class":320},[314,593,218],{"class":324},[314,595,328],{"class":320},[314,597,570],{"class":331},[314,599,335],{"class":320},[314,601,338],{"class":320},[314,603,574],{"class":604},"sfNiH",[314,606,338],{"class":320},[314,608,328],{"class":320},[314,610,485],{"class":331},[314,612,335],{"class":320},[314,614,338],{"class":320},[314,616,617],{"class":341},"3",[314,619,338],{"class":320},[314,621,519],{"class":320},[285,623,624,625,628,629,633],{},"To control the active point from outside the chart, bind ",[289,626,627],{},"v-model:active-index",". See\n",[630,631,83],"a",{"href":632},"\u002Fguides\u002Fevents-and-models#active-element",".",[294,635,637],{"id":636},"shared-and-item-tooltips","Shared and item tooltips",[285,639,640],{},"Each chart type activates the tooltip in one of two ways:",[642,643,644,652],"ul",{},[645,646,647,651],"li",{},[648,649,650],"strong",{},"Axis:"," the tooltip follows the category axis and shows every series at that index.\nThis is the default for AreaChart, BarChart, LineChart, ComposedChart, RadarChart and\nRadialBarChart.",[645,653,654,657],{},[648,655,656],{},"Item:"," the tooltip opens on the hovered item and shows only that item. This is the\ndefault for ScatterChart, PieChart, FunnelChart and the standalone charts.",[285,659,660,663,664,667,668,671],{},[289,661,662],{},"shared"," switches between the two where the chart supports both: ",[289,665,666],{},":shared=\"false\""," gives item\ntooltips in a BarChart, LineChart or RadialBarChart, and ",[289,669,670],{},":shared=\"true\""," gives axis tooltips\nin a ScatterChart. AreaChart, ComposedChart and RadarChart always use axis tooltips; PieChart\nand FunnelChart always use item tooltips.",[305,673,675],{"className":307,"code":674,"language":309,"meta":310,"style":310},"\u003CTooltip :shared=\"false\" \u002F>\n",[289,676,677],{"__ignoreMap":310},[314,678,679,681,683,685,687,689,691,693,695],{"class":316,"line":317},[314,680,321],{"class":320},[314,682,218],{"class":324},[314,684,328],{"class":320},[314,686,662],{"class":331},[314,688,335],{"class":320},[314,690,338],{"class":320},[314,692,578],{"class":604},[314,694,338],{"class":320},[314,696,519],{"class":320},[294,698,700],{"id":699},"disable-the-cursor","Disable the cursor",[305,702,704],{"className":307,"code":703,"language":309,"meta":310,"style":310},"\u003CTooltip :cursor=\"false\" \u002F>\n",[289,705,706],{"__ignoreMap":310},[314,707,708,710,712,714,717,719,721,723,725],{"class":316,"line":317},[314,709,321],{"class":320},[314,711,218],{"class":324},[314,713,328],{"class":320},[314,715,716],{"class":331},"cursor",[314,718,335],{"class":320},[314,720,338],{"class":320},[314,722,578],{"class":604},[314,724,338],{"class":320},[314,726,519],{"class":320},[294,728,730],{"id":729},"tooltip-props","Tooltip props",[732,733,734,753],"table",{},[735,736,737],"thead",{},[738,739,740,744,747,750],"tr",{},[741,742,743],"th",{},"Prop",[741,745,746],{},"Type",[741,748,749],{},"Default",[741,751,752],{},"Description",[754,755,756,785,807,823,843,866,884,903,921,942,959,976,996,1014,1034,1051,1069,1086,1103,1123,1143,1161,1179,1196,1216],"tbody",{},[738,757,758,763,768,773],{},[759,760,761],"td",{},[289,762,570],{},[759,764,765],{},[289,766,767],{},"boolean",[759,769,770],{},[289,771,772],{},"undefined",[759,774,775,776,778,779,781,782,784],{},"Force active state. ",[289,777,574],{}," keeps tooltip visible, ",[289,780,578],{}," hides it, ",[289,783,772],{}," lets the chart control visibility.",[738,786,787,792,797,800],{},[759,788,789],{},[289,790,791],{},"active-index",[759,793,794],{},[289,795,796],{},"number | null",[759,798,799],{},"—",[759,801,802,803,806],{},"Current model index; ",[289,804,805],{},"null"," selects no target",[738,808,809,813,818,820],{},[759,810,811],{},[289,812,485],{},[759,814,815],{},[289,816,817],{},"number",[759,819,799],{},[759,821,822],{},"Pre-selected data index shown on initial render",[738,824,825,830,835,840],{},[759,826,827],{},[289,828,829],{},"trigger",[759,831,832],{},[289,833,834],{},"'hover' | 'click'",[759,836,837],{},[289,838,839],{},"'hover'",[759,841,842],{},"Activation trigger",[738,844,845,849,853,857],{},[759,846,847],{},[289,848,662],{},[759,850,851],{},[289,852,767],{},[759,854,855],{},[289,856,772],{},[759,858,859,860,862,863,865],{},"Show all series at hovered index. When ",[289,861,772],{},", defaults to ",[289,864,574],{}," for axis-type charts.",[738,867,868,872,877,881],{},[759,869,870],{},[289,871,716],{},[759,873,874],{},[289,875,876],{},"boolean | object",[759,878,879],{},[289,880,574],{},[759,882,883],{},"Show\u002Fcustomize cursor. Pass an object to set SVG attrs on the cursor element.",[738,885,886,891,895,900],{},[759,887,888],{},[289,889,890],{},"offset",[759,892,893],{},[289,894,817],{},[759,896,897],{},[289,898,899],{},"10",[759,901,902],{},"Pixel offset from cursor",[738,904,905,910,914,918],{},[759,906,907],{},[289,908,909],{},"include-hidden",[759,911,912],{},[289,913,767],{},[759,915,916],{},[289,917,578],{},[759,919,920],{},"Show hidden series data",[738,922,923,928,932,936],{},[759,924,925],{},[289,926,927],{},"filter-null",[759,929,930],{},[289,931,767],{},[759,933,934],{},[289,935,574],{},[759,937,938,939,941],{},"Filter out entries with ",[289,940,805],{}," values",[738,943,944,949,954,956],{},[759,945,946],{},[289,947,948],{},"formatter",[759,950,951],{},[289,952,953],{},"(value, name, entry, index, payload) => VNodeChild | [value, name]",[759,955,799],{},[759,957,958],{},"Format each row of the default content. Return a pair to change the name too. It wins over a chart's own formatter",[738,960,961,966,971,973],{},[759,962,963],{},[289,964,965],{},"label-formatter",[759,967,968],{},[289,969,970],{},"(label, payload) => VNodeChild",[759,972,799],{},[759,974,975],{},"Format the label in the default content",[738,977,978,983,988,993],{},[759,979,980],{},[289,981,982],{},"transition",[759,984,985],{},[289,986,987],{},"ChartTransition",[759,989,990],{},[630,991,992],{"href":79},"motion tokens",[759,994,995],{},"Timing and easing for tooltip motion",[738,997,998,1003,1007,1011],{},[759,999,1000],{},[289,1001,1002],{},"is-animation-active",[759,1004,1005],{},[289,1006,767],{},[759,1008,1009],{},[289,1010,574],{},[759,1012,1013],{},"Animate tooltip position changes",[738,1015,1016,1021,1026,1031],{},[759,1017,1018],{},[289,1019,1020],{},"allow-escape-view-box",[759,1022,1023],{},[289,1024,1025],{},"{ x: boolean, y: boolean }",[759,1027,1028],{},[289,1029,1030],{},"{ x: false, y: false }",[759,1032,1033],{},"Allow tooltip to overflow the chart area",[738,1035,1036,1041,1046,1048],{},[759,1037,1038],{},[289,1039,1040],{},"position",[759,1042,1043],{},[289,1044,1045],{},"{ x?: number, y?: number }",[759,1047,799],{},[759,1049,1050],{},"Pin tooltip to a fixed position",[738,1052,1053,1058,1062,1066],{},[759,1054,1055],{},[289,1056,1057],{},"reverse-direction",[759,1059,1060],{},[289,1061,1025],{},[759,1063,1064],{},[289,1065,1030],{},[759,1067,1068],{},"Flip tooltip placement direction",[738,1070,1071,1076,1081,1083],{},[759,1072,1073],{},[289,1074,1075],{},"to",[759,1077,1078],{},[289,1079,1080],{},"string | HTMLElement",[759,1082,799],{},[759,1084,1085],{},"Teleport tooltip to a CSS selector or DOM element",[738,1087,1088,1093,1098,1100],{},[759,1089,1090],{},[289,1091,1092],{},"payload-uniq-by",[759,1094,1095],{},[289,1096,1097],{},"boolean | Function",[759,1099,799],{},[759,1101,1102],{},"Deduplicate payload entries",[738,1104,1105,1110,1115,1120],{},[759,1106,1107],{},[289,1108,1109],{},"axis-id",[759,1111,1112],{},[289,1113,1114],{},"string | number",[759,1116,1117],{},[289,1118,1119],{},"0",[759,1121,1122],{},"Target axis ID for tooltip interaction",[738,1124,1125,1130,1135,1140],{},[759,1126,1127],{},[289,1128,1129],{},"content-style",[759,1131,1132],{},[289,1133,1134],{},"object",[759,1136,1137],{},[289,1138,1139],{},"{}",[759,1141,1142],{},"Inline styles for tooltip content wrapper",[738,1144,1145,1150,1154,1158],{},[759,1146,1147],{},[289,1148,1149],{},"label-style",[759,1151,1152],{},[289,1153,1134],{},[759,1155,1156],{},[289,1157,1139],{},[759,1159,1160],{},"Inline styles for the label",[738,1162,1163,1168,1172,1176],{},[759,1164,1165],{},[289,1166,1167],{},"item-style",[759,1169,1170],{},[289,1171,1134],{},[759,1173,1174],{},[289,1175,1139],{},[759,1177,1178],{},"Inline styles for each payload item",[738,1180,1181,1186,1191,1193],{},[759,1182,1183],{},[289,1184,1185],{},"item-sorter",[759,1187,1188],{},[289,1189,1190],{},"'name' | 'value' | 'dataKey' | Function",[759,1192,799],{},[759,1194,1195],{},"Sort payload items. Without it, items keep the series order",[738,1197,1198,1203,1208,1213],{},[759,1199,1200],{},[289,1201,1202],{},"separator",[759,1204,1205],{},[289,1206,1207],{},"string",[759,1209,1210],{},[289,1211,1212],{},"' : '",[759,1214,1215],{},"Separator between name and value in default content",[738,1217,1218,1223,1227,1231],{},[759,1219,1220],{},[289,1221,1222],{},"style",[759,1224,1225],{},[289,1226,1134],{},[759,1228,1229],{},[289,1230,1139],{},[759,1232,1233],{},"Inline styles for the tooltip bounding box",[294,1235,1237],{"id":1236},"payload","Payload",[285,1239,287,1240,1242,1243,1245,1246,1248,1249,1251,1252,1255],{},[289,1241,407],{}," slot, the ",[289,1244,948],{}," and ",[289,1247,965],{}," receive ",[289,1250,1236],{},": one\n",[289,1253,1254],{},"TooltipPayloadEntry"," per row, in series order.",[732,1257,1258,1269],{},[735,1259,1260],{},[738,1261,1262,1265,1267],{},[741,1263,1264],{},"Field",[741,1266,746],{},[741,1268,752],{},[754,1270,1271,1288,1303,1317,1330,1351,1366,1383],{},[738,1272,1273,1278,1282],{},[759,1274,1275],{},[289,1276,1277],{},"name",[759,1279,1280],{},[289,1281,1114],{},[759,1283,1284,1285,1287],{},"Series ",[289,1286,1277],{},", or the data key",[738,1289,1290,1295,1300],{},[759,1291,1292],{},[289,1293,1294],{},"value",[759,1296,1297],{},[289,1298,1299],{},"number | string | Array",[759,1301,1302],{},"Raw value of the row; an array for ranged data",[738,1304,1305,1309,1314],{},[759,1306,1307],{},[289,1308,1236],{},[759,1310,1311],{},[289,1312,1313],{},"unknown",[759,1315,1316],{},"The data row (or node, link or cell) behind the entry",[738,1318,1319,1324,1327],{},[759,1320,1321],{},[289,1322,1323],{},"dataKey",[759,1325,1326],{},"row path or accessor",[759,1328,1329],{},"The series data key",[738,1331,1332,1344,1348],{},[759,1333,1334,1337,1338,1337,1341],{},[289,1335,1336],{},"color",", ",[289,1339,1340],{},"fill",[289,1342,1343],{},"stroke",[759,1345,1346],{},[289,1347,1207],{},[759,1349,1350],{},"Colors of the series or entry, for swatches",[738,1352,1353,1358,1362],{},[759,1354,1355],{},[289,1356,1357],{},"unit",[759,1359,1360],{},[289,1361,1114],{},[759,1363,1284,1364],{},[289,1365,1357],{},[738,1367,1368,1373,1377],{},[759,1369,1370],{},[289,1371,1372],{},"chartType",[759,1374,1375],{},[289,1376,1207],{},[759,1378,1379,1380],{},"Series type, for example ",[289,1381,1382],{},"'line'",[738,1384,1385,1390,1394],{},[759,1386,1387],{},[289,1388,1389],{},"hide",[759,1391,1392],{},[289,1393,767],{},[759,1395,1396,1397],{},"Whether the series is hidden; hidden rows show only with ",[289,1398,909],{},[285,1400,1401,1402,1404,1405,1407,1408,1410,1411,1245,1413,1416,1417,1420],{},"All charts use this shape, including the standalone charts: ",[289,1403,1236],{}," is the domain object\n(your Treemap or Sankey node, a Heatmap cell, a Tracker row, …) and ",[289,1406,1294],{}," is the raw number.\nThe default content shows readable text; a ",[289,1409,948],{}," receives the raw value. Import\n",[289,1412,1254],{},[289,1414,1415],{},"TooltipPayload"," from ",[289,1418,1419],{},"vccs"," to type your own content.",[294,1422,1424],{"id":1423},"tooltip-slots","Tooltip slots",[732,1426,1427,1439],{},[735,1428,1429],{},[738,1430,1431,1434,1437],{},[741,1432,1433],{},"Slot",[741,1435,1436],{},"Props",[741,1438,752],{},[754,1440,1441,1455],{},[738,1442,1443,1447,1452],{},[759,1444,1445],{},[289,1446,407],{},[759,1448,1449],{},[289,1450,1451],{},"{ active, payload, label, coordinate, accessibilityLayer }",[759,1453,1454],{},"Full tooltip content",[738,1456,1457,1462,1465],{},[759,1458,1459],{},[289,1460,1461],{},"#cursor",[759,1463,1464],{},"Shape-specific SVG props",[759,1466,1467,1468,1471,1472,1475,1476,1479,1480,1483],{},"Custom cursor element. Receives ",[289,1469,1470],{},"Cross"," props for ScatterChart, ",[289,1473,1474],{},"Rectangle"," props for BarChart, ",[289,1477,1478],{},"Sector"," props for radial charts, ",[289,1481,1482],{},"Curve"," props for others.",[305,1485,1487],{"className":307,"code":1486,"language":309,"meta":310,"style":310},"\u003Cscript setup lang=\"ts\">\nimport { ref } from 'vue'\nimport { Tooltip } from 'vccs'\n\nconst activePoint = ref\u003Cnumber | null>(null)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CTooltip v-model:active-index=\"activePoint\" \u002F>\n\u003C\u002Ftemplate>\n",[289,1488,1489,1513,1539,1558,1564,1599,1607,1611,1620,1646],{"__ignoreMap":310},[314,1490,1491,1493,1496,1499,1502,1504,1506,1509,1511],{"class":316,"line":317},[314,1492,321],{"class":320},[314,1494,1495],{"class":324},"script",[314,1497,1498],{"class":331}," setup",[314,1500,1501],{"class":331}," lang",[314,1503,335],{"class":320},[314,1505,338],{"class":320},[314,1507,1508],{"class":556},"ts",[314,1510,338],{"class":320},[314,1512,375],{"class":320},[314,1514,1515,1519,1522,1525,1528,1531,1534,1536],{"class":316,"line":378},[314,1516,1518],{"class":1517},"s7zQu","import",[314,1520,1521],{"class":320}," {",[314,1523,1524],{"class":370}," ref",[314,1526,1527],{"class":320}," }",[314,1529,1530],{"class":1517}," from",[314,1532,1533],{"class":320}," '",[314,1535,309],{"class":556},[314,1537,1538],{"class":320},"'\n",[314,1540,1541,1543,1545,1548,1550,1552,1554,1556],{"class":316,"line":384},[314,1542,1518],{"class":1517},[314,1544,1521],{"class":320},[314,1546,1547],{"class":370}," Tooltip",[314,1549,1527],{"class":320},[314,1551,1530],{"class":1517},[314,1553,1533],{"class":320},[314,1555,1419],{"class":556},[314,1557,1538],{"class":320},[314,1559,1560],{"class":316,"line":390},[314,1561,1563],{"emptyLinePlaceholder":1562},true,"\n",[314,1565,1566,1569,1572,1574,1577,1579,1582,1585,1588,1591,1594,1596],{"class":316,"line":439},[314,1567,1568],{"class":331},"const",[314,1570,1571],{"class":370}," activePoint ",[314,1573,335],{"class":320},[314,1575,1524],{"class":1576},"s2Zo4",[314,1578,321],{"class":320},[314,1580,817],{"class":1581},"sBMFI",[314,1583,1584],{"class":320}," |",[314,1586,1587],{"class":1581}," null",[314,1589,1590],{"class":320},">",[314,1592,1593],{"class":370},"(",[314,1595,805],{"class":320},[314,1597,1598],{"class":370},")\n",[314,1600,1601,1603,1605],{"class":316,"line":445},[314,1602,393],{"class":320},[314,1604,1495],{"class":324},[314,1606,375],{"class":320},[314,1608,1609],{"class":316,"line":451},[314,1610,1563],{"emptyLinePlaceholder":1562},[314,1612,1613,1615,1618],{"class":316,"line":457},[314,1614,321],{"class":320},[314,1616,1617],{"class":324},"template",[314,1619,375],{"class":320},[314,1621,1622,1625,1627,1630,1633,1635,1637,1639,1642,1644],{"class":316,"line":463},[314,1623,1624],{"class":320},"  \u003C",[314,1626,218],{"class":324},[314,1628,1629],{"class":331}," v-model",[314,1631,1632],{"class":320},":",[314,1634,791],{"class":331},[314,1636,335],{"class":320},[314,1638,338],{"class":320},[314,1640,1641],{"class":370},"activePoint",[314,1643,338],{"class":320},[314,1645,519],{"class":320},[314,1647,1648,1650,1652],{"class":316,"line":469},[314,1649,393],{"class":320},[314,1651,1617],{"class":324},[314,1653,375],{"class":320},[285,1655,1656,1657,1659,1660,1662],{},"Multiple Tooltip components share selection. The first owns interaction settings; each can customize its presentation. Only one may bind ",[289,1658,791],{},"; conflicting bindings warn in development and the first controls selection. See ",[630,1661,83],{"href":84}," for index order and control precedence.",[1222,1664,1665],{},"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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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);}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}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 .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":310,"searchDepth":378,"depth":378,"links":1667},[1668,1669,1670,1671,1672,1673,1674,1675,1676,1677],{"id":296,"depth":378,"text":297},{"id":400,"depth":378,"text":401},{"id":478,"depth":378,"text":479},{"id":522,"depth":378,"text":523},{"id":564,"depth":378,"text":565},{"id":636,"depth":378,"text":637},{"id":699,"depth":378,"text":700},{"id":729,"depth":378,"text":730},{"id":1236,"depth":378,"text":1237},{"id":1423,"depth":378,"text":1424},"Configure tooltips for displaying data on hover","md",null,{},{"icon":221},{"title":218,"description":1678},"mimMpjl0Z_qqAWpl0wkyTYg0bKli3AkDIrZajy6oEF0",[1686,1688],{"title":207,"path":208,"stem":209,"description":1687,"icon":210,"children":-1},"User journeys as columns of steps, with path highlighting and drop-off",{"title":223,"path":224,"stem":225,"description":1689,"icon":226,"children":-1},"Add legends to identify chart series",1791811115190]