myprojectpackageprav/dist/esm/utils/controls/people-picker.js

My package in npm

import React from 'react';
import { useState } from 'react';
import Autocomplete from 'react-autocomplete';
var PeoplePicker = function (inputProps) {
    var _a = useState(''), val = _a[0], setVal = _a[1];
    var NO_MATCHES_FOUND = 'No Results';
    var users = [{
            id: 0,
            title: 'Filing guidelines',
            link: '/'
        }, {
            id: 1,
            title: 'Documents Needed',
            link: '/'
        }, {
            id: 2,
            title: 'VMS',
            link: '/'
        }, {
            id: 3,
            title: 'Air University',
            link: '/'
        }, {
            id: 4,
            title: 'AF Reserve',
            link: '/'
        }, {
            id: 5,
            title: 'AF Civilian Careers',
            link: '/'
        }, {
            id: 6,
            title: 'Leadership',
            link: '/'
        }, {
            id: 7,
            title: 'Maxwell Driving Tour (No Maps)',
            link: '/'
        }, {
            id: 8,
            title: 'DTMO',
            link: '/'
        },];
    return (React.createElement(React.Fragment, null,
        React.createElement("div", { className: "peoplepicker p-relative" },
            React.createElement(Autocomplete, { "data-class": 'test', items: users, shouldItemRender: function (item, value) { var _a; return (((_a = item.title) === null || _a === void 0 ? void 0 : _a.toLowerCase().indexOf(value === null || value === void 0 ? void 0 : value.toLowerCase())) > -1); }, getItemValue: function (item) { return item.title; }, renderItem: function (item, isHighlighted) {
                    return React.createElement("div", { style: {
                            background: isHighlighted
                                ? '#1E90FF'
                                : 'white',
                            color: isHighlighted
                                ? '#FFF'
                                : ''
                        }, key: item.id }, item.title);
                }, renderMenu: function (items, value) { return (React.createElement("div", { className: 'peoplepicker-lists' }, (items === null || items === void 0 ? void 0 : items.length) === 0 ? "".concat(NO_MATCHES_FOUND) : items)); }, value: val, onChange: function (e) { return setVal(e.target.value); }, onSelect: function (e) { return setVal(e); }, inputProps: {
                    placeholder: 'Enter a name or email address...',
                    "aria-label": "Customer Duty Email",
                    maxLength: 40,
                    className: 'form-sm'
                } }))));
};
export default PeoplePicker;
//# sourceMappingURL=people-picker.js.map