import { Copy01, DownloadCloud02, Edit01, Trash01 } from "@properui/icons";
import { ButtonUtility } from "./button-utility";
import { CloseButton } from "./close-button";

export const Sizes = () => {
    return (
        <div className="flex flex-col gap-8">
            <div className="flex items-start gap-3">
                <ButtonUtility size="xs" color="secondary" tooltip="Copy" icon={Copy01} />
                <ButtonUtility size="xs" color="secondary" tooltip="Download" icon={DownloadCloud02} />
                <ButtonUtility size="xs" color="secondary" tooltip="Delete" icon={Trash01} />
                <ButtonUtility size="xs" color="secondary" tooltip="Edit" icon={Edit01} />
            </div>
            <div className="flex items-start gap-3">
                <ButtonUtility size="sm" color="secondary" tooltip="Copy" icon={Copy01} />
                <ButtonUtility size="sm" color="secondary" tooltip="Download" icon={DownloadCloud02} />
                <ButtonUtility size="sm" color="secondary" tooltip="Delete" icon={Trash01} />
                <ButtonUtility size="sm" color="secondary" tooltip="Edit" icon={Edit01} />
            </div>
        </div>
    );
};
Utility button components
