@atlaskit/tag
Version:
A tag labels UI objects for quick recognition and navigation.
55 lines (53 loc) • 2.04 kB
JavaScript
/* use-remove-button-2.tsx generated by @compiled/babel-plugin v3.0.2 */
/**
* Shared utilities for TagNew and AvatarTag components.
* Note: CSS styles cannot be shared due to Compiled CSS static analysis requirements.
*/
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import { useCallback, useMemo } from 'react';
import RemoveButton from '../tag/internal/removable/remove-button';
// Props for the remove button hook
// Shared hook for remove button creation
// TODO: Fill in the hook {description}.
/**
* {description}.
*/
export function useRemoveButton({
isRemovable,
tagText,
removeButtonLabel,
testId,
handleRemoveRequest,
removingTag,
showingTag,
onKeyPress,
shape = 'default',
buttonHandlers
}) {
const handleFocus = useCallback(() => {
removingTag();
buttonHandlers === null || buttonHandlers === void 0 ? void 0 : buttonHandlers.onFocus();
}, [removingTag, buttonHandlers]);
const handleBlur = useCallback(() => {
showingTag();
buttonHandlers === null || buttonHandlers === void 0 ? void 0 : buttonHandlers.onBlur();
}, [showingTag, buttonHandlers]);
return useMemo(() => {
if (!isRemovable) {
return undefined;
}
return /*#__PURE__*/React.createElement(RemoveButton, {
"aria-label": `${removeButtonLabel || 'Remove'} ${tagText}`,
onClick: handleRemoveRequest,
onFocus: handleFocus,
onBlur: handleBlur,
onKeyPress: onKeyPress,
onMouseEnter: buttonHandlers === null || buttonHandlers === void 0 ? void 0 : buttonHandlers.onMouseEnter,
onMouseLeave: buttonHandlers === null || buttonHandlers === void 0 ? void 0 : buttonHandlers.onMouseLeave,
onMouseDown: buttonHandlers === null || buttonHandlers === void 0 ? void 0 : buttonHandlers.onMouseDown,
testId: testId ? `close-button-${testId}` : undefined,
shape: shape
});
}, [isRemovable, removeButtonLabel, tagText, handleRemoveRequest, handleFocus, handleBlur, onKeyPress, buttonHandlers, testId, shape]);
}