import React from 'react';
import { classNames } from '../../types';
import PHXToggle from '../../PHXToggle/Toggle';
function List({ filteredItems }) {
    return (React.createElement(React.Fragment, null, filteredItems === null || filteredItems === void 0 ? void 0 : filteredItems.map((item, index) => (React.createElement("div", { key: index, "aria-hidden": true, className: classNames(index < filteredItems.length - 1 && 'border-b') },
        React.createElement("label", { className: 'hover:cursor-pointer' },
            React.createElement("div", { className: 'flex gap-x-1.5 items-center p-3' },
                React.createElement("div", { className: 'flex-1 flex gap-x-1.5 items-center' },
                    (item === null || item === void 0 ? void 0 : item.avatar) && (React.createElement("img", { alt: 'avatar', className: `h-10 w-10 rounded-full mr-2 ${item === null || item === void 0 ? void 0 : item.avatarClassname}`, src: item.avatar })),
                    React.createElement("div", { className: 'flex flex-col gap-y-0.5' },
                        (item === null || item === void 0 ? void 0 : item.name) && React.createElement("p", { className: 'text-xs font-medium text-gray-900' }, item.name),
                        (item === null || item === void 0 ? void 0 : item.location) && React.createElement("p", { className: `text-xs  font-normal text-gray-600` }, item.location))),
                React.createElement(PHXToggle, { active: item.toggle.active, onChange: (active) => item.toggle.onChange(active) }))),
        React.createElement("div", { className: `space-y-3` }, item.subContent))))));
}
export default List;
//# sourceMappingURL=list.js.map