Components

'use client';

import React from 'react';

interface Step {
  title: string;
  completed: boolean;
  active: boolean;
}

const steps: Step[] = [
  { title: 'Step 1', completed: true, active: false },
  { title: 'Step 2', completed: true, active: false },
  { title: 'Step 3', completed: false, active: true },
  { title: 'Step 4', completed: false, a

'use client';

import { useState } from 'react';

interface NavItem {
  label: string;
  icon: string;
  active?: boolean;
  submenu?: NavItem[];
}

const navItems: NavItem[] = [
  { label: 'Dashboard', icon: 'dashboard', active: true },
  { label: 'Settings', icon: 'settings' },
  {
    label: 'Menu',
    icon: 'menu',
    submenu: [
      { label

'use client';

import React from 'react';

interface PaginationNavProps {
  currentPage: number;
  totalPages: number;
  onPageChange: (page: number) => void;
}

const PaginationNav: React.FC<PaginationNavProps> = ({ currentPage, totalPages, onPageChange }) => {
  const pages = [];
  for (let i = 1; i <= totalPages; i++) {
    pages.push(i);
  }

 

'use client';

import React, { useState } from 'react';

interface Tab {
  id: number;
  label: string;
}

const tabs: Tab[] = [
  { id: 1, label: 'Tab 1' },
  { id: 2, label: 'Tab 2' },
  { id: 3, label: 'Tab 3' },
  { id: 4, label: 'Tab 4' },
];

const TabsNav: React.FC = () => {
  const [activeTab, setActiveTab] = useState(tabs[0].id);

  const