react Architecture Docs
Home / Function/ Component() — react Function Reference

Component() — react Function Reference

Architecture documentation for the Component() function in allow-ref-access-in-async-event-handler-wrapper.tsx from the react codebase.

Function tsx TestingUtilities Fixtures calls 2

Entity Profile

Dependency Diagram

graph TD
  fe7eadf9_cfd6_6819_1fa1_c7ffe8acbd9d["Component()"]
  534e28da_639e_38a4_87f5_7ee7fa119cde["allow-ref-access-in-async-event-handler-wrapper.tsx"]
  fe7eadf9_cfd6_6819_1fa1_c7ffe8acbd9d -->|defined in| 534e28da_639e_38a4_87f5_7ee7fa119cde
  1fd141f9_0622_9ad9_cd05_10c8aa3edd1a["upload()"]
  fe7eadf9_cfd6_6819_1fa1_c7ffe8acbd9d -->|calls| 1fd141f9_0622_9ad9_cd05_10c8aa3edd1a
  8832979c_0305_9748_13dc_cd7be06a8abc["handleSubmit()"]
  fe7eadf9_cfd6_6819_1fa1_c7ffe8acbd9d -->|calls| 8832979c_0305_9748_13dc_cd7be06a8abc
  style fe7eadf9_cfd6_6819_1fa1_c7ffe8acbd9d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-async-event-handler-wrapper.tsx lines 21–43

function Component() {
  const ref = useRef<SignatureRef>(null);

  const onSubmit = async (value: any) => {
    // This should be allowed: accessing ref.current in an async event handler
    // that's wrapped and passed to onSubmit prop
    let sigUrl: string;
    if (value.hasSignature) {
      const {blob} = await upload(ref.current?.toFile());
      sigUrl = blob?.url || '';
    } else {
      sigUrl = value.signature;
    }
    console.log('Signature URL:', sigUrl);
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input type="text" name="signature" />
      <button type="submit">Submit</button>
    </form>
  );
}

Domain

Subdomains

Defined In

Calls

Source

Frequently Asked Questions

What does Component() do?
Component() is a function in the react codebase, defined in compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-async-event-handler-wrapper.tsx.
Where is Component() defined?
Component() is defined in compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-async-event-handler-wrapper.tsx at line 21.
What does Component() call?
Component() calls 2 function(s): handleSubmit, upload.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free