Skip to main content
Explore the live, interactive preview at tuturuuu.com/ui/components/report-problem-dialog.
Category: Advanced · Import: @tuturuuu/ui/report-problem-dialog · Status: Pattern preview

​
Installation

Install the shared UI package, import global styles once, then import the component from its public subpath. 
bun add @tuturuuu/ui

import '@tuturuuu/ui/globals.css';
import { ReportProblemDialog } from '@tuturuuu/ui/report-problem-dialog';

​
Usage

Copy the default usage snippet and adapt labels, state, and event handlers to the product surface. 
import { ReportProblemDialog } from '@tuturuuu/ui/report-problem-dialog';

<ReportProblemDialog product="web" />

​
Examples

Examples reuse the registry snippets so the docs stay aligned with the component catalog.

​
Default

A minimal implementation using the current registry snippet. 
import { ReportProblemDialog } from '@tuturuuu/ui/report-problem-dialog';

<ReportProblemDialog product="web" />

​
Package import

Import through the public package path so workspace and external apps share the same contract. 
// Public package import
import { ReportProblemDialog } from '@tuturuuu/ui/report-problem-dialog';

// Workspace apps should keep importing through the package boundary.

​
API reference

The public exports currently available from this component entry.
ExportKind
ReportProblemDialogcomponent

​
Customization

Common props, states, and composition points to review before using this component.
  • Product
  • Upload limit
  • Mutation