60 lines
1.5 KiB
JavaScript
60 lines
1.5 KiB
JavaScript
import React from "react";
|
|
import PropTypes from "prop-types";
|
|
import Text from "../text";
|
|
import { OvalLoader, StyledInner, StyledOuter } from "./styled-request-loader";
|
|
|
|
const RequestLoader = (props) => {
|
|
//console.log("RequestLoader render");
|
|
const { loaderColor, loaderSize, label, fontColor, fontSize } = props;
|
|
return (
|
|
<StyledOuter {...props}>
|
|
<StyledInner {...props}>
|
|
<OvalLoader
|
|
type="oval"
|
|
color={loaderColor}
|
|
size={loaderSize}
|
|
label={label}
|
|
/>
|
|
<Text className="text-style" color={fontColor} fontSize={fontSize}>
|
|
{label}
|
|
</Text>
|
|
</StyledInner>
|
|
</StyledOuter>
|
|
);
|
|
};
|
|
|
|
RequestLoader.propTypes = {
|
|
/** Visibility */
|
|
visible: PropTypes.bool,
|
|
/** CSS z-index */
|
|
zIndex: PropTypes.number,
|
|
/** Svg height and width value */
|
|
loaderSize: PropTypes.string,
|
|
/** Svg color */
|
|
loaderColor: PropTypes.string,
|
|
/** Svg aria-label and text label */
|
|
label: PropTypes.string,
|
|
/** Text label font size */
|
|
fontSize: PropTypes.string,
|
|
/** Text label font color */
|
|
fontColor: PropTypes.string,
|
|
/** Accepts class */
|
|
className: PropTypes.string,
|
|
/** Accepts id */
|
|
id: PropTypes.string,
|
|
/** Accepts css style */
|
|
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
|
};
|
|
|
|
RequestLoader.defaultProps = {
|
|
visible: false,
|
|
zIndex: 256,
|
|
loaderSize: "16px",
|
|
loaderColor: "#999",
|
|
label: "Loading... Please wait...",
|
|
fontSize: "12px",
|
|
fontColor: "#999",
|
|
};
|
|
|
|
export default RequestLoader;
|