@razorpay/blade
Version:
The Design System that powers Razorpay
59 lines (56 loc) • 1.92 kB
JavaScript
import 'react';
import { chatInputSuggestionCycleInterval } from './chatInputTokens.js';
import '../Badge/index.js';
import '../Icons/index.js';
import '../Box/BaseBox/index.js';
import '../Typography/index.js';
import '../RollingText/index.js';
import { jsx, jsxs } from 'react/jsx-runtime';
import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
import { RollingText } from '../RollingText/RollingText.web.js';
import { Text } from '../Typography/Text/Text.js';
import { Badge } from '../Badge/Badge.js';
import ArrowRightIcon from '../Icons/ArrowRightIcon/ArrowRightIcon.js';
var ChatInputGhostSuggestion = function ChatInputGhostSuggestion(_ref) {
var suggestions = _ref.suggestions,
isVisible = _ref.isVisible,
onIndexChange = _ref.onIndexChange;
if (!isVisible || suggestions.length === 0) return null;
return /*#__PURE__*/jsx(BaseBox, {
display: "flex",
flexDirection: "row",
alignItems: "center",
gap: "spacing.3",
position: "absolute",
top: "spacing.0",
left: "spacing.0",
right: "spacing.0",
pointerEvents: "none",
children: /*#__PURE__*/jsx(RollingText, {
texts: suggestions,
onIndexChange: onIndexChange,
cycleDuration: chatInputSuggestionCycleInterval,
showShimmer: false,
children: function children(text) {
return /*#__PURE__*/jsxs(BaseBox, {
display: "flex",
alignItems: "center",
gap: "spacing.3",
children: [/*#__PURE__*/jsx(Text, {
color: "surface.text.gray.muted",
truncateAfterLines: 1,
size: "medium",
children: text
}), /*#__PURE__*/jsx(Badge, {
color: "neutral",
size: "small",
icon: ArrowRightIcon,
children: "Tab"
})]
});
}
})
});
};
export { ChatInputGhostSuggestion };
//# sourceMappingURL=ChatInputGhostSuggestion.js.map