@re-flex/ui/SystemIcons/index.js

Re-Flex ui library

import React from "react";
const icons = {
    unChecked: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z",
    checked: "M19 3H5a2 2 0 00-2 2v14a2 2 0 002 2h14a2 2 0 002-2V5a2 2 0 00-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z",
    indeterminate: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z",
    chevronRight: "M6.23 20.23L8 22l10-10L8 2 6.23 3.77 14.46 12z",
    arrowRight: "M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z",
    calendarEmpty: "M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z",
    calendaerChecked: "M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zm9.954 3H2.545c-.3 0-.545.224-.545.5v1c0 .276.244.5.545.5h10.91c.3 0 .545-.224.545-.5v-1c0-.276-.244-.5-.546-.5zm-2.6 5.854a.5.5 0 0 0-.708-.708L7.5 10.793 6.354 9.646a.5.5 0 1 0-.708.708l1.5 1.5a.5.5 0 0 0 .708 0l3-3z",
    plus: "M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z",
    minus: "M5 11h14v2H5z",
    person: "M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z",
    check: "m10 15.586-3.293-3.293-1.414 1.414L10 18.414l9.707-9.707-1.414-1.414z",
    doubleCheck: "M8.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L2.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093L8.95 4.992a.252.252 0 0 1 .02-.022zm-.92 5.14.92.92a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 1 0-1.091-1.028L9.477 9.417l-.485-.486-.943 1.179z",
    lastPage: "M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6-1.41 1.41zM16 6h2v12h-2V6z",
    error: "M11 15h2v2h-2zm0-8h2v6h-2zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z",
    warning: "M12 5.99L19.53 19H4.47L12 5.99M12 2L1 21h22L12 2zm1 14h-2v2h2v-2zm0-6h-2v4h2v-4z",
    information: "M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z",
    success: "M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z",
};
const generateIcon = ({ path, strokeWidth = 0, rotate = 0, }) => (React.createElement("svg", { stroke: "currentColor", fill: "currentColor", strokeWidth: strokeWidth, viewBox: "0 0 24 24", height: "1em", width: "1em", xmlns: "http://www.w3.org/2000/svg", style: {
        transform: `rotate(${rotate}deg)`,
        transformOrigin: "center center",
    } },
    React.createElement("path", { d: path })));
export const SysIconsPerson = () => generateIcon({ path: icons.person });
export const SysIconsCalendarEmpty = () => generateIcon({ path: icons.calendarEmpty });
export const SysIconsCalendarChecked = () => generateIcon({ path: icons.calendaerChecked });
export const SysIconsPlus = () => generateIcon({ path: icons.plus });
export const SysIconsCheck = () => generateIcon({ path: icons.check });
export const SysIconsDoubleCheck = () => generateIcon({ path: icons.doubleCheck });
export const SysIconsClose = () => generateIcon({ path: icons.plus, rotate: 45 });
export const SysIconsUnChecked = () => generateIcon({ path: icons.unChecked });
export const SysIconsChecked = () => generateIcon({ path: icons.checked });
export const SysIconsIndeterminate = () => generateIcon({ path: icons.indeterminate });
export const SysIconsFirstPage = () => generateIcon({ path: icons.lastPage, rotate: 180 });
export const SysIconsLastPage = () => generateIcon({ path: icons.lastPage });
export const SysIconsArrowRight = () => generateIcon({ path: icons.arrowRight });
export const SysIconsArrowLeft = () => generateIcon({ path: icons.arrowRight, rotate: 180 });
export const SysIconsArrowUp = () => generateIcon({ path: icons.arrowRight, rotate: 270 });
export const SysIconsArrowDown = () => generateIcon({ path: icons.arrowRight, rotate: 90 });
export const SysIconsChevronRight = () => generateIcon({ path: icons.chevronRight });
export const SysIconsChevronLeft = () => generateIcon({ path: icons.chevronRight, rotate: 180 });
export const SysIconsChevronUp = () => generateIcon({ path: icons.chevronRight, rotate: 270 });
export const SysIconsChevronDown = () => generateIcon({ path: icons.chevronRight, rotate: 90 });
export const SysIconsError = () => generateIcon({ path: icons.error });
export const SysIconsWarning = () => generateIcon({ path: icons.warning });
export const SysIconsInformation = () => generateIcon({ path: icons.information });
export const SysIconsSuccess = () => generateIcon({ path: icons.success });