https://tailwindadmin-tanstack-start-pro.netlify.app/assets/gradient-ULWzjV-v.js

1const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/react-apexcharts.esm-BrmfUpoY.js","assets/main-DTgSv9p_.js","assets/_commonjsHelpers-CE1G-McA.js","assets/main-DvB2Xm2x.css","assets/index-C8UgGVIT.js"])))=>i.map(i=>d[i]);
2import{j as t,c as e,r as o,_ as i}from"./main-DTgSv9p_.js";import{C as a}from"./card-CpOP64kH.js";import{C as s}from"./CodeDialog-BGuxWifq.js";import{B as l}from"./BreadcrumbComp-CsiY6TRt.js";import"./_commonjsHelpers-CE1G-McA.js";import"./utils-4perknFd.js";import"./iconify-mGx0kJHh.js";import"./index-0dQnCVJD.js";import"./index-BMnuVYbS.js";/* empty css                    */import"./tooltip-CZ0d1x_g.js";import"./index-BsJZfXWL.js";import"./index-iNwbFFs7.js";import"./index-BJmaLURS.js";import"./index-Cje_hKxh.js";import"./index-B89h947f.js";import"./index-Bequ1tCx.js";import"./index-BaR1yCY5.js";import"./floating-ui.dom-D7G01c1r.js";import"./index-C3HJTmKN.js";import"./index-BdD4bfGm.js";import"./CardBox-Bm8QxxqP.js";const n=o.lazy(()=>i(()=>import("./react-apexcharts.esm-BrmfUpoY.js"),__vite__mapDeps([0,1,2,3,4]))),p=()=>{const r={series:[{name:"Likes",data:[4,3,10,9,35,19,22,9,12,7,19,5,13,9,17,2,7,5]}],chart:{type:"line",height:350,fontFamily:"inherit",foreColor:"var(--color-lightmuted)",toolbar:{show:!1},dropShadow:{enabled:!0,color:"rgba(0,0,0,0.2)",top:12,left:4,blur:3,opacity:.4}},stroke:{width:7,curve:"smooth"},xaxis:{type:"datetime",categories:["1/11/2000","2/11/2000","3/11/2000","4/11/2000","5/11/2000","6/11/2000","7/11/2000","8/11/2000","9/11/2000","10/11/2000","11/11/2000","12/11/2000","1/11/2001","2/11/2001","3/11/2001","4/11/2001","5/11/2001","6/11/2001"],axisBorder:{color:"rgba(173,181,189,0.3)"}},fill:{type:"gradient",gradient:{shade:"dark",gradientToColors:["#0b70fb"],shadeIntensity:1,type:"horizontal",opacityFrom:1,opacityTo:.9,stops:[0,100,100,100]}},markers:{size:4,colors:["#4e79ff"],strokeColors:"#fff",strokeWidth:2,hover:{size:7}},yaxis:{min:0,max:40},grid:{show:!1},tooltip:{theme:"light"}};return t.jsx(t.Fragment,{children:t.jsx(e,{fallback:null,children:t.jsx(n,{options:r,series:r.series,type:"line",height:"350px",width:"100%"})})})},m=`
3import { ApexOptions } from 'apexcharts';
4import { Suspense, lazy } from "react";
5
6const Chart = lazy(() => import("react-apexcharts"));
7
8import { ClientOnly } from '@tanstack/react-router'
9
10const ApexGradientChartCode = () => {
11  const ChartData: ApexOptions = {
12    series: [
13      {
14        name: 'Likes',
15        data: [4, 3, 10, 9, 35, 19, 22, 9, 12, 7, 19, 5, 13, 9, 17, 2, 7, 5],
16      },
17    ],
18    chart: {
19      type: 'line',
20      height: 350,
21      fontFamily: \`inherit\`,
22      foreColor: 'var(--color-lightmuted)',
23      toolbar: {
24        show: false,
25      },
26      dropShadow: {
27        enabled: true,
28        color: 'rgba(0,0,0,0.2)',
29        top: 12,
30        left: 4,
31        blur: 3,
32        opacity: 0.4,
33      },
34    },
35    stroke: {
36      width: 7,
37      curve: 'smooth',
38    },
39
40    xaxis: {
41      type: 'datetime',
42      categories: [
43        '1/11/2000',
44        '2/11/2000',
45        '3/11/2000',
46        '4/11/2000',
47        '5/11/2000',
48        '6/11/2000',
49        '7/11/2000',
50        '8/11/2000',
51        '9/11/2000',
52        '10/11/2000',
53        '11/11/2000',
54        '12/11/2000',
55        '1/11/2001',
56        '2/11/2001',
57        '3/11/2001',
58        '4/11/2001',
59        '5/11/2001',
60        '6/11/2001',
61      ],
62      axisBorder: {
63        color: 'rgba(173,181,189,0.3)',
64      },
65    },
66    fill: {
67      type: 'gradient',
68      gradient: {
69        shade: 'dark',
70        gradientToColors: ['#0b70fb'],
71        shadeIntensity: 1,
72        type: 'horizontal',
73        opacityFrom: 1,
74        opacityTo: 0.9,
75        stops: [0, 100, 100, 100],
76      },
77    },
78    markers: {
79      size: 4,
80
81      colors: ["#4e79ff"],
82
83      strokeColors: "#fff",
84      strokeWidth: 2,
85
86      hover: {
87        size: 7,
88      },
89    },
90    yaxis: {
91      min: 0,
92      max: 40,
93    },
94    grid: {
95      show: false,
96    },
97    tooltip: {
98      theme: 'light',
99    },
100  };
101  return (
102    <>
103   <ClientOnly fallback={null}>
104
105      <Chart
106        options={ChartData}
107        series={ChartData.series}
108        type="line"
109        height="350px"
110        width="100%"
111      />
112     </ClientOnly>
113    </>
114  );
115};
116
117export default ApexGradientChartCode;
118`,h=()=>t.jsx(t.Fragment,{children:t.jsx(a,{className:"p-0",children:t.jsxs("div",{children:[t.jsxs("div",{className:"p-6",children:[t.jsx("h4",{className:"text-lg font-semibold mb-4",children:"Gradient Chart"}),t.jsx(p,{})]}),t.jsx(s,{children:m})]})})}),d=[{to:"/",title:"Home"},{to:"",title:"Chart Apex Gradient"}];function I(){return t.jsxs(t.Fragment,{children:[t.jsx(l,{title:"Chart Apex Gradient",items:d}),t.jsx(h,{})]})}

118export{I as component};