Glass icons

import { Component } from "@/components/ui/glass-icons"; // Correct import path for the new Component
import { FiFileText, FiBook, FiHeart, FiCloud, FiEdit, FiBarChart2 } from 'react-icons/fi'; // Import icons for the demo items

const DemoOne = () => {
  // Define the items array as provided in the original demo
  const items = [
    { icon: <FiFileText />, color: 'blue', label: 'Files' },
    { icon: <FiBook />, color: 'purple', label: 'Books' },
    { icon: <FiHeart />, color: 'red', label: 'Health' },
    { icon: <FiCloud />, color: 'indigo', label: 'Weather' },
    { icon: <FiEdit />, color: 'orange', label: 'Notes' },
    { icon: <FiBarChart2 />, color: 'green', label: 'Stats' },
  ];

  return (
    <div className="flex w-full h-screen justify-center items-center">
      {/* The outer div maintains the full screen centered layout */}
      <div style={{ height: '600px', position: 'relative' }}>
        {/* Render the GlassIcons component with the defined items and class name */}
        <Component items={items} className="custom-class" />
      </div>
    </div>
  );
};

export { DemoOne };