@awsui/components-react
Version:
On July 19th, 2022, we launched [Cloudscape Design System](https://cloudscape.design). Cloudscape is an evolution of AWS-UI. It consists of user interface guidelines, front-end components, design resources, and development tools for building intuitive, en
38 lines • 2.69 kB
JavaScript
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
// SPDX-License-Identifier: Apache-2.0
import React from 'react';
import clsx from 'clsx';
import InternalIcon from '../icon/internal';
import { getBaseProps } from '../internal/base-component';
/**
* @awsuiSystem core
*/
import WithNativeAttributes from '../internal/utils/with-native-attributes';
import InternalSpinner from '../spinner/internal';
import styles from './styles.css.js';
const typeToIcon = size => ({
error: React.createElement(InternalIcon, { name: "status-negative", size: size }),
warning: React.createElement(InternalIcon, { name: "status-warning", size: size }),
success: React.createElement(InternalIcon, { name: "status-positive", size: size }),
info: React.createElement(InternalIcon, { name: "status-info", size: size }),
stopped: React.createElement(InternalIcon, { name: "status-stopped", size: size }),
pending: React.createElement(InternalIcon, { name: "status-pending", size: size }),
'in-progress': React.createElement(InternalIcon, { name: "status-in-progress", size: size }),
loading: React.createElement(InternalSpinner, null),
'not-started': React.createElement(InternalIcon, { name: "status-not-started", size: size }),
});
export function InternalStatusIcon({ type, iconAriaLabel, animate, display, size = 'normal', }) {
return (React.createElement("span", { className: clsx(styles.icon, animate && styles['icon-shake']), "aria-label": iconAriaLabel, role: iconAriaLabel ? 'img' : undefined },
typeToIcon(size)[type],
display === 'inline' && React.createElement(React.Fragment, null, "\u00A0")));
}
export default function StatusIndicator({ type, children, iconAriaLabel, colorOverride, wrapText = true, nativeAttributes, __animate = false, __internalRootRef, __size = 'normal', __display = 'inline-block', ...rest }) {
const baseProps = getBaseProps(rest);
return (React.createElement(WithNativeAttributes, { ...baseProps, tag: "span", componentName: "StatusIndicator", nativeAttributes: nativeAttributes, className: clsx(styles.root, styles[`status-${type}`], {
[styles[`color-override-${colorOverride}`]]: colorOverride,
}, baseProps.className), ref: __internalRootRef },
React.createElement("span", { className: clsx(styles.container, styles[`display-${__display}`], wrapText === false && styles['overflow-ellipsis'], __animate && styles['container-fade-in']) },
React.createElement(InternalStatusIcon, { type: type, iconAriaLabel: iconAriaLabel, animate: __animate, display: __display, size: __size }),
children)));
}
//# sourceMappingURL=internal.js.map