web-humas-fe/components/icons/sidebar-icon.tsx

import * as React from "react";
import { IconSvgProps } from "@/types/globals";

export const MenuBurgerIcon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 24 24"
        width={size || width}
        {...props}
    >
        <path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2.5" d="M3 6h18M3 12h18M3 18h18" />
    </svg>
);

export const DashboardIcon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 24 24"
        width={size || width}
        {...props}
    >
        <path fill="currentColor" d="M13 9V3h8v6zM3 13V3h8v10zm10 8V11h8v10zM3 21v-6h8v6z" />
    </svg>
);

export const HomeIcon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 24 24"
        width={size || width}
        {...props}
    >
        <g fill="none" stroke="currentColor" strokeWidth="1.5">
            <path d="M2 12.204c0-2.289 0-3.433.52-4.381c.518-.949 1.467-1.537 3.364-2.715l2-1.241C9.889 2.622 10.892 2 12 2c1.108 0 2.11.622 4.116 1.867l2 1.241c1.897 1.178 2.846 1.766 3.365 2.715c.519.948.519 2.092.519 4.38v1.522c0 3.9 0 5.851-1.172 7.063C19.657 22 17.771 22 14 22h-4c-3.771 0-5.657 0-6.828-1.212C2 19.576 2 17.626 2 13.725z" />
            <path strokeLinecap="round" d="M12 15v3" />
        </g>
    </svg>
);

export const Submenu1Icon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 48 48"
        width={size || width}
        {...props}
    >
        <defs>
            <mask id="ipTData0">
                <g fill="none" stroke="#fff" strokeLinecap="round" strokeLinejoin="round" strokeWidth="4">
                    <path d="M44 11v27c0 3.314-8.954 6-20 6S4 41.314 4 38V11" /><path d="M44 29c0 3.314-8.954 6-20 6S4 32.314 4 29m40-9c0 3.314-8.954 6-20 6S4 23.314 4 20" />
                    <ellipse cx="24" cy="10" fill="#555" rx="20" ry="6" />
                </g>
            </mask>
        </defs>
        <path fill="currentColor" d="M0 0h48v48H0z" mask="url(#ipTData0)" />
    </svg>
);

export const Submenu2Icon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 256 256"
        width={size || width}
        {...props}
    >
        <path fill="currentColor" d="M230.93 220a8 8 0 0 1-6.93 4H32a8 8 0 0 1-6.92-12c15.23-26.33 38.7-45.21 66.09-54.16a72 72 0 1 1 73.66 0c27.39 8.95 50.86 27.83 66.09 54.16a8 8 0 0 1 .01 8" />
    </svg>
);

export const InfoCircleIcon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 1024 1024"
        width={size || width}
        {...props}
    >
        <path fill="currentColor" d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448s448-200.6 448-448S759.4 64 512 64m0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372s372 166.6 372 372s-166.6 372-372 372" />
        <path fill="currentColor" d="M464 336a48 48 0 1 0 96 0a48 48 0 1 0-96 0m72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8" />
    </svg>

);


export const MinusCircleIcon = ({
    size,
    height = 24,
    width = 24,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 16 16"
        width={size || width}
        {...props}
    >
        <g fill="currentColor">
            <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14m0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16" />
            <path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8" />
        </g>
    </svg>


);

export const TableIcon = ({
    size,
    height = 24,
    width = 22,
    fill = "currentColor",
    ...props
}: IconSvgProps) => (
    <svg
        fill="none"
        height={size || height}
        viewBox="0 0 24 22"
        width={size || width}
        stroke-width="1.5"
        stroke="currentColor"
        {...props}
    >
        <path stroke-linecap="round" stroke-linejoin="round" d="M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 0 1-1.125-1.125M3.375 19.5h7.5c.621 0 1.125-.504 1.125-1.125m-9.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-7.5A1.125 1.125 0 0 1 12 18.375m9.75-12.75c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125m19.5 0v1.5c0 .621-.504 1.125-1.125 1.125M2.25 5.625v1.5c0 .621.504 1.125 1.125 1.125m0 0h17.25m-17.25 0h7.5c.621 0 1.125.504 1.125 1.125M3.375 8.25c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m17.25-3.75h-7.5c-.621 0-1.125.504-1.125 1.125m8.625-1.125c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125M12 10.875v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 10.875c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125M13.125 12h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125M20.625 12c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5M12 14.625v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 14.625c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125m0 1.5v-1.5m0 0c0-.621.504-1.125 1.125-1.125m0 0h7.5" />
    </svg>
);