Skip to content

Migrate codebase to TypeScript with React 19 support#274

Open
ryanseddon wants to merge 14 commits intomasterfrom
ryan/typescript-for-reals
Open

Migrate codebase to TypeScript with React 19 support#274
ryanseddon wants to merge 14 commits intomasterfrom
ryan/typescript-for-reals

Conversation

@ryanseddon
Copy link
Owner

Migrates all source files from JavaScript/JSX to TypeScript/TSX, adding full type safety while maintaining backward compatibility with React 16.8+.

Key changes:

  • Converts Frame, Content, and Context components to TypeScript with proper type definitions
  • Adds FrameProps type export for TypeScript consumers
  • Introduces useFrame hook for accessing frame context
  • Updates build pipeline to emit TypeScript declarations
  • Expands peer dependencies to include React 19
  • Converts Content class component to functional component with hooks
  • Updates test files to work with new TypeScript structure

Deprecations:

  • contentDidMount → use onMount instead
  • contentDidUpdate → use onUpdate instead

These deprecated props will be removed in a future major version.

@changeset-bot
Copy link

changeset-bot bot commented Mar 9, 2026

🦋 Changeset detected

Latest commit: 120f987

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
react-frame-component Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

- Add TypeScript with strict mode
- Convert .jsx files to .tsx
- Remove prop-types in favor of TypeScript types
- Add TypeScript declaration output (dist/index.d.ts)
- Support React 16.8+ through 19+ in peerDependencies
fix: remove duplicate React 19 in peerDependencies
- Remove unsafe 'as any' cast in Frame.tsx using proper createRef typing
- Make Content children optional (ReactNode instead of ReactElement)
- Add Frame class and Content exports to index.d.ts
- Add tests for named Frame export, nodeRef prop, and invalid mountTarget
- Use useLayoutEffect to maintain sync lifecycle behavior
- Keep isMounted ref pattern for mount/update detection
- Remove unsafe 'as any' cast in Frame.tsx using proper createRef typing
- Make Content children optional (ReactNode instead of ReactElement)
- Add Frame class and Content exports to index.d.ts
- Refactor context test to use modern functional component with useContext
…erscore prefix

- Simplify Frame component to destructure props directly in function signature
- Add onMount and onUpdate as modern alternatives to deprecated lifecycle callbacks
- Add JSDoc @deprecated annotations to contentDidMount and contentDidUpdate
- Update Frame.tsx, Content.tsx, and index.d.ts with new props
- Update tests to use new onMount/onUpdate props
- Use createRef instead of unsafe 'as any' cast
- Make FrameContext document/window optional instead of casting empty objects
- Remove unsafe 'as HTMLIFrameElement' assertion using proper useRef typing
- Update index.d.ts to export Frame/Content as functions not classes
- Add nodeRef prop to FrameComponentProps in index.d.ts
- Replace class component test with modern functional component
@ryanseddon ryanseddon force-pushed the ryan/typescript-for-reals branch from fa1ce07 to 120f987 Compare March 9, 2026 04:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant