ar-design/dist/components/form/button-group/index.js

AR Design is a (react | nextjs) ui library.

"use client";
import React, { useEffect, useState } from "react";
import "../../../assets/css/components/form/button-group/styles.css";
import Button from "../button";
import Alert from "../../feedback/alert";
const ButtonGroup = ({ children }) => {
    // states
    const [error, setError] = useState(null);
    useEffect(() => {
        try {
            // Çocuk elemanların sadece `Button` bileşenleri olduğundan emin olun
            React.Children.forEach(children, (child) => {
                if (!React.isValidElement(child) || child.type !== Button) {
                    throw new Error("ButtonGroup can only have Button elements as children.");
                }
            });
            // Hata yoksa, error'u temizle
            setError(null);
        }
        catch (err) {
            if (err instanceof Error) {
                // Hata varsa error state'e yaz
                setError(err.message);
                console.error(err.message);
            }
        }
    }, [children]); // children değişirse kontrolü tekrar yap
    return React.createElement("div", { className: "ar-button-group" }, error ? React.createElement(Alert, { status: "danger", message: error }) : children);
};
ButtonGroup.displayName = "ButtonGroup";
export default ButtonGroup;