2019-06-03 11:48:55 +00:00
|
|
|
import React from "react";
|
|
|
|
import PropTypes from "prop-types";
|
|
|
|
|
2019-06-04 13:53:08 +00:00
|
|
|
import { Oval } from "./types/oval";
|
|
|
|
import { DualRing } from "./types/dual-ring";
|
2019-06-05 07:40:38 +00:00
|
|
|
import { Rombs } from "./types/rombs";
|
2019-12-05 12:15:30 +00:00
|
|
|
import Text from "../text";
|
2019-06-03 11:48:55 +00:00
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
const Loader = (props) => {
|
2022-01-24 14:32:05 +00:00
|
|
|
const { type, color, size, label, className, style, id, theme } = props;
|
2019-06-03 11:48:55 +00:00
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
const svgRenderer = (type) => {
|
|
|
|
switch (type) {
|
|
|
|
case "oval":
|
|
|
|
return <Oval {...props} />;
|
|
|
|
case "dual-ring":
|
|
|
|
return <DualRing {...props} />;
|
|
|
|
case "rombs":
|
|
|
|
return <Rombs {...props} />;
|
|
|
|
default:
|
|
|
|
return (
|
|
|
|
<span style={{ ...style }}>
|
2022-01-27 13:54:58 +00:00
|
|
|
<Text color={color} fontSize={size}>
|
2020-10-16 13:16:01 +00:00
|
|
|
{label}
|
|
|
|
</Text>
|
|
|
|
</span>
|
|
|
|
);
|
|
|
|
}
|
2019-06-03 11:48:55 +00:00
|
|
|
};
|
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
return (
|
|
|
|
<div aria-busy="true" className={className} style={style} id={id}>
|
|
|
|
{svgRenderer(type)}
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
Loader.propTypes = {
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Font color */
|
2020-10-16 13:16:01 +00:00
|
|
|
color: PropTypes.string,
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Type loader */
|
2020-10-16 13:16:01 +00:00
|
|
|
type: PropTypes.oneOf(["base", "oval", "dual-ring", "rombs"]),
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Font size */
|
2020-10-16 13:16:01 +00:00
|
|
|
size: PropTypes.string,
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Text label */
|
2020-10-16 13:16:01 +00:00
|
|
|
label: PropTypes.string,
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Class name */
|
2020-10-16 13:16:01 +00:00
|
|
|
className: PropTypes.string,
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Accepts id */
|
2020-10-16 13:16:01 +00:00
|
|
|
id: PropTypes.string,
|
2021-03-08 20:18:45 +00:00
|
|
|
/** Accepts css style */
|
2020-10-16 13:16:01 +00:00
|
|
|
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
|
|
|
};
|
|
|
|
|
|
|
|
Loader.defaultProps = {
|
|
|
|
type: "base",
|
|
|
|
size: "40px",
|
|
|
|
label: "Loading content, please wait.",
|
|
|
|
};
|
2019-06-03 11:48:55 +00:00
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
export default Loader;
|