{"record":{"id":"05791bda6c9978ee","repo":"shadcn-ui/ui","slug":"usepreviewoverride-must-be-used-within-a-typesetpr","errorCode":null,"errorMessage":"usePreviewOverride must be used within a TypesetPreviewOverrideProvider.","messagePattern":"usePreviewOverride must be used within a TypesetPreviewOverrideProvider\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"apps/v4/app/(app)/(typeset)/components/preview-override.tsx","lineNumber":104,"sourceCode":"    () => ({ setOverride, clearOverride }),\n    [setOverride, clearOverride]\n  )\n\n  return (\n    <PreviewOverrideActionsContext.Provider value={actions}>\n      <PreviewOverrideValueContext.Provider value={override}>\n        {children}\n      </PreviewOverrideValueContext.Provider>\n    </PreviewOverrideActionsContext.Provider>\n  )\n}\n\n// For pickers: stable setters only, never re-renders on override changes.\nexport function usePreviewOverride() {\n  const context = React.useContext(PreviewOverrideActionsContext)\n\n  if (!context) {\n    throw new Error(\n      \"usePreviewOverride must be used within a TypesetPreviewOverrideProvider.\"\n    )\n  }\n\n  return context\n}\n\n// For the preview iframe host: the current override value.\nexport function usePreviewOverrideValue() {\n  return React.useContext(PreviewOverrideValueContext)\n}\n","sourceCodeStart":86,"sourceCodeEnd":116,"githubUrl":"https://github.com/shadcn-ui/ui/blob/efac5987074af84ece57c367c6dd83387b967022/apps/v4/app/(app)/(typeset)/components/preview-override.tsx#L86-L116","documentation":"Typeset variant of [141]. `usePreviewOverride` reads `PreviewOverrideActionsContext`; if `React.useContext` returns falsy (no `<PreviewOverrideProvider>` ancestor in the (typeset) subtree) it throws the Typeset-specific message. Same fail-fast contract: pickers need the memoized setters.","triggerScenarios":"A typeset picker/preview consumer rendered outside `<PreviewOverrideProvider>` within the (typeset) route group; copy-pasting a (create) component into the (typeset) tree without ensuring the typeset provider wraps it.","commonSituations":"Sharing picker components between create/typeset surfaces but mounting them in typeset without the typeset provider; route layout changes; isolated tests/stories.","solutions":["Wrap the typeset subtree in `<PreviewOverrideProvider>` from this file (apps/v4/app/(app)/(typeset)/components/preview-override.tsx), not the (create) one.","Verify the import path: import the provider/hook from the (typeset) module to match the context instance.","Decorate tests/stories with the typeset provider."],"exampleFix":"// before\n<TypesetPicker />\n\n// after\nimport { PreviewOverrideProvider } from \"@/(app)/(typeset)/components/preview-override\"\n<PreviewOverrideProvider>\n  <TypesetPicker />\n</PreviewOverrideProvider>","handlingStrategy":"type-guard","validationCode":"render(<PreviewOverrideProvider>{<TypesetPicker/>}</PreviewOverrideProvider>) // import from (typeset) module","typeGuard":"import React from \"react\"\nimport { PreviewOverrideActionsContext } from \"@/(app)/(typeset)/components/preview-override\"\nconst hasTypesetPreviewOverride = () => React.useContext(PreviewOverrideActionsContext) != null","tryCatchPattern":"try { usePreviewOverride() } catch (e) { if (e.message.includes(\"TypesetPreviewOverrideProvider\")) {/*wrap with (typeset) provider*/} throw e }","preventionTips":["Import the provider and hook from the (typeset) module, not (create), so the context identity matches.","Wrap the (typeset) route subtree once with PreviewOverrideProvider.","Add the typeset provider to story/test decorators for typeset pickers."],"tags":["react","context","hooks","shadcn-v4","typeset","preview"],"backgroundTag":null,"analyzedSha":"efac5987074af84ece57c367c6dd83387b967022","analyzedAt":"2026-08-12T05:00:50.218Z","schemaVersion":2},"datasetVersion":"2026-08-12T13:17:24.610Z"}