Ratio Card

"use client";

import {
  IconEmotionHappy,
  IconEmotionNormal,
  IconEmotionUnhappy,
  RatioCard,
  RatioCardData,
} from "@brynlabs/fusion-ui";
import React from "react";

export const RatioCardExample = () => {
  const data: RatioCardData = {
    data: [
      {value: 125, name: "Positiv", icon: <IconEmotionHappy />},
      {
        value: 20,
        name: "Neutral",
        icon: <IconEmotionNormal />,
      },
      {value: 10, name: "Negativ", icon: <IconEmotionUnhappy />},
    ],
    showKPIs: true,
    name: "Sentiment",
    title: "Überwiegend Positiv",
    marker: {
      label: "Ziel",
      percent: 80,
    },
    colors: "spectrum",
  };
  return <RatioCard data={data}></RatioCard>;
};