@carbon/react
Version:
React components for the Carbon Design System
72 lines (68 loc) • 2.27 kB
JavaScript
/**
* Copyright IBM Corp. 2016, 2023
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
import PropTypes from 'prop-types';
import React from 'react';
import cx from 'classnames';
import { usePrefix } from '../../internal/usePrefix.js';
import { ErrorFilled, WarningAltInvertedFilled, WarningAltFilled, UndefinedFilled, CheckmarkFilled, CheckmarkOutline, InProgress, Incomplete, CircleDash, PendingFilled, UnknownFilled, WarningSquareFilled } from '@carbon/icons-react';
const IconIndicatorKinds = ['failed', 'caution-major', 'caution-minor', 'undefined', 'succeeded', 'normal', 'in-progress', 'incomplete', 'not-started', 'pending', 'unknown', 'informative'];
const iconTypes = {
failed: ErrorFilled,
['caution-major']: WarningAltInvertedFilled,
['caution-minor']: WarningAltFilled,
undefined: UndefinedFilled,
succeeded: CheckmarkFilled,
normal: CheckmarkOutline,
['in-progress']: InProgress,
incomplete: Incomplete,
['not-started']: CircleDash,
pending: PendingFilled,
unknown: UnknownFilled,
informative: WarningSquareFilled
};
const IconIndicator = /*#__PURE__*/React.forwardRef(function IconIndicatorContent({
className: customClassName,
kind,
label,
size = 16,
...rest
}, ref) {
const prefix = usePrefix();
const classNames = cx(`${prefix}--icon-indicator`, customClassName, {
[`${prefix}--icon-indicator--20`]: size == 20
});
const IconForKind = iconTypes[kind];
if (!IconForKind) {
return null;
}
return /*#__PURE__*/React.createElement("div", {
className: classNames,
ref: ref
}, /*#__PURE__*/React.createElement(IconForKind, {
size: size,
className: `${prefix}--icon-indicator--${kind}`
}), label);
});
IconIndicator.propTypes = {
/**
* Specify an optional className to add.
*/
className: PropTypes.string,
/**
* Specify the kind of the Icon Indicator
*/
kind: PropTypes.oneOf(IconIndicatorKinds).isRequired,
/**
* Label next to the icon.
*/
label: PropTypes.string.isRequired,
/**
* Specify the size of the Icon Indicator. Defaults to 16.
*/
size: PropTypes.oneOf([16, 20])
};
export { IconIndicator, IconIndicatorKinds, IconIndicator as default };