text: // ##############################
  // // // javascript library for creating charts
  // #############################
  var Chartist = require("chartist");
  
  // ##############################
  // // // variables used to create animation on charts
  // #############################
  var delays = 80,
    durations = 500;
  var delays2 = 80,
    durations2 = 500;
  
  // ##############################
  // // // Daily Sales
  // #############################
  
  const dailySalesChart = {
    data: {
      labels: ["En", "Feb", "Mar", "Abr", "May", "Jun", "Jul"],
      series: [[40, 97, 117, 126, 150, 100, 135]],
    },
    options: {
      lineSmooth: Chartist.Interpolation.cardinal({
        tension: 0,
      }),
      low: 0,
      high: 200,
      chartPadding: {
        top: 0,
        right: 0,
        bottom: 0,
        left: 0,
      },
    },
    // for animation
    animation: {
      draw: function (data) {
        if (data.type === "line" || data.type === "area") {
          data.element.animate({
            d: {
              begin: 600,
              dur: 700,
              from: data.path
                .clone()
                .scale(1, 0)
                .translate(0, data.chartRect.height())
                .stringify(),
              to: data.path.clone().stringify(),
              easing: Chartist.Svg.Easing.easeOutQuint,
            },
          });
        } else if (data.type === "point") {
          data.element.animate({
            opacity: {
              begin: (data.index + 1) * delays,
              dur: durations,
              from: 0,
              to: 1,
              easing: "ease",
            },
          });
        }
      },
    },
  };
  
  // ##############################
  // // // Email Subscriptions
  // #############################
  
  const emailsSubscriptionChart = {
    data: {
      labels: ["L", "M", "M", "J", "V", "S", "D"],
      series: [[23, 15, 18, 10, 22, 7, 0]],
    },
    options: {
      axisX: {
        showGrid: false,
      },
      low: 0,
      high: 25,
      chartPadding: {
        top: 0,
        right: 5,
        bottom: 0,
        left: 0,
      },
    },
    responsiveOptions: [
      [
        "screen and (max-width: 640px)",
        {
          seriesBarDistance: 5,
          axisX: {
            labelInterpolationFnc: function (value) {
              return value[0];
            },
          },
        },
      ],
    ],
    animation: {
      draw: function (data) {
        if (data.type === "bar") {
          data.element.animate({
            opacity: {
              begin: (data.index + 1) * delays2,
              dur: durations2,
              from: 0,
              to: 1,
              easing: "ease",
            },
          });
        }
      },
    },
  };
  
  // ##############################
  // // // Completed Tasks
  // #############################
  
  const completedTasksChart = {
    data: {
      labels: ["Sem1", "Sem2", "Sem3", "Sem4"],
      series: [
        [130, 150, 90, 200],
        [103, 205, 45, 90],
      ],
    },
    options: {
      lineSmooth: Chartist.Interpolation.cardinal({
        tension: 0,
      }),
      low: 0,
      high: 250, // creative tim: we recommend you to set the high sa the biggest value + something for a better look
      chartPadding: {
        top: 0,
        right: 0,
        bottom: 0,
        left: 0,
      },
    },
    animation: {
      draw: function (data) {
        if (data.type === "line" || data.type === "area") {
          data.element.animate({
            d: {
              begin: 600,
              dur: 700,
              from: data.path
                .clone()
                .scale(1, 0)
                .translate(0, data.chartRect.height())
                .stringify(),
              to: data.path.clone().stringify(),
              easing: Chartist.Svg.Easing.easeOutQuint,
            },
          });
        } else if (data.type === "point") {
          data.element.animate({
            opacity: {
              begin: (data.index + 1) * delays,
              dur: durations,
              from: 0,
              to: 1,
              easing: "ease",
            },
          });
        }
      },
    },
  };
  
  module.exports = {
    dailySalesChart,
    emailsSubscriptionChart,
    completedTasksChart,
  };
  