UNPKG

@awsui/components-react

Version:

AWS UI is a collection of [React](https://reactjs.org/) components that help create intuitive, responsive, and accessible user experiences for web applications. It is developed by Amazon Web Services (AWS). This work is available under the terms of the [A

15 lines (14 loc) 1.23 kB
import { __assign } from "tslib"; import React from 'react'; import clsx from 'clsx'; import Icon from '../icon'; import styles from './styles.css.js'; import useFocusVisible from '../internal/hooks/focus-visible'; export var Segment = React.forwardRef(function (_a, ref) { var _b, _c; var disabled = _a.disabled, text = _a.text, iconName = _a.iconName, iconAlt = _a.iconAlt, iconUrl = _a.iconUrl, isActive = _a.isActive, onClick = _a.onClick, onKeyDown = _a.onKeyDown, tabIndex = _a.tabIndex; var focusVisible = useFocusVisible(); return (React.createElement("button", __assign({ className: clsx(styles.segment, (_b = {}, _b[styles.disabled] = !!disabled, _b), (_c = {}, _c[styles.selected] = isActive, _c)) }, focusVisible, { ref: ref, onClick: onClick, onKeyDown: onKeyDown, disabled: disabled, type: "button", tabIndex: tabIndex, "aria-pressed": isActive ? 'true' : 'false', "aria-label": !text ? iconAlt : undefined }), (iconName || iconUrl) && (React.createElement(Icon, { className: clsx(styles.icon, text ? styles['with-text'] : styles['with-no-text']), name: iconName, url: iconUrl, alt: iconAlt, variant: disabled ? 'disabled' : 'normal' })), React.createElement("span", null, text))); });