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

Field() — react Function Reference

Architecture documentation for the Field() function in StyleEditor.js from the react codebase.

Function javascript BabelCompiler Validation

Entity Profile

Dependency Diagram

graph TD
  b5a28152_01cf_613a_7c2b_16ba2816d428["Field()"]
  a7173e0c_ba07_009a_1ada_f864062596b5["StyleEditor.js"]
  b5a28152_01cf_613a_7c2b_16ba2816d428 -->|defined in| a7173e0c_ba07_009a_1ada_f864062596b5
  style b5a28152_01cf_613a_7c2b_16ba2816d428 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js lines 258–296

function Field({
  className,
  onChange,
  onReset,
  onSubmit,
  placeholder,
  value,
}: FieldProps) {
  // $FlowFixMe[missing-local-annot]
  const onKeyDown = event => {
    switch (event.key) {
      case 'Enter':
        onSubmit();
        break;
      case 'Escape':
        onReset();
        break;
      case 'ArrowDown':
      case 'ArrowLeft':
      case 'ArrowRight':
      case 'ArrowUp':
        event.stopPropagation();
        break;
      default:
        break;
    }
  };

  return (
    <AutoSizeInput
      className={`${className} ${styles.Input}`}
      onBlur={onSubmit}
      onChange={(event: $FlowFixMe) => onChange(event.target.value)}
      onKeyDown={onKeyDown}
      placeholder={placeholder}
      value={value}
    />
  );
}

Domain

Subdomains

Defined In

Source

Frequently Asked Questions

What does Field() do?
Field() is a function in the react codebase, defined in packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js.
Where is Field() defined?
Field() is defined in packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js at line 258.

Analyze Your Own Codebase

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

Try Supermodel Free