@carbon/react
Version:
React components for the Carbon Design System
88 lines (86 loc) • 3.14 kB
JavaScript
/**
* Copyright IBM Corp. 2016, 2026
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_usePrefix = require("../../internal/usePrefix.js");
const require_keys = require("../../internal/keyboard/keys.js");
const require_match = require("../../internal/keyboard/match.js");
const require_AriaPropTypes = require("../../prop-types/AriaPropTypes.js");
const require_Link = require("./Link.js");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
let react = require("react");
react = require_runtime.__toESM(react);
let prop_types = require("prop-types");
prop_types = require_runtime.__toESM(prop_types);
let react_jsx_runtime = require("react/jsx-runtime");
//#region src/components/UIShell/SwitcherItem.tsx
/**
* Copyright IBM Corp. 2023, 2025
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
const SwitcherItem = (0, react.forwardRef)((props, forwardRef) => {
const { "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, className: customClassName, children, isSelected, expanded, tabIndex = expanded ? 0 : -1, index, handleSwitcherItemFocus, onKeyDown = () => {}, href, target, rel, ...rest } = props;
const prefix = require_usePrefix.usePrefix();
const classNames = (0, classnames.default)(`${prefix}--switcher__item`, { [customClassName || ""]: !!customClassName });
const accessibilityLabel = {
"aria-label": ariaLabel,
"aria-labelledby": ariaLabelledBy
};
const linkClassName = (0, classnames.default)(`${prefix}--switcher__item-link`, { [`${prefix}--switcher__item-link--selected`]: isSelected });
function setTabFocus(evt) {
if (require_match.match(evt, require_keys.ArrowDown)) {
evt.preventDefault();
handleSwitcherItemFocus?.({
currentIndex: index || -1,
direction: 1
});
}
if (require_match.match(evt, require_keys.ArrowUp)) {
evt.preventDefault();
handleSwitcherItemFocus?.({
currentIndex: index || -1,
direction: -1
});
}
}
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
className: classNames,
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Link.default, {
onKeyDown: (evt) => {
setTabFocus(evt);
onKeyDown(evt);
},
href,
target,
rel,
ref: forwardRef,
...rest,
className: linkClassName,
tabIndex,
...accessibilityLabel,
children
})
});
});
SwitcherItem.displayName = "SwitcherItem";
SwitcherItem.propTypes = {
...require_AriaPropTypes.AriaLabelPropType,
children: prop_types.default.node.isRequired,
className: prop_types.default.string,
handleSwitcherItemFocus: prop_types.default.func,
href: prop_types.default.string,
index: prop_types.default.number,
onClick: prop_types.default.func,
onKeyDown: prop_types.default.func,
tabIndex: prop_types.default.number,
target: prop_types.default.string,
rel: prop_types.default.string
};
//#endregion
exports.default = SwitcherItem;