phx-react
Version:
PHX REACT
13 lines • 1.99 kB
JavaScript
import React from 'react';
import { classNames } from '../types';
import PHXTooltip from '../ToolTip/ToolTip';
export function PHXDescriptionListInTooltip({ items, trigger, type = 'default', tooltipClassName, singleColumn = false, }) {
return (React.createElement(PHXTooltip, { content: React.createElement("div", { className: classNames('min-w-[200px] whitespace-normal bg-white px-2 py-2', type === 'border' && 'rounded-lg border border-gray-200 shadow-sm', tooltipClassName) }, singleColumn ? (React.createElement("div", { className: 'flex flex-col gap-y-3' }, items.map((item, index) => (React.createElement("div", { key: index, className: classNames('flex flex-col gap-y-1', item.className) },
item.title && (React.createElement("dt", { className: classNames('text-[13px] leading-5 text-gray-600', item.titleClassName) }, item.title)),
item.description && (React.createElement("dd", { className: classNames('whitespace-normal break-words text-[13px] font-medium leading-5 text-gray-800', item.descriptionClassName) }, item.description))))))) : (React.createElement("div", { className: 'grid grid-cols-[max-content_1fr] gap-x-4 gap-y-1' }, items.map((item, index) => (React.createElement(React.Fragment, null,
React.createElement("div", { key: index, className: classNames('contents', item.className) },
React.createElement("dt", { className: classNames('whitespace-nowrap text-[13px] leading-5 text-gray-600', item.titleClassName) }, item.title),
React.createElement("dd", { className: classNames('whitespace-normal break-words text-[13px] font-medium leading-5 text-gray-800', item.descriptionClassName) }, item.description || '')),
(item === null || item === void 0 ? void 0 : item.isShowDivider) && React.createElement("div", { className: 'col-span-2 my-1 border-b border-gray-200' }))))))), contentClassName: 'max-w-[24rem]' }, trigger));
}
//# sourceMappingURL=DescriptionListInTooltip.js.map