Skip to main content

Composition context

ContentDetail provides its composition prop through CompositionContext. Use useComposition in a custom child when the layout needs access to that resource without passing it through every intermediate component.

import { ContentDetail, useComposition } from "@ovok/native/content";

function ResourceLabel() {
  const { composition } = useComposition();
  return <Text>{composition?.title}</Text>;
}

<ContentDetail composition={composition}>
  <ResourceLabel />
</ContentDetail>

useComposition throws when rendered outside ContentDetail. The context exposes the resource supplied by the parent; it does not fetch or authorize it.

Exports​

  • CompositionContext and CompositionContextType for advanced composition.
  • useComposition for descendants of ContentDetail.

Prefer the ContentDetail provider over setting the context directly.