← back to Rentv 2026
public/desk-assets/role-icons.js
89 lines
/* RENTV — CRE user/role icon set (line style, 24px, stroke=currentColor).
One vocabulary for every "type of user" across the Growth console, Summit Leads and the Desk.
Usage: el.innerHTML = ROLE_ICONS.brokers; // or ROLE_ICONS.get('Brokers')
All icons: viewBox 0 0 24 24, fill:none, stroke:currentColor — theme via CSS color. */
(function (root) {
var A = 'viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"';
function svg(inner) { return '<svg ' + A + '>' + inner + '</svg>'; }
var ICONS = {
// Owners / Investors — building held + rising value
owners: svg('<path d="M4 21V5.6a1 1 0 0 1 .6-.9l6-2.6a1 1 0 0 1 1.4.9V21"/><path d="M12 21V9.2l6 2.6a1 1 0 0 1 .6.9V21"/><path d="M3 21h18"/><rect x="6" y="8" width="1.8" height="1.8"/><rect x="6" y="12.5" width="1.8" height="1.8"/><path d="M15 15.5l1.8-1.8 1.2 1.2"/>'),
// Developers — tower crane (new construction)
developers: svg('<path d="M11 21V4"/><path d="M11 4h9"/><path d="M11 4L4 8"/><path d="M20 4v3"/><path d="M20 7v0"/><path d="M20 7a1.6 1.6 0 1 0 0 3.2"/><path d="M14 4v2.2"/><path d="M17 4v2.2"/><path d="M7 21h8"/>'),
// Brokers — handshake (the deal)
brokers: svg('<path d="M8 12.5l2.4-2.3a1.4 1.4 0 0 1 1.9 0l2.5 2.4"/><path d="M3 8l3-1 5 3.5"/><path d="M21 8l-3-1-3 2.2"/><path d="M11 14l1.6 1.6a1.3 1.3 0 0 0 1.9-1.8"/><path d="M13.5 16.3l.9.9a1.2 1.2 0 0 0 1.8-1.6l-2.9-2.9"/><path d="M3 8v6l2 1M21 8v6l-2 1"/>'),
// Lenders & Capital Sources — bank / landmark (capital)
lenders: svg('<path d="M3 9.5 12 4l9 5.5"/><path d="M4 9.8h16"/><path d="M5.5 10v8M9 10v8M15 10v8M18.5 10v8"/><path d="M3.5 21h17"/><path d="M4.5 18h15"/>'),
// Vendors / Service Providers — toolbox / service
vendors: svg('<rect x="3" y="8.5" width="18" height="10.5" rx="1.5"/><path d="M3 12.5h18"/><path d="M9 8.5V7a1.5 1.5 0 0 1 1.5-1.5h3A1.5 1.5 0 0 1 15 7v1.5"/><path d="M10.5 12.5v2h3v-2"/>'),
// Legal / Attorneys — scales of justice
legal: svg('<path d="M12 3v18"/><path d="M7 21h10"/><path d="M5 6h14"/><path d="M8 6 5 12a2.6 2.6 0 0 0 5 0Z"/><path d="M16 6l3 6a2.6 2.6 0 0 1-5 0Z"/><path d="M12 3v0"/>'),
// Construction / Contractors / Builders — hard hat
construction: svg('<path d="M3 17a9 9 0 0 1 18 0"/><path d="M2.5 17h19"/><path d="M9 8.2V5.6A1.6 1.6 0 0 1 10.6 4h2.8A1.6 1.6 0 0 1 15 5.6v2.6"/><path d="M12 8V4.5"/><path d="M6.5 12l1 -2.5M17.5 12l-1 -2.5"/>'),
// Title — deed / certificate with seal ribbon
title: svg('<path d="M6 3h8l4 4v9a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Z"/><path d="M14 3v4h4"/><path d="M7 9h6M7 12h4"/><circle cx="15" cy="16" r="2.4"/><path d="M13.4 17.8 12.6 21l2.4-1.2L17.4 21l-.8-3.2"/>'),
// Escrow — funds held in trust (vault / lock)
escrow: svg('<rect x="3.5" y="9.5" width="17" height="11" rx="2"/><path d="M8 9.5V7a4 4 0 0 1 8 0v2.5"/><circle cx="12" cy="14.5" r="1.6"/><path d="M12 16.1V18"/>'),
// Appraisers — value magnified on a home
appraisers: svg('<path d="M3 11 11 4l6 5.2"/><path d="M5 10v6.5A1.5 1.5 0 0 0 6.5 18H10"/><circle cx="16" cy="15" r="3.2"/><path d="M18.3 17.3 21 20"/>'),
// Property Managers — building + key
property_mgr: svg('<path d="M4 21V6a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v15"/><path d="M3 21h11"/><rect x="6" y="8" width="1.6" height="1.6"/><rect x="10" y="8" width="1.6" height="1.6"/><rect x="6" y="12" width="1.6" height="1.6"/><circle cx="17.5" cy="13.5" r="2.2"/><path d="M17.5 15.7V20l1.6-1.2-1.6-1"/>'),
// Firm — company / office block
firm: svg('<rect x="4" y="4" width="16" height="17" rx="1.5"/><path d="M3 21h18"/><rect x="7" y="7" width="1.8" height="1.8"/><rect x="11.5" y="7" width="1.8" height="1.8"/><rect x="15.5" y="7" width="1.8" height="1.8"/><rect x="7" y="11" width="1.8" height="1.8"/><rect x="11.5" y="11" width="1.8" height="1.8"/><rect x="15.5" y="11" width="1.8" height="1.8"/><path d="M10.5 21v-4h3v4"/>'),
// Person — a named contact (fallback)
person: svg('<circle cx="12" cy="8" r="3.6"/><path d="M5 20a7 7 0 0 1 14 0"/>')
};
// Human labels + canonical order for previews / legends
var META = [
['owners', 'Owners / Investors'],
['developers', 'Developers'],
['brokers', 'Brokers'],
['lenders', 'Lenders & Capital Sources'],
['vendors', 'Vendors / Service Providers'],
['legal', 'Legal / Attorneys'],
['construction', 'Construction / Contractors'],
['title', 'Title'],
['escrow', 'Escrow'],
['appraisers', 'Appraisers'],
['property_mgr', 'Property Managers'],
['firm', 'Firm'],
['person', 'Contact (person)']
];
// Map a free-text category/role name → the best icon (used by the console rail).
function get(name) {
if (!name) return ICONS.person;
var n = String(name).toLowerCase();
if (ICONS[n]) return ICONS[n];
if (/owner|investor/.test(n)) return ICONS.owners;
if (/develop/.test(n)) return ICONS.developers;
if (/broker/.test(n)) return ICONS.brokers;
if (/lend|capital|debt|equity|financ|bank/.test(n)) return ICONS.lenders;
if (/vendor|service|provider|supplier/.test(n)) return ICONS.vendors;
if (/legal|attorney|lawyer|counsel/.test(n)) return ICONS.legal;
if (/construct|contractor|builder|gc\b/.test(n)) return ICONS.construction;
if (/title/.test(n)) return ICONS.title;
if (/escrow/.test(n)) return ICONS.escrow;
if (/apprais/.test(n)) return ICONS.appraisers;
if (/property manager|property mgmt|prop.?mgr/.test(n)) return ICONS.property_mgr;
if (/firm|company|corp|group/.test(n)) return ICONS.firm;
return ICONS.person;
}
root.ROLE_ICONS = Object.assign({}, ICONS, { META: META, get: get });
})(typeof window !== 'undefined' ? window : this);