[{"data":1,"prerenderedAt":2190},["ShallowReactive",2],{"navigation_docs":3,"-guides-shadcn-vue":279,"-guides-shadcn-vue-surround":2185},[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":98,"body":281,"description":2178,"extension":2179,"links":2180,"meta":2181,"navigation":2182,"path":99,"seo":2183,"stem":100,"__hash__":2184},"docs\u002F2.guides\u002F16.shadcn-vue.md",{"type":282,"value":283,"toc":2174},"minimark",[284,303,307,879,1510,1514,2164,2171],[285,286,287,288,292,293,292,296,292,299,302],"p",{},"vccs works with the shadcn-vue chart pattern (",[289,290,291],"code",{},"ChartContainer",", ",[289,294,295],{},"ChartTooltipContent",[289,297,298],{},"ChartLegendContent",[289,300,301],{},"ChartConfig","). The container maps vccs's CSS variables to your shadcn theme once, so charts follow light and dark mode with no attribute overrides.",[304,305,291],"h2",{"id":306},"chartcontainer",[308,309,315],"pre",{"className":310,"code":311,"filename":312,"language":313,"meta":314,"style":314},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue'\nimport type { ChartConfig } from '.\u002Ftypes'\nimport { cn } from '@\u002Flib\u002Futils'\nimport ChartStyle from '.\u002FChartStyle.vue'\n\nconst props = defineProps\u003C{\n  id?: string\n  class?: HTMLAttributes['class']\n  config: ChartConfig\n}>()\n\nconst uniqueId = useId()\nconst chartId = computed(() => `chart-${props.id || uniqueId.replace(\u002F:\u002Fg, '')}`)\n\nprovide('chart-config', computed(() => props.config))\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003C!-- vccs reads its default colors from --v-charts-* variables; map them to the theme once. -->\n  \u003Cdiv\n    data-slot=\"chart\"\n    :data-chart=\"chartId\"\n    :class=\"cn(\n      'flex aspect-video justify-center text-xs',\n      '[--v-charts-grid:var(--border)] [--v-charts-axis:var(--border)] [--v-charts-text:var(--muted-foreground)]',\n      '[--v-charts-cursor:var(--border)] [--v-charts-muted:var(--muted)] [--v-charts-background:var(--background)]',\n      '[--v-charts-inactive:var(--muted-foreground)] [--v-charts-focus:var(--ring)]',\n      '[&_.v-charts-surface]:outline-hidden [&_.v-charts-layer]:outline-hidden [&_.v-charts-sector]:outline-hidden',\n      props.class,\n    )\"\n  >\n    \u003CChartStyle\n      :id=\"chartId\"\n      :config=\"config\"\n    \u002F>\n    \u003Cslot \u002F>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","components\u002Fui\u002Fchart\u002FChartContainer.vue","vue","",[289,316,317,352,383,406,427,445,452,470,483,507,519,528,533,548,627,632,665,675,680,690,697,706,722,737,750,756,762,768,774,780,786,794,800,809,826,842,848,859,870],{"__ignoreMap":314},[318,319,322,326,330,334,337,340,343,347,349],"span",{"class":320,"line":321},"line",1,[318,323,325],{"class":324},"sMK4o","\u003C",[318,327,329],{"class":328},"swJcz","script",[318,331,333],{"class":332},"spNyl"," setup",[318,335,336],{"class":332}," lang",[318,338,339],{"class":324},"=",[318,341,342],{"class":324},"\"",[318,344,346],{"class":345},"sfazB","ts",[318,348,342],{"class":324},[318,350,351],{"class":324},">\n",[318,353,355,359,362,365,369,372,375,378,380],{"class":320,"line":354},2,[318,356,358],{"class":357},"s7zQu","import",[318,360,361],{"class":357}," type",[318,363,364],{"class":324}," {",[318,366,368],{"class":367},"sTEyZ"," HTMLAttributes",[318,370,371],{"class":324}," }",[318,373,374],{"class":357}," from",[318,376,377],{"class":324}," '",[318,379,313],{"class":345},[318,381,382],{"class":324},"'\n",[318,384,386,388,390,392,395,397,399,401,404],{"class":320,"line":385},3,[318,387,358],{"class":357},[318,389,361],{"class":357},[318,391,364],{"class":324},[318,393,394],{"class":367}," ChartConfig",[318,396,371],{"class":324},[318,398,374],{"class":357},[318,400,377],{"class":324},[318,402,403],{"class":345},".\u002Ftypes",[318,405,382],{"class":324},[318,407,409,411,413,416,418,420,422,425],{"class":320,"line":408},4,[318,410,358],{"class":357},[318,412,364],{"class":324},[318,414,415],{"class":367}," cn",[318,417,371],{"class":324},[318,419,374],{"class":357},[318,421,377],{"class":324},[318,423,424],{"class":345},"@\u002Flib\u002Futils",[318,426,382],{"class":324},[318,428,430,432,435,438,440,443],{"class":320,"line":429},5,[318,431,358],{"class":357},[318,433,434],{"class":367}," ChartStyle ",[318,436,437],{"class":357},"from",[318,439,377],{"class":324},[318,441,442],{"class":345},".\u002FChartStyle.vue",[318,444,382],{"class":324},[318,446,448],{"class":320,"line":447},6,[318,449,451],{"emptyLinePlaceholder":450},true,"\n",[318,453,455,458,461,463,467],{"class":320,"line":454},7,[318,456,457],{"class":332},"const",[318,459,460],{"class":367}," props ",[318,462,339],{"class":324},[318,464,466],{"class":465},"s2Zo4"," defineProps",[318,468,469],{"class":324},"\u003C{\n",[318,471,473,476,479],{"class":320,"line":472},8,[318,474,475],{"class":328},"  id",[318,477,478],{"class":324},"?:",[318,480,482],{"class":481},"sBMFI"," string\n",[318,484,486,489,491,493,496,499,502,504],{"class":320,"line":485},9,[318,487,488],{"class":328},"  class",[318,490,478],{"class":324},[318,492,368],{"class":481},[318,494,495],{"class":367},"[",[318,497,498],{"class":324},"'",[318,500,501],{"class":345},"class",[318,503,498],{"class":324},[318,505,506],{"class":367},"]\n",[318,508,510,513,516],{"class":320,"line":509},10,[318,511,512],{"class":328},"  config",[318,514,515],{"class":324},":",[318,517,518],{"class":481}," ChartConfig\n",[318,520,522,525],{"class":320,"line":521},11,[318,523,524],{"class":324},"}>",[318,526,527],{"class":367},"()\n",[318,529,531],{"class":320,"line":530},12,[318,532,451],{"emptyLinePlaceholder":450},[318,534,536,538,541,543,546],{"class":320,"line":535},13,[318,537,457],{"class":332},[318,539,540],{"class":367}," uniqueId ",[318,542,339],{"class":324},[318,544,545],{"class":465}," useId",[318,547,527],{"class":367},[318,549,551,553,556,558,561,564,567,570,573,576,579,582,585,588,591,594,596,599,601,604,606,608,612,615,618,621,624],{"class":320,"line":550},14,[318,552,457],{"class":332},[318,554,555],{"class":367}," chartId ",[318,557,339],{"class":324},[318,559,560],{"class":465}," computed",[318,562,563],{"class":367},"(",[318,565,566],{"class":324},"()",[318,568,569],{"class":332}," =>",[318,571,572],{"class":324}," `",[318,574,575],{"class":345},"chart-",[318,577,578],{"class":324},"${",[318,580,581],{"class":367},"props",[318,583,584],{"class":324},".",[318,586,587],{"class":367},"id ",[318,589,590],{"class":324},"||",[318,592,593],{"class":367}," uniqueId",[318,595,584],{"class":324},[318,597,598],{"class":465},"replace",[318,600,563],{"class":367},[318,602,603],{"class":324},"\u002F",[318,605,515],{"class":345},[318,607,603],{"class":324},[318,609,611],{"class":610},"sbssI","g",[318,613,614],{"class":324},",",[318,616,617],{"class":324}," ''",[318,619,620],{"class":367},")",[318,622,623],{"class":324},"}`",[318,625,626],{"class":367},")\n",[318,628,630],{"class":320,"line":629},15,[318,631,451],{"emptyLinePlaceholder":450},[318,633,635,638,640,642,645,647,649,651,653,655,657,660,662],{"class":320,"line":634},16,[318,636,637],{"class":465},"provide",[318,639,563],{"class":367},[318,641,498],{"class":324},[318,643,644],{"class":345},"chart-config",[318,646,498],{"class":324},[318,648,614],{"class":324},[318,650,560],{"class":465},[318,652,563],{"class":367},[318,654,566],{"class":324},[318,656,569],{"class":332},[318,658,659],{"class":367}," props",[318,661,584],{"class":324},[318,663,664],{"class":367},"config))\n",[318,666,668,671,673],{"class":320,"line":667},17,[318,669,670],{"class":324},"\u003C\u002F",[318,672,329],{"class":328},[318,674,351],{"class":324},[318,676,678],{"class":320,"line":677},18,[318,679,451],{"emptyLinePlaceholder":450},[318,681,683,685,688],{"class":320,"line":682},19,[318,684,325],{"class":324},[318,686,687],{"class":328},"template",[318,689,351],{"class":324},[318,691,693],{"class":320,"line":692},20,[318,694,696],{"class":695},"sHwdD","  \u003C!-- vccs reads its default colors from --v-charts-* variables; map them to the theme once. -->\n",[318,698,700,703],{"class":320,"line":699},21,[318,701,702],{"class":324},"  \u003C",[318,704,705],{"class":328},"div\n",[318,707,709,712,714,716,719],{"class":320,"line":708},22,[318,710,711],{"class":332},"    data-slot",[318,713,339],{"class":324},[318,715,342],{"class":324},[318,717,718],{"class":345},"chart",[318,720,721],{"class":324},"\"\n",[318,723,725,728,730,732,735],{"class":320,"line":724},23,[318,726,727],{"class":332},"    :data-chart",[318,729,339],{"class":324},[318,731,342],{"class":324},[318,733,734],{"class":345},"chartId",[318,736,721],{"class":324},[318,738,740,743,745,747],{"class":320,"line":739},24,[318,741,742],{"class":332},"    :class",[318,744,339],{"class":324},[318,746,342],{"class":324},[318,748,749],{"class":345},"cn(\n",[318,751,753],{"class":320,"line":752},25,[318,754,755],{"class":345},"      'flex aspect-video justify-center text-xs',\n",[318,757,759],{"class":320,"line":758},26,[318,760,761],{"class":345},"      '[--v-charts-grid:var(--border)] [--v-charts-axis:var(--border)] [--v-charts-text:var(--muted-foreground)]',\n",[318,763,765],{"class":320,"line":764},27,[318,766,767],{"class":345},"      '[--v-charts-cursor:var(--border)] [--v-charts-muted:var(--muted)] [--v-charts-background:var(--background)]',\n",[318,769,771],{"class":320,"line":770},28,[318,772,773],{"class":345},"      '[--v-charts-inactive:var(--muted-foreground)] [--v-charts-focus:var(--ring)]',\n",[318,775,777],{"class":320,"line":776},29,[318,778,779],{"class":345},"      '[&_.v-charts-surface]:outline-hidden [&_.v-charts-layer]:outline-hidden [&_.v-charts-sector]:outline-hidden',\n",[318,781,783],{"class":320,"line":782},30,[318,784,785],{"class":345},"      props.class,\n",[318,787,789,792],{"class":320,"line":788},31,[318,790,791],{"class":345},"    )",[318,793,721],{"class":324},[318,795,797],{"class":320,"line":796},32,[318,798,799],{"class":324},"  >\n",[318,801,803,806],{"class":320,"line":802},33,[318,804,805],{"class":324},"    \u003C",[318,807,808],{"class":328},"ChartStyle\n",[318,810,812,815,818,820,822,824],{"class":320,"line":811},34,[318,813,814],{"class":324},"      :",[318,816,817],{"class":332},"id",[318,819,339],{"class":324},[318,821,342],{"class":324},[318,823,734],{"class":367},[318,825,721],{"class":324},[318,827,829,831,834,836,838,840],{"class":320,"line":828},35,[318,830,814],{"class":324},[318,832,833],{"class":332},"config",[318,835,339],{"class":324},[318,837,342],{"class":324},[318,839,833],{"class":367},[318,841,721],{"class":324},[318,843,845],{"class":320,"line":844},36,[318,846,847],{"class":324},"    \u002F>\n",[318,849,851,853,856],{"class":320,"line":850},37,[318,852,805],{"class":324},[318,854,855],{"class":328},"slot",[318,857,858],{"class":324}," \u002F>\n",[318,860,862,865,868],{"class":320,"line":861},38,[318,863,864],{"class":324},"  \u003C\u002F",[318,866,867],{"class":328},"div",[318,869,351],{"class":324},[318,871,873,875,877],{"class":320,"line":872},39,[318,874,670],{"class":324},[318,876,687],{"class":328},[318,878,351],{"class":324},[308,880,883],{"className":310,"code":881,"filename":882,"language":313,"meta":314,"style":314},"\u003Cscript setup lang=\"ts\">\nimport type { ChartConfig } from '.\u002Ftypes'\n\nconst props = defineProps\u003C{\n  id: string\n  config: ChartConfig\n}>()\n\n\u002F\u002F Same contract as shadcn: `color` for both themes, or `theme: { light, dark }`.\nconst THEMES = { light: '', dark: '.dark' } as const\n\u002F\u002F A literal \u003Cstyle> in a template is stripped by the SFC compiler.\nconst styleTag = 'style'\n\nconst css = computed(() => {\n  const entries = Object.entries(props.config).filter(([, item]) => item.theme || item.color)\n  if (!entries.length)\n    return ''\n  return Object.entries(THEMES).map(([theme, prefix]) => {\n    const vars = entries\n      .map(([key, item]) => {\n        const color = item.theme?.[theme as keyof typeof THEMES] ?? item.color\n        return color ? `  --color-${key}: ${color};` : null\n      })\n      .filter(Boolean)\n      .join('\\n')\n    return `${prefix} [data-chart=${props.id}] {\\n${vars}\\n}`\n  }).join('\\n')\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Ccomponent\n    :is=\"styleTag\"\n    v-if=\"css\"\n  >\n    {{ css }}\n  \u003C\u002Fcomponent>\n\u003C\u002Ftemplate>\n","components\u002Fui\u002Fchart\u002FChartStyle.vue",[289,884,885,905,925,929,941,949,957,963,967,972,1012,1017,1033,1037,1057,1124,1144,1152,1193,1206,1230,1277,1320,1327,1340,1358,1402,1423,1429,1437,1441,1449,1456,1470,1484,1488,1493,1502],{"__ignoreMap":314},[318,886,887,889,891,893,895,897,899,901,903],{"class":320,"line":321},[318,888,325],{"class":324},[318,890,329],{"class":328},[318,892,333],{"class":332},[318,894,336],{"class":332},[318,896,339],{"class":324},[318,898,342],{"class":324},[318,900,346],{"class":345},[318,902,342],{"class":324},[318,904,351],{"class":324},[318,906,907,909,911,913,915,917,919,921,923],{"class":320,"line":354},[318,908,358],{"class":357},[318,910,361],{"class":357},[318,912,364],{"class":324},[318,914,394],{"class":367},[318,916,371],{"class":324},[318,918,374],{"class":357},[318,920,377],{"class":324},[318,922,403],{"class":345},[318,924,382],{"class":324},[318,926,927],{"class":320,"line":385},[318,928,451],{"emptyLinePlaceholder":450},[318,930,931,933,935,937,939],{"class":320,"line":408},[318,932,457],{"class":332},[318,934,460],{"class":367},[318,936,339],{"class":324},[318,938,466],{"class":465},[318,940,469],{"class":324},[318,942,943,945,947],{"class":320,"line":429},[318,944,475],{"class":328},[318,946,515],{"class":324},[318,948,482],{"class":481},[318,950,951,953,955],{"class":320,"line":447},[318,952,512],{"class":328},[318,954,515],{"class":324},[318,956,518],{"class":481},[318,958,959,961],{"class":320,"line":454},[318,960,524],{"class":324},[318,962,527],{"class":367},[318,964,965],{"class":320,"line":472},[318,966,451],{"emptyLinePlaceholder":450},[318,968,969],{"class":320,"line":485},[318,970,971],{"class":695},"\u002F\u002F Same contract as shadcn: `color` for both themes, or `theme: { light, dark }`.\n",[318,973,974,976,979,981,983,986,988,990,992,995,997,999,1002,1004,1006,1009],{"class":320,"line":509},[318,975,457],{"class":332},[318,977,978],{"class":367}," THEMES ",[318,980,339],{"class":324},[318,982,364],{"class":324},[318,984,985],{"class":328}," light",[318,987,515],{"class":324},[318,989,617],{"class":324},[318,991,614],{"class":324},[318,993,994],{"class":328}," dark",[318,996,515],{"class":324},[318,998,377],{"class":324},[318,1000,1001],{"class":345},".dark",[318,1003,498],{"class":324},[318,1005,371],{"class":324},[318,1007,1008],{"class":357}," as",[318,1010,1011],{"class":332}," const\n",[318,1013,1014],{"class":320,"line":521},[318,1015,1016],{"class":695},"\u002F\u002F A literal \u003Cstyle> in a template is stripped by the SFC compiler.\n",[318,1018,1019,1021,1024,1026,1028,1031],{"class":320,"line":530},[318,1020,457],{"class":332},[318,1022,1023],{"class":367}," styleTag ",[318,1025,339],{"class":324},[318,1027,377],{"class":324},[318,1029,1030],{"class":345},"style",[318,1032,382],{"class":324},[318,1034,1035],{"class":320,"line":535},[318,1036,451],{"emptyLinePlaceholder":450},[318,1038,1039,1041,1044,1046,1048,1050,1052,1054],{"class":320,"line":550},[318,1040,457],{"class":332},[318,1042,1043],{"class":367}," css ",[318,1045,339],{"class":324},[318,1047,560],{"class":465},[318,1049,563],{"class":367},[318,1051,566],{"class":324},[318,1053,569],{"class":332},[318,1055,1056],{"class":324}," {\n",[318,1058,1059,1062,1065,1068,1071,1073,1076,1078,1080,1082,1084,1086,1088,1091,1093,1096,1100,1103,1105,1107,1109,1112,1115,1117,1119,1122],{"class":320,"line":629},[318,1060,1061],{"class":332},"  const",[318,1063,1064],{"class":367}," entries",[318,1066,1067],{"class":324}," =",[318,1069,1070],{"class":367}," Object",[318,1072,584],{"class":324},[318,1074,1075],{"class":465},"entries",[318,1077,563],{"class":328},[318,1079,581],{"class":367},[318,1081,584],{"class":324},[318,1083,833],{"class":367},[318,1085,620],{"class":328},[318,1087,584],{"class":324},[318,1089,1090],{"class":465},"filter",[318,1092,563],{"class":328},[318,1094,1095],{"class":324},"([,",[318,1097,1099],{"class":1098},"sHdIc"," item",[318,1101,1102],{"class":324},"])",[318,1104,569],{"class":332},[318,1106,1099],{"class":367},[318,1108,584],{"class":324},[318,1110,1111],{"class":367},"theme",[318,1113,1114],{"class":324}," ||",[318,1116,1099],{"class":367},[318,1118,584],{"class":324},[318,1120,1121],{"class":367},"color",[318,1123,626],{"class":328},[318,1125,1126,1129,1132,1135,1137,1139,1142],{"class":320,"line":634},[318,1127,1128],{"class":357},"  if",[318,1130,1131],{"class":328}," (",[318,1133,1134],{"class":324},"!",[318,1136,1075],{"class":367},[318,1138,584],{"class":324},[318,1140,1141],{"class":367},"length",[318,1143,626],{"class":328},[318,1145,1146,1149],{"class":320,"line":667},[318,1147,1148],{"class":357},"    return",[318,1150,1151],{"class":324}," ''\n",[318,1153,1154,1157,1159,1161,1163,1165,1168,1170,1172,1175,1177,1180,1182,1184,1187,1189,1191],{"class":320,"line":677},[318,1155,1156],{"class":357},"  return",[318,1158,1070],{"class":367},[318,1160,584],{"class":324},[318,1162,1075],{"class":465},[318,1164,563],{"class":328},[318,1166,1167],{"class":367},"THEMES",[318,1169,620],{"class":328},[318,1171,584],{"class":324},[318,1173,1174],{"class":465},"map",[318,1176,563],{"class":328},[318,1178,1179],{"class":324},"([",[318,1181,1111],{"class":1098},[318,1183,614],{"class":324},[318,1185,1186],{"class":1098}," prefix",[318,1188,1102],{"class":324},[318,1190,569],{"class":332},[318,1192,1056],{"class":324},[318,1194,1195,1198,1201,1203],{"class":320,"line":682},[318,1196,1197],{"class":332},"    const",[318,1199,1200],{"class":367}," vars",[318,1202,1067],{"class":324},[318,1204,1205],{"class":367}," entries\n",[318,1207,1208,1211,1213,1215,1217,1220,1222,1224,1226,1228],{"class":320,"line":692},[318,1209,1210],{"class":324},"      .",[318,1212,1174],{"class":465},[318,1214,563],{"class":328},[318,1216,1179],{"class":324},[318,1218,1219],{"class":1098},"key",[318,1221,614],{"class":324},[318,1223,1099],{"class":1098},[318,1225,1102],{"class":324},[318,1227,569],{"class":332},[318,1229,1056],{"class":324},[318,1231,1232,1235,1238,1240,1242,1244,1246,1249,1251,1253,1255,1258,1261,1264,1267,1270,1272,1274],{"class":320,"line":699},[318,1233,1234],{"class":332},"        const",[318,1236,1237],{"class":367}," color",[318,1239,1067],{"class":324},[318,1241,1099],{"class":367},[318,1243,584],{"class":324},[318,1245,1111],{"class":367},[318,1247,1248],{"class":324},"?.",[318,1250,495],{"class":328},[318,1252,1111],{"class":367},[318,1254,1008],{"class":357},[318,1256,1257],{"class":324}," keyof",[318,1259,1260],{"class":324}," typeof",[318,1262,1263],{"class":367}," THEMES",[318,1265,1266],{"class":328},"] ",[318,1268,1269],{"class":324},"??",[318,1271,1099],{"class":367},[318,1273,584],{"class":324},[318,1275,1276],{"class":367},"color\n",[318,1278,1279,1282,1284,1287,1289,1292,1294,1296,1299,1302,1304,1306,1308,1311,1314,1317],{"class":320,"line":708},[318,1280,1281],{"class":357},"        return",[318,1283,1237],{"class":367},[318,1285,1286],{"class":324}," ?",[318,1288,572],{"class":324},[318,1290,1291],{"class":345},"  --color-",[318,1293,578],{"class":324},[318,1295,1219],{"class":367},[318,1297,1298],{"class":324},"}",[318,1300,1301],{"class":345},": ",[318,1303,578],{"class":324},[318,1305,1121],{"class":367},[318,1307,1298],{"class":324},[318,1309,1310],{"class":345},";",[318,1312,1313],{"class":324},"`",[318,1315,1316],{"class":324}," :",[318,1318,1319],{"class":324}," null\n",[318,1321,1322,1325],{"class":320,"line":724},[318,1323,1324],{"class":324},"      }",[318,1326,626],{"class":328},[318,1328,1329,1331,1333,1335,1338],{"class":320,"line":739},[318,1330,1210],{"class":324},[318,1332,1090],{"class":465},[318,1334,563],{"class":328},[318,1336,1337],{"class":367},"Boolean",[318,1339,626],{"class":328},[318,1341,1342,1344,1347,1349,1351,1354,1356],{"class":320,"line":752},[318,1343,1210],{"class":324},[318,1345,1346],{"class":465},"join",[318,1348,563],{"class":328},[318,1350,498],{"class":324},[318,1352,1353],{"class":367},"\\n",[318,1355,498],{"class":324},[318,1357,626],{"class":328},[318,1359,1360,1362,1365,1368,1370,1373,1375,1377,1379,1381,1383,1386,1388,1390,1393,1395,1397,1399],{"class":320,"line":758},[318,1361,1148],{"class":357},[318,1363,1364],{"class":324}," `${",[318,1366,1367],{"class":367},"prefix",[318,1369,1298],{"class":324},[318,1371,1372],{"class":345}," [data-chart=",[318,1374,578],{"class":324},[318,1376,581],{"class":367},[318,1378,584],{"class":324},[318,1380,817],{"class":367},[318,1382,1298],{"class":324},[318,1384,1385],{"class":345},"] {",[318,1387,1353],{"class":367},[318,1389,578],{"class":324},[318,1391,1392],{"class":367},"vars",[318,1394,1298],{"class":324},[318,1396,1353],{"class":367},[318,1398,1298],{"class":345},[318,1400,1401],{"class":324},"`\n",[318,1403,1404,1407,1409,1411,1413,1415,1417,1419,1421],{"class":320,"line":764},[318,1405,1406],{"class":324},"  }",[318,1408,620],{"class":328},[318,1410,584],{"class":324},[318,1412,1346],{"class":465},[318,1414,563],{"class":328},[318,1416,498],{"class":324},[318,1418,1353],{"class":367},[318,1420,498],{"class":324},[318,1422,626],{"class":328},[318,1424,1425,1427],{"class":320,"line":770},[318,1426,1298],{"class":324},[318,1428,626],{"class":367},[318,1430,1431,1433,1435],{"class":320,"line":776},[318,1432,670],{"class":324},[318,1434,329],{"class":328},[318,1436,351],{"class":324},[318,1438,1439],{"class":320,"line":782},[318,1440,451],{"emptyLinePlaceholder":450},[318,1442,1443,1445,1447],{"class":320,"line":788},[318,1444,325],{"class":324},[318,1446,687],{"class":328},[318,1448,351],{"class":324},[318,1450,1451,1453],{"class":320,"line":796},[318,1452,702],{"class":324},[318,1454,1455],{"class":328},"component\n",[318,1457,1458,1461,1463,1465,1468],{"class":320,"line":802},[318,1459,1460],{"class":332},"    :is",[318,1462,339],{"class":324},[318,1464,342],{"class":324},[318,1466,1467],{"class":345},"styleTag",[318,1469,721],{"class":324},[318,1471,1472,1475,1477,1479,1482],{"class":320,"line":811},[318,1473,1474],{"class":332},"    v-if",[318,1476,339],{"class":324},[318,1478,342],{"class":324},[318,1480,1481],{"class":345},"css",[318,1483,721],{"class":324},[318,1485,1486],{"class":320,"line":828},[318,1487,799],{"class":324},[318,1489,1490],{"class":320,"line":844},[318,1491,1492],{"class":367},"    {{ css }}\n",[318,1494,1495,1497,1500],{"class":320,"line":850},[318,1496,864],{"class":324},[318,1498,1499],{"class":328},"component",[318,1501,351],{"class":324},[318,1503,1504,1506,1508],{"class":320,"line":861},[318,1505,670],{"class":324},[318,1507,687],{"class":328},[318,1509,351],{"class":324},[304,1511,1513],{"id":1512},"use-it","Use it",[308,1515,1517],{"className":310,"code":1516,"language":313,"meta":314,"style":314},"\u003Cscript setup lang=\"ts\">\nimport { Area, AreaChart, CartesianGrid, Tooltip, XAxis } from 'vccs'\nimport { type ChartConfig, ChartContainer, ChartTooltipContent } from '@\u002Fcomponents\u002Fui\u002Fchart'\n\nconst chartConfig = {\n  desktop: { label: 'Desktop', color: 'var(--chart-1)' },\n  mobile: { label: 'Mobile', color: 'var(--chart-2)' },\n} satisfies ChartConfig\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CChartContainer\n    :config=\"chartConfig\"\n    class=\"aspect-auto h-[250px] w-full\"\n  >\n    \u003CAreaChart :data=\"data\">\n      \u003CCartesianGrid :vertical=\"false\" \u002F>\n      \u003CXAxis\n        data-key=\"date\"\n        :tick-line=\"false\"\n        :axis-line=\"false\"\n      \u002F>\n      \u003CTooltip :cursor=\"false\">\n        \u003Ctemplate #content=\"{ active, payload, label }\">\n          \u003CChartTooltipContent\n            :active=\"active\"\n            :payload=\"payload\"\n            :label=\"label\"\n          \u002F>\n        \u003C\u002Ftemplate>\n      \u003C\u002FTooltip>\n      \u003CArea\n        data-key=\"mobile\"\n        fill=\"var(--color-mobile)\"\n        stroke=\"var(--color-mobile)\"\n        stack-id=\"a\"\n      \u002F>\n      \u003CArea\n        data-key=\"desktop\"\n        fill=\"var(--color-desktop)\"\n        stroke=\"var(--color-desktop)\"\n        stack-id=\"a\"\n      \u002F>\n    \u003C\u002FAreaChart>\n  \u003C\u002FChartContainer>\n\u003C\u002Ftemplate>\n",[289,1518,1519,1539,1579,1610,1614,1625,1662,1697,1706,1714,1718,1726,1733,1749,1763,1767,1789,1813,1820,1834,1850,1865,1870,1891,1930,1938,1954,1969,1984,1989,1998,2007,2014,2027,2041,2054,2068,2072,2078,2091,2105,2118,2131,2136,2146,2155],{"__ignoreMap":314},[318,1520,1521,1523,1525,1527,1529,1531,1533,1535,1537],{"class":320,"line":321},[318,1522,325],{"class":324},[318,1524,329],{"class":328},[318,1526,333],{"class":332},[318,1528,336],{"class":332},[318,1530,339],{"class":324},[318,1532,342],{"class":324},[318,1534,346],{"class":345},[318,1536,342],{"class":324},[318,1538,351],{"class":324},[318,1540,1541,1543,1545,1548,1550,1553,1555,1558,1560,1563,1565,1568,1570,1572,1574,1577],{"class":320,"line":354},[318,1542,358],{"class":357},[318,1544,364],{"class":324},[318,1546,1547],{"class":367}," Area",[318,1549,614],{"class":324},[318,1551,1552],{"class":367}," AreaChart",[318,1554,614],{"class":324},[318,1556,1557],{"class":367}," CartesianGrid",[318,1559,614],{"class":324},[318,1561,1562],{"class":367}," Tooltip",[318,1564,614],{"class":324},[318,1566,1567],{"class":367}," XAxis",[318,1569,371],{"class":324},[318,1571,374],{"class":357},[318,1573,377],{"class":324},[318,1575,1576],{"class":345},"vccs",[318,1578,382],{"class":324},[318,1580,1581,1583,1585,1587,1589,1591,1594,1596,1599,1601,1603,1605,1608],{"class":320,"line":385},[318,1582,358],{"class":357},[318,1584,364],{"class":324},[318,1586,361],{"class":357},[318,1588,394],{"class":367},[318,1590,614],{"class":324},[318,1592,1593],{"class":367}," ChartContainer",[318,1595,614],{"class":324},[318,1597,1598],{"class":367}," ChartTooltipContent",[318,1600,371],{"class":324},[318,1602,374],{"class":357},[318,1604,377],{"class":324},[318,1606,1607],{"class":345},"@\u002Fcomponents\u002Fui\u002Fchart",[318,1609,382],{"class":324},[318,1611,1612],{"class":320,"line":408},[318,1613,451],{"emptyLinePlaceholder":450},[318,1615,1616,1618,1621,1623],{"class":320,"line":429},[318,1617,457],{"class":332},[318,1619,1620],{"class":367}," chartConfig ",[318,1622,339],{"class":324},[318,1624,1056],{"class":324},[318,1626,1627,1630,1632,1634,1637,1639,1641,1644,1646,1648,1650,1652,1654,1657,1659],{"class":320,"line":447},[318,1628,1629],{"class":328},"  desktop",[318,1631,515],{"class":324},[318,1633,364],{"class":324},[318,1635,1636],{"class":328}," label",[318,1638,515],{"class":324},[318,1640,377],{"class":324},[318,1642,1643],{"class":345},"Desktop",[318,1645,498],{"class":324},[318,1647,614],{"class":324},[318,1649,1237],{"class":328},[318,1651,515],{"class":324},[318,1653,377],{"class":324},[318,1655,1656],{"class":345},"var(--chart-1)",[318,1658,498],{"class":324},[318,1660,1661],{"class":324}," },\n",[318,1663,1664,1667,1669,1671,1673,1675,1677,1680,1682,1684,1686,1688,1690,1693,1695],{"class":320,"line":454},[318,1665,1666],{"class":328},"  mobile",[318,1668,515],{"class":324},[318,1670,364],{"class":324},[318,1672,1636],{"class":328},[318,1674,515],{"class":324},[318,1676,377],{"class":324},[318,1678,1679],{"class":345},"Mobile",[318,1681,498],{"class":324},[318,1683,614],{"class":324},[318,1685,1237],{"class":328},[318,1687,515],{"class":324},[318,1689,377],{"class":324},[318,1691,1692],{"class":345},"var(--chart-2)",[318,1694,498],{"class":324},[318,1696,1661],{"class":324},[318,1698,1699,1701,1704],{"class":320,"line":472},[318,1700,1298],{"class":324},[318,1702,1703],{"class":357}," satisfies",[318,1705,518],{"class":481},[318,1707,1708,1710,1712],{"class":320,"line":485},[318,1709,670],{"class":324},[318,1711,329],{"class":328},[318,1713,351],{"class":324},[318,1715,1716],{"class":320,"line":509},[318,1717,451],{"emptyLinePlaceholder":450},[318,1719,1720,1722,1724],{"class":320,"line":521},[318,1721,325],{"class":324},[318,1723,687],{"class":328},[318,1725,351],{"class":324},[318,1727,1728,1730],{"class":320,"line":530},[318,1729,702],{"class":324},[318,1731,1732],{"class":328},"ChartContainer\n",[318,1734,1735,1738,1740,1742,1744,1747],{"class":320,"line":535},[318,1736,1737],{"class":324},"    :",[318,1739,833],{"class":332},[318,1741,339],{"class":324},[318,1743,342],{"class":324},[318,1745,1746],{"class":367},"chartConfig",[318,1748,721],{"class":324},[318,1750,1751,1754,1756,1758,1761],{"class":320,"line":550},[318,1752,1753],{"class":332},"    class",[318,1755,339],{"class":324},[318,1757,342],{"class":324},[318,1759,1760],{"class":345},"aspect-auto h-[250px] w-full",[318,1762,721],{"class":324},[318,1764,1765],{"class":320,"line":629},[318,1766,799],{"class":324},[318,1768,1769,1771,1774,1776,1779,1781,1783,1785,1787],{"class":320,"line":634},[318,1770,805],{"class":324},[318,1772,1773],{"class":328},"AreaChart",[318,1775,1316],{"class":324},[318,1777,1778],{"class":332},"data",[318,1780,339],{"class":324},[318,1782,342],{"class":324},[318,1784,1778],{"class":367},[318,1786,342],{"class":324},[318,1788,351],{"class":324},[318,1790,1791,1794,1796,1798,1801,1803,1805,1809,1811],{"class":320,"line":667},[318,1792,1793],{"class":324},"      \u003C",[318,1795,228],{"class":328},[318,1797,1316],{"class":324},[318,1799,1800],{"class":332},"vertical",[318,1802,339],{"class":324},[318,1804,342],{"class":324},[318,1806,1808],{"class":1807},"sfNiH","false",[318,1810,342],{"class":324},[318,1812,858],{"class":324},[318,1814,1815,1817],{"class":320,"line":677},[318,1816,1793],{"class":324},[318,1818,1819],{"class":328},"XAxis\n",[318,1821,1822,1825,1827,1829,1832],{"class":320,"line":682},[318,1823,1824],{"class":332},"        data-key",[318,1826,339],{"class":324},[318,1828,342],{"class":324},[318,1830,1831],{"class":345},"date",[318,1833,721],{"class":324},[318,1835,1836,1839,1842,1844,1846,1848],{"class":320,"line":692},[318,1837,1838],{"class":324},"        :",[318,1840,1841],{"class":332},"tick-line",[318,1843,339],{"class":324},[318,1845,342],{"class":324},[318,1847,1808],{"class":1807},[318,1849,721],{"class":324},[318,1851,1852,1854,1857,1859,1861,1863],{"class":320,"line":699},[318,1853,1838],{"class":324},[318,1855,1856],{"class":332},"axis-line",[318,1858,339],{"class":324},[318,1860,342],{"class":324},[318,1862,1808],{"class":1807},[318,1864,721],{"class":324},[318,1866,1867],{"class":320,"line":708},[318,1868,1869],{"class":324},"      \u002F>\n",[318,1871,1872,1874,1876,1878,1881,1883,1885,1887,1889],{"class":320,"line":724},[318,1873,1793],{"class":324},[318,1875,218],{"class":328},[318,1877,1316],{"class":324},[318,1879,1880],{"class":332},"cursor",[318,1882,339],{"class":324},[318,1884,342],{"class":324},[318,1886,1808],{"class":1807},[318,1888,342],{"class":324},[318,1890,351],{"class":324},[318,1892,1893,1896,1898,1901,1904,1906,1908,1911,1914,1916,1919,1921,1924,1926,1928],{"class":320,"line":739},[318,1894,1895],{"class":324},"        \u003C",[318,1897,687],{"class":328},[318,1899,1900],{"class":324}," #",[318,1902,1903],{"class":332},"content",[318,1905,339],{"class":324},[318,1907,342],{"class":324},[318,1909,1910],{"class":324},"{",[318,1912,1913],{"class":367}," active",[318,1915,614],{"class":324},[318,1917,1918],{"class":367}," payload",[318,1920,614],{"class":324},[318,1922,1923],{"class":367}," label ",[318,1925,1298],{"class":324},[318,1927,342],{"class":324},[318,1929,351],{"class":324},[318,1931,1932,1935],{"class":320,"line":752},[318,1933,1934],{"class":324},"          \u003C",[318,1936,1937],{"class":328},"ChartTooltipContent\n",[318,1939,1940,1943,1946,1948,1950,1952],{"class":320,"line":758},[318,1941,1942],{"class":324},"            :",[318,1944,1945],{"class":332},"active",[318,1947,339],{"class":324},[318,1949,342],{"class":324},[318,1951,1945],{"class":367},[318,1953,721],{"class":324},[318,1955,1956,1958,1961,1963,1965,1967],{"class":320,"line":764},[318,1957,1942],{"class":324},[318,1959,1960],{"class":332},"payload",[318,1962,339],{"class":324},[318,1964,342],{"class":324},[318,1966,1960],{"class":367},[318,1968,721],{"class":324},[318,1970,1971,1973,1976,1978,1980,1982],{"class":320,"line":770},[318,1972,1942],{"class":324},[318,1974,1975],{"class":332},"label",[318,1977,339],{"class":324},[318,1979,342],{"class":324},[318,1981,1975],{"class":367},[318,1983,721],{"class":324},[318,1985,1986],{"class":320,"line":776},[318,1987,1988],{"class":324},"          \u002F>\n",[318,1990,1991,1994,1996],{"class":320,"line":782},[318,1992,1993],{"class":324},"        \u003C\u002F",[318,1995,687],{"class":328},[318,1997,351],{"class":324},[318,1999,2000,2003,2005],{"class":320,"line":788},[318,2001,2002],{"class":324},"      \u003C\u002F",[318,2004,218],{"class":328},[318,2006,351],{"class":324},[318,2008,2009,2011],{"class":320,"line":796},[318,2010,1793],{"class":324},[318,2012,2013],{"class":328},"Area\n",[318,2015,2016,2018,2020,2022,2025],{"class":320,"line":802},[318,2017,1824],{"class":332},[318,2019,339],{"class":324},[318,2021,342],{"class":324},[318,2023,2024],{"class":345},"mobile",[318,2026,721],{"class":324},[318,2028,2029,2032,2034,2036,2039],{"class":320,"line":811},[318,2030,2031],{"class":332},"        fill",[318,2033,339],{"class":324},[318,2035,342],{"class":324},[318,2037,2038],{"class":345},"var(--color-mobile)",[318,2040,721],{"class":324},[318,2042,2043,2046,2048,2050,2052],{"class":320,"line":828},[318,2044,2045],{"class":332},"        stroke",[318,2047,339],{"class":324},[318,2049,342],{"class":324},[318,2051,2038],{"class":345},[318,2053,721],{"class":324},[318,2055,2056,2059,2061,2063,2066],{"class":320,"line":844},[318,2057,2058],{"class":332},"        stack-id",[318,2060,339],{"class":324},[318,2062,342],{"class":324},[318,2064,2065],{"class":345},"a",[318,2067,721],{"class":324},[318,2069,2070],{"class":320,"line":850},[318,2071,1869],{"class":324},[318,2073,2074,2076],{"class":320,"line":861},[318,2075,1793],{"class":324},[318,2077,2013],{"class":328},[318,2079,2080,2082,2084,2086,2089],{"class":320,"line":872},[318,2081,1824],{"class":332},[318,2083,339],{"class":324},[318,2085,342],{"class":324},[318,2087,2088],{"class":345},"desktop",[318,2090,721],{"class":324},[318,2092,2094,2096,2098,2100,2103],{"class":320,"line":2093},40,[318,2095,2031],{"class":332},[318,2097,339],{"class":324},[318,2099,342],{"class":324},[318,2101,2102],{"class":345},"var(--color-desktop)",[318,2104,721],{"class":324},[318,2106,2108,2110,2112,2114,2116],{"class":320,"line":2107},41,[318,2109,2045],{"class":332},[318,2111,339],{"class":324},[318,2113,342],{"class":324},[318,2115,2102],{"class":345},[318,2117,721],{"class":324},[318,2119,2121,2123,2125,2127,2129],{"class":320,"line":2120},42,[318,2122,2058],{"class":332},[318,2124,339],{"class":324},[318,2126,342],{"class":324},[318,2128,2065],{"class":345},[318,2130,721],{"class":324},[318,2132,2134],{"class":320,"line":2133},43,[318,2135,1869],{"class":324},[318,2137,2139,2142,2144],{"class":320,"line":2138},44,[318,2140,2141],{"class":324},"    \u003C\u002F",[318,2143,1773],{"class":328},[318,2145,351],{"class":324},[318,2147,2149,2151,2153],{"class":320,"line":2148},45,[318,2150,864],{"class":324},[318,2152,291],{"class":328},[318,2154,351],{"class":324},[318,2156,2158,2160,2162],{"class":320,"line":2157},46,[318,2159,670],{"class":324},[318,2161,687],{"class":328},[318,2163,351],{"class":324},[285,2165,2166,2167,2170],{},"The chart fills the container; no ",[289,2168,2169],{},"ResponsiveContainer"," is needed. The container's default 16:9 box matches the size charts render at on the server.",[1030,2172,2173],{},"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 .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 .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}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}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 .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}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":314,"searchDepth":354,"depth":354,"links":2175},[2176,2177],{"id":306,"depth":354,"text":291},{"id":1512,"depth":354,"text":1513},"Use vccs with shadcn-vue's chart components","md",null,{},{"icon":101},{"title":98,"description":2178},"VHoAcPqOfI_dPFLexwy9lw9lmcn2IkSrRD6ulznD-qc",[2186,2188],{"title":93,"path":94,"stem":95,"description":2187,"icon":96,"children":-1},"Style every chart through CSS variables",{"title":103,"path":104,"stem":105,"description":2189,"icon":106,"children":-1},"Donut with a center value, gauge and conversion funnel from the existing charts",1791811112152]