@difizen/ai-flow
Version:
Scalable, out-of-the-box, agent-oriented flow
45 lines • 1.5 kB
JavaScript
import React from 'react';
import { memo } from 'react';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
export var VariableMenuItem = /*#__PURE__*/memo(function (_ref) {
var title = _ref.title,
icon = _ref.icon,
extraElement = _ref.extraElement,
isSelected = _ref.isSelected,
queryString = _ref.queryString,
onClick = _ref.onClick,
onMouseEnter = _ref.onMouseEnter,
setRefElement = _ref.setRefElement;
var before = title;
var middle = '';
var after = '';
if (queryString) {
var regex = new RegExp(queryString, 'i');
var match = regex.exec(title);
if (match) {
before = title.substring(0, match.index);
middle = match[0];
after = title.substring(match.index + match[0].length);
}
}
return /*#__PURE__*/_jsxs("div", {
className: "\n flex items-center px-3 h-6 rounded-md cursor-pointer\n ".concat(isSelected && 'bg-blue-100', "\n "),
tabIndex: -1,
ref: setRefElement,
onMouseEnter: onMouseEnter,
onClick: onClick,
children: [/*#__PURE__*/_jsx("div", {
className: "mr-2",
children: icon
}), /*#__PURE__*/_jsxs("div", {
className: "grow text-[13px] text-gray-900 truncate",
title: title,
children: [before, /*#__PURE__*/_jsx("span", {
className: "text-[#2970FF]",
children: middle
}), after]
}), extraElement]
});
});
VariableMenuItem.displayName = 'VariableMenuItem';