@parkassist/pa-ui-library
Version:
INX Platform elements
49 lines • 1.24 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import styled from "styled-components";
import { Column, Row } from "../Layout/Flex";
const TextWrapper = styled(Column)`
height: 32px;
line-height: 32px;
padding-right: 8px;
padding-left: 8px;
font-size: 14px;
font-family: 'Poppins',sans-serif;
`;
const ImageWrapper = styled(Column)`
height: 32px;
width: 32px;
align-items: center;
justify-content: center;
padding-right: 8px;
padding-left: 8px;
font-size: 14px;
`;
const Wrapper = styled(Row)`
align-items: center;
`;
export const LabelWithIcon = props => {
const {
text = "",
leftIcon = null,
rightIcon = null,
leftIconStyle = {},
textStyle = {},
rightIconStyle = {},
style = {}
} = props;
return _jsxs(Wrapper, {
style: Object.assign({}, style),
children: [leftIcon && _jsx(ImageWrapper, {
style: Object.assign({}, leftIconStyle),
children: leftIcon
}), _jsx(TextWrapper, {
"data-testid": `${text}-label`,
style: Object.assign({}, textStyle),
children: text
}), rightIcon && _jsx(ImageWrapper, {
style: Object.assign({}, rightIconStyle),
children: rightIcon
})]
});
};
export default LabelWithIcon;