Callbacks & Hooks

Use onMeasured to inspect generated blueprints and wire analytics around skeleton generation.

Interactive Example

Trigger loading and inspect the latest measured blueprint

onMeasured

Measurement Candidate

This content becomes the measurement target for AutoSkeleton.

Title block and metadata

Summary paragraph with body copy

Call-to-action row

No blueprint captured yet. Toggle loading to trigger measurement.

Blueprint Inspector

Raw JSON payload from onMeasured

Waiting for initial measurement.

Code Example

Hook into generated blueprints

tsx

const [blueprint, setBlueprint] = useState<Blueprint | null>(null);

<AutoSkeleton
  loading={loading}
  onMeasured={(nextBlueprint) => {
    setBlueprint(nextBlueprint);
    console.log("Measured", nextBlueprint.nodes.length, "nodes");
  }}
>
  <YourComponent />
</AutoSkeleton>