/* ══════════════════════════════════════════════════════════════
Controles editoriales del panel — portados del Dashboard de
Propietarios (mi-spacioam/ui.jsx): Select con popover, búsqueda
y check peach, y Segmented tipo píldora.
══════════════════════════════════════════════════════════════ */
function PIcon({ name, size = 15, stroke = "currentColor" }) {
const ns = window.SpacioAMDesignSystem_2c08fe;
if (ns && ns.Icon) return React.createElement(ns.Icon, { name, size, stroke });
return null;
}
function PanelSeg({ options, value, onChange, size = "md" }) {
const pad = size === "sm" ? "7px 12px" : "9px 16px";
const fs = size === "sm" ? 10.5 : 11;
return (
{options.map((o) => {
const active = o.value === value;
return (
);
})}
);
}
function PanelSelect({ value, options, onChange, icon, minWidth = 240, searchable, placeholder, block }) {
const [open, setOpen] = React.useState(false);
const [q, setQ] = React.useState("");
const ref = React.useRef(null);
React.useEffect(() => {
const h = (e) => { if (ref.current && !ref.current.contains(e.target)) { setOpen(false); setQ(""); } };
document.addEventListener("mousedown", h);
return () => document.removeEventListener("mousedown", h);
}, []);
const showSearch = searchable != null ? searchable : options.length > 6;
const shown = q
? options.filter((o) => (String(o.label) + " " + (o.sub || "")).toLowerCase().includes(q.toLowerCase()))
: options;
const cur = options.find((o) => o.value === value);
return (
{open && (
{showSearch && (
)}
{shown.map((o) => {
const active = o.value === value;
return (
);
})}
{shown.length === 0 &&
Sin resultados
}
)}
);
}
Object.assign(window, { PanelSelect, PanelSeg, PIcon });