/* Shared icon glyphs + small helpers. Inline stroke SVGs, ~14×14. */
/* Loaded as a Babel script; exported on window. */
const { useState, useEffect, useRef, useMemo } = React;
const I = {
Search: (p) => (
),
Chev: (p) => (
),
ChevR: (p) => (
),
X: (p) => (
),
Check: (p) => (
),
Bldg: (p) => (
),
Co: (p) => (
),
History: (p) => (
),
Card: (p) => (
),
Gear: (p) => (
),
Users: (p) => (
),
Chart: (p) => (
),
Download: (p) => (
),
Plus: (p) => (
),
Dots: (p) => (
),
Tag: (p) => (
),
Open: (p) => (
),
Mail: (p) => (
),
Pause: (p) => (
),
Refresh: (p) => (
),
Logout: (p) => (
),
Shield: (p) => (
),
Pin: (p) => (
),
Eye: (p) => (
),
Sparkle: (p) => (
),
Box: (p) => (
),
};
// Browser logos for the landing page — flat duotone, small
const Browser = {
Chrome: () => (
),
Firefox: () => (
),
Edge: () => (
),
Safari: () => (
),
};
// Tiny logo component
function Logo({ size = "md" }) {
return (
AI.CONTACTIQ
);
}
// Avatar from name
function Avatar({ name, size = "md" }) {
const initials = (name || "?")
.split(/\s+/).map(p => p[0]).slice(0, 2).join("").toUpperCase();
// Stable hue per name for a touch of variety
const hue = useMemo(() => {
let h = 0;
for (const c of name || "") h = (h * 31 + c.charCodeAt(0)) % 360;
return h;
}, [name]);
return (
{initials}
);
}
// Status pill for a plan
function PlanPill({ plan }) {
const map = {
active: { cls: "green", label: "Active" },
trial: { cls: "accent", label: "Trial" },
trialing: { cls: "accent", label: "Trial" },
past_due: { cls: "amber", label: "Past due" },
canceled: { cls: "", label: "Canceled" },
};
const m = map[plan] || map.canceled;
return {m.label};
}
// Type pill for a lookup (building / company)
function TypePill({ type }) {
if (type === "building") {
return
Building
;
}
return
Company
;
}
// Google "G" logo (Google Pay button)
function GoogleG({ size = 14 }) {
return (
);
}
Object.assign(window, { I, Browser, Logo, Avatar, PlanPill, TypePill, GoogleG });