@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
25 lines • 2.06 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 { InternalButton } from '../../button/internal';
import Icon from '../../icon/internal';
import { useAppLayoutInternals } from './context';
import styles from './styles.css.js';
function TriggerButton({ ariaLabel, className, iconName, iconSvg, ariaExpanded, ariaControls, onClick, testId, disabled = false, badge, selected = false, highContrastHeader, }, ref) {
const { isMobile } = useAppLayoutInternals();
return (React.createElement("div", { className: clsx(styles['trigger-wrapper'], !highContrastHeader && styles['remove-high-contrast-header']) }, isMobile ? (React.createElement(InternalButton, { ariaExpanded: ariaExpanded, ariaLabel: ariaLabel, ariaControls: ariaControls, className: className, disabled: disabled, ref: ref, formAction: "none", iconName: iconName, iconSvg: iconSvg, badge: badge, onClick: onClick, variant: "icon", nativeButtonAttributes: {
'aria-haspopup': true,
...(testId && {
'data-testid': testId,
}),
} })) : (React.createElement(React.Fragment, null,
React.createElement("button", { "aria-expanded": ariaExpanded, "aria-controls": ariaControls, "aria-haspopup": true, "aria-label": ariaLabel, "aria-disabled": disabled, disabled: disabled, className: clsx(styles.trigger, styles['trigger-button-styles'], {
[styles.selected]: selected,
[styles.badge]: badge,
}, className), onClick: onClick, ref: ref, type: "button", "data-testid": testId },
React.createElement("span", { className: clsx(badge && clsx(styles['trigger-badge-wrapper'], styles['trigger-button-styles'])) }, (iconName || iconSvg) && React.createElement(Icon, { name: iconName, svg: iconSvg }))),
badge && React.createElement("div", { className: styles.dot })))));
}
export default React.forwardRef(TriggerButton);
//# sourceMappingURL=trigger-button.js.map