Add emoji confetti bursts and component playground.
Support app.relay.emoji_confetti on jumbo emoji clicks with canvas physics, per-emoji particle profiles, and a fixed overlay that does not affect scroll. Also add a Vite playground for live component previews and theme hover preview.
This commit is contained in:
40
src/playground/PreviewErrorBoundary.tsx
Normal file
40
src/playground/PreviewErrorBoundary.tsx
Normal file
@@ -0,0 +1,40 @@
|
||||
import React, { Component, type ErrorInfo, type ReactNode } from 'react';
|
||||
|
||||
type Props = {
|
||||
resetKey: string;
|
||||
children: ReactNode;
|
||||
};
|
||||
|
||||
type State = {
|
||||
error: string | null;
|
||||
};
|
||||
|
||||
export class PreviewErrorBoundary extends Component<Props, State> {
|
||||
state: State = { error: null };
|
||||
|
||||
static getDerivedStateFromError(error: Error): State {
|
||||
return {
|
||||
error: `${error.message}\n\n${error.stack ?? ''}`,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidCatch(error: Error, info: ErrorInfo) {
|
||||
console.error('[playground preview]', error, info);
|
||||
this.setState({
|
||||
error: `${error.message}\n\n${error.stack ?? ''}\n\n${info.componentStack ?? ''}`,
|
||||
});
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps: Props) {
|
||||
if (prevProps.resetKey !== this.props.resetKey && this.state.error) {
|
||||
this.setState({ error: null });
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.error) {
|
||||
return <pre className="error-block">{this.state.error}</pre>;
|
||||
}
|
||||
return this.props.children;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user