use:connected

Element attribute that runs its callback once the element is connected to the document. Available only as an attribute on elements (not as a standalone lifecycle — that's ready). Accepts a single callback or an array of callbacks; each receives the element.

use:connected callbacks run after the current batch of nodes has been inserted into the document, before paint, in recursive order, and before the ready callbacks. Because the value is a function (node) => void, you can also pass a ref signal here to have the reference land at mount time — see use:ref.

Arguments

name	type	description
value	fn | fn[] (any depth)	function(s) called with the element once it is connected

Examples

Run on mount

The callback fires once the element is in the document, after insertion and before paint.

import { render, signal } from 'pota'

function App() {
	const log = signal('')
	return (
		<div>
			<main
				use:connected={node => log.write(`${node.tagName} connected`)}
			>
				Content
			</main>
			<p>{log.read}</p>
		</div>
	)
}

render(App)