seti-ramesesv1/dist/components/common/TabList.js

Reusable components and context for Next.js apps

import { jsx } from 'react/jsx-runtime';
import { useState } from 'react';
import styles from '../../styles/TabList.module.css.js';

const TabList = ({ items, activeItem, orientation = "horizontal", openItem }) => {
    const visibleItems = items.filter((item) => !item.hidden);
    const [localActive, setLocalActive] = useState(activeItem ?? visibleItems[0]?.id);
    const current = activeItem ?? localActive;
    const handleClick = (item) => {
        setLocalActive(item.id);
        openItem?.(item);
    };
    return (jsx("div", { className: `${styles.tabListContainer} ${orientation === "vertical" ? styles.vertical : styles.horizontal}`, children: visibleItems.map((item) => (jsx("button", { onClick: () => handleClick(item), className: `${styles.tabButton} ${current === item.id ? styles.activeTab : ""}`, children: item.label }, item.id))) }));
};

export { TabList as default };
//# sourceMappingURL=TabList.js.map