lucid-ui/dist/esm/components/Badge/Badge.js

A UI component library from Xandr.

import React from 'react';
import PropTypes from 'prop-types';
import { lucidClassNames } from '../../util/style-helpers';
const cx = lucidClassNames.bind('&-Badge');
const badgePropTypes = {
    /** class names that are appended to the defaults */
    className: PropTypes.string,
    /** any valid React children */
    children: PropTypes.node,
    /** Style variations for the `Badge` */
    kind: PropTypes.oneOf([
        'default',
        'primary',
        'success',
        'danger',
        'warning',
        'info',
        'dark',
    ]),
    /** Fill style variations for the `Badge` */
    type: PropTypes.oneOf(['filled', 'stroke']),
};
export var Kind;
(function (Kind) {
    Kind["default"] = "default";
    Kind["primary"] = "primary";
    Kind["success"] = "success";
    Kind["danger"] = "danger";
    Kind["warning"] = "warning";
    Kind["info"] = "info";
    Kind["dark"] = "dark";
})(Kind || (Kind = {}));
export var Type;
(function (Type) {
    Type["filled"] = "filled";
    Type["stroke"] = "stroke";
})(Type || (Type = {}));
const defaultProps = {
    kind: Kind.default,
    type: Type.filled,
};
export const Badge = (props) => {
    const { className, kind, type, children, ...passThroughs } = props;
    return (React.createElement("span", { className: cx('&', `&-${kind}`, `&-${type}`, className), ...passThroughs }, children));
};
Badge.defaultProps = defaultProps;
Badge.displayName = 'Badge';
Badge.peek = {
    description: `A quick utility component to create a badge around an element.`,
    categories: ['visual design', 'icons'],
};
Badge.propTypes = badgePropTypes;
export default Badge;
//# sourceMappingURL=Badge.js.map