));
}
/* ═══════════════════ EMPTY STATE ═══════════════════ */
function EmptyState({ message, sub }) {
const isDesktop = typeof window !== 'undefined' && window.innerWidth >= 1024;
return (
{message || 'Nenhum resultado'}
{sub && (
{sub}
)}
);
}
/* ═══════════════════ MODAL ═══════════════════ */
function Modal({ open, title, onClose, children, footer, maxWidth=460 }) {
useEffect(() => {
if (!open) return;
const handler = (e) => { if (e.key === 'Escape') { e.stopPropagation(); onClose && onClose(); } };
window.addEventListener('keydown', handler);
return () => window.removeEventListener('keydown', handler);
}, [open, onClose]);
if (!open) return null;
return (
e.stopPropagation()}
role="dialog"
aria-modal="true"
style={{
background:'var(--bg-1)', border:'1px solid var(--border-0)',
borderRadius:'var(--radius-md)', maxWidth, width:'100%',
boxShadow:'0 12px 48px rgba(0,0,0,0.22)',
display:'flex', flexDirection:'column', overflow:'hidden',
maxHeight:'90vh'
}}>
{title && (
{title}
)}
{children}
{footer && (
{footer}
)}
);
}
/* ═══════════════════ CONFIRM DIALOG ═══════════════════ */
function ConfirmDialog({ open, title, message, confirmLabel='Confirmar', cancelLabel='Cancelar', destructive, onConfirm, onCancel }) {
const confirmBtnRef = useRef(null);
useEffect(() => { if (open && confirmBtnRef.current) confirmBtnRef.current.focus(); }, [open]);
const dangerBtnStyle = destructive
? { background:'var(--danger)', borderColor:'var(--danger)', color:'#fff' }
: undefined;
return (
}>
{message}
);
}
/* ═══════════════════ PROMPT DIALOG ═══════════════════ */
function PromptDialog({ open, title, message, defaultValue='', placeholder, confirmLabel='Salvar', cancelLabel='Cancelar', onConfirm, onCancel }) {
const [val, setVal] = useState(defaultValue);
const inputRef = useRef(null);
useEffect(() => { setVal(defaultValue || ''); }, [defaultValue, open]);
useEffect(() => {
if (open && inputRef.current) {
// Defer focus so the modal animation doesn't fight the focus call
const t = setTimeout(() => { inputRef.current && inputRef.current.focus(); inputRef.current && inputRef.current.select(); }, 30);
return () => clearTimeout(t);
}
}, [open]);
const submit = () => {
const v = val.trim();
if (v) onConfirm(v);
};
return (
}>
{message && (
{message}
)}
setVal(e.target.value)}
placeholder={placeholder}
onKeyDown={e => {
if (e.key === 'Enter') submit();
if (e.key === 'Escape') onCancel();
}}
style={{width:'100%', padding:'10px 12px', fontSize:'1rem'}}
/>
);
}
/* ═══════════════════ DIALOG HOOK ═══════════════════
* Drop-in async replacement for window.confirm / window.prompt.
*
* const ok = await dialog.confirm({ message: '...', destructive: true });
* const name = await dialog.prompt({ defaultValue: '...' });
*
* Returns `{ confirm, prompt, render }`. Render `dialog.render` once in your tree.
*/
function useDialog() {
const [state, setState] = useState(null); // { type, props, resolve }
const askConfirm = useCallback((opts) => new Promise(resolve => {
setState({ type:'confirm', props:opts || {}, resolve });
}), []);
const askPrompt = useCallback((opts) => new Promise(resolve => {
setState({ type:'prompt', props:opts || {}, resolve });
}), []);
const close = useCallback((value) => {
setState(prev => {
if (prev && prev.resolve) prev.resolve(value);
return null;
});
}, []);
const render = state && (
state.type === 'confirm' ? (
close(true)} onCancel={() => close(false)}/>
) : state.type === 'prompt' ? (
close(v)} onCancel={() => close(null)}/>
) : null
);
return { confirm: askConfirm, prompt: askPrompt, render };
}
/* ═══════════════════ EXPORTS ═══════════════════ */
Object.assign(window, {
Ico, IcoSearch, IcoClose, IcoChevRight, IcoChevDown, IcoExport, IcoChart, IcoSave,
IcoHistory, IcoEdit, IcoTrash, IcoCheck, IcoLink, IcoNote, IcoSort, IcoFilter,
IcoShare, IcoCopy,
fmtNum, SearchableSelect, HBarChart, TimelineChart, SkeletonRows, EmptyState,
Modal, ConfirmDialog, PromptDialog, useDialog
});