PUILog

A PUILog is a component that automatically attached to the PUIContext. When you use a hook from PUIHookLog the PUILog will automatically present the new log item. You can log as an info, warning, debug, or error. On a PUILog there are filters to select which log types you are currently viewing.

Also provided are a few helpful buttons at the bottom of a PUILog, you can navigate to the top of the log, or to the bottom of the log. There is a little "truck" that when enabled automatically scrolls the log to the bottom when new log items are printed. You can also copy the current log to your clipboard or delete all the messages in the log.

Example

import {
    usePUILogInfo,
    usePUILogWarning,
    usePUILogDebug,
    usePUILogError
} from "@pstdl/ui";

function TestBed(): ReactElement {

    // usePUILog*() will give you a hook
    // that logs any data you send it
	const logInfo = usePUILogInfo();
	const logWarning = usePUILogWarning();
	const logDebug = usePUILogDebug();
	const logError = usePUILogError();
	
    // This just makes sure the logs are only
    // fired off the first time the component
    // is mounted or updated to prevent a cyclical
    // state update.
	useEffect(() => {
		logWarningInfo("Log has started up!");
		logWarning("This is a warning!")
		logError("AHH! Error, oh boy.")
		logDebug("beep boop beep")
	}, [])

	return <div>
		<PUILog /> // no passing props of logs around :)
	</div>

}