Home / Function/ createRegExp() — react Function Reference

createRegExp() — react Function Reference

Architecture documentation for the createRegExp() function in utils.js from the react codebase.

Entity Profile

Dependency Diagram

graph TD
  7edde25d_7a4e_2a08_9aa5_35235e4ca8a7["createRegExp()"]
  d7b27d30_728f_ba37_ed97_d371fbd3de62["utils.js"]
  7edde25d_7a4e_2a08_9aa5_35235e4ca8a7 -->|defined in| d7b27d30_728f_ba37_ed97_d371fbd3de62
  944cc9b2_cf30_ba1e_496b_02b48a5aaa97["IndexableDisplayName()"]
  944cc9b2_cf30_ba1e_496b_02b48a5aaa97 -->|calls| 7edde25d_7a4e_2a08_9aa5_35235e4ca8a7
  style 7edde25d_7a4e_2a08_9aa5_35235e4ca8a7 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-devtools-shared/src/devtools/views/utils.js lines 35–97

export function createRegExp(string: string): RegExp {
  // Allow /regex/ syntax with optional last /
  if (string[0] === '/') {
    // Cut off first slash
    string = string.slice(1);
    // Cut off last slash, but only if it's there
    if (string[string.length - 1] === '/') {
      string = string.slice(0, string.length - 1);
    }
    try {
      return new RegExp(string, 'i');
    } catch (err) {
      // Bad regex. Make it not match anything.
      // TODO: maybe warn in console?
      return new RegExp('.^');
    }
  }

  function isLetter(char: string) {
    return char.toLowerCase() !== char.toUpperCase();
  }

  function matchAnyCase(char: string) {
    if (!isLetter(char)) {
      // Don't mess with special characters like [.
      return char;
    }
    return '[' + char.toLowerCase() + char.toUpperCase() + ']';
  }

  // 'item' should match 'Item' and 'ListItem', but not 'InviteMom'.
  // To do this, we'll slice off 'tem' and check first letter separately.
  const escaped = escapeStringRegExp(string);
  const firstChar = escaped[0];
  let restRegex = '';
  // For 'item' input, restRegex becomes '[tT][eE][mM]'
  // We can't simply make it case-insensitive because first letter case matters.
  for (let i = 1; i < escaped.length; i++) {
    restRegex += matchAnyCase(escaped[i]);
  }

  if (!isLetter(firstChar)) {
    // We can't put a non-character like [ in a group
    // so we fall back to the simple case.
    return new RegExp(firstChar + restRegex);
  }

  // Construct a smarter regex.
  return new RegExp(
    // For example:
    // (^[iI]|I)[tT][eE][mM]
    // Matches:
    // 'Item'
    // 'ListItem'
    // but not 'InviteMom'
    '(^' +
      matchAnyCase(firstChar) +
      '|' +
      firstChar.toUpperCase() +
      ')' +
      restRegex,
  );
}

Domain

Subdomains

Frequently Asked Questions

What does createRegExp() do?
createRegExp() is a function in the react codebase, defined in packages/react-devtools-shared/src/devtools/views/utils.js.
Where is createRegExp() defined?
createRegExp() is defined in packages/react-devtools-shared/src/devtools/views/utils.js at line 35.
What calls createRegExp()?
createRegExp() is called by 1 function(s): IndexableDisplayName.

Analyze Your Own Codebase

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

Try Supermodel Free