@sentry/react 7.12.1 → 7.14.0

package/cjs/errorboundary.js

@@ -124,11 +124,13 @@ class ErrorBoundary extends React__namespace.Component {constructor(...args) { s
   }
 }
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function withErrorBoundary(
   WrappedComponent,
   errorBoundaryOptions,
 ) {
-    var componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+  var componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
 
   var Wrapped = (props) => (
     React__namespace.createElement(ErrorBoundary, { ...errorBoundaryOptions, __self: this, __source: {fileName: _jsxFileName, lineNumber: 168}}
@@ -136,7 +138,8 @@ function withErrorBoundary(
     )
   );
 
-    Wrapped.displayName = `errorBoundary(${componentDisplayName})`;
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;
 
   // Copy over static methods from Wrapped component to Profiler HOC
   // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over

package/cjs/errorboundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"errorboundary.js","sources":["../../src/errorboundary.tsx"],"sourcesContent":["import { captureException, ReportDialogOptions, Scope, showReportDialog, withScope } from '@sentry/browser';\nimport { logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nexport function isAtLeastReact17(version: string): boolean {\n  const major = version.match(/^([^.]+)/);\n  return major !== null && parseInt(major[0]) >= 17;\n}\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type FallbackRender = (errorData: {\n  error: Error;\n  componentStack: string | null;\n  eventId: string | null;\n  resetError(): void;\n}) => React.ReactElement;\n\nexport type ErrorBoundaryProps = {\n  children?: React.ReactNode | (() => React.ReactNode);\n  /** If a Sentry report dialog should be rendered on error */\n  showDialog?: boolean;\n  /**\n   * Options to be passed into the Sentry report dialog.\n   * No-op if {@link showDialog} is false.\n   */\n  dialogOptions?: ReportDialogOptions;\n  /**\n   * A fallback component that gets rendered when the error boundary encounters an error.\n   *\n   * Can either provide a React Component, or a function that returns React Component as\n   * a valid fallback prop. If a function is provided, the function will be called with\n   * the error, the component stack, and an function that resets the error boundary on error.\n   *\n   */\n  fallback?: React.ReactElement | FallbackRender;\n  /** Called when the error boundary encounters an error */\n  onError?(error: Error, componentStack: string, eventId: string): void;\n  /** Called on componentDidMount() */\n  onMount?(): void;\n  /** Called if resetError() is called from the fallback render props function  */\n  onReset?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called on componentWillUnmount() */\n  onUnmount?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called before the error is captured by Sentry, allows for you to add tags or context using the scope */\n  beforeCapture?(scope: Scope, error: Error | null, componentStack: string | null): void;\n};\n\ntype ErrorBoundaryState = {\n  componentStack: React.ErrorInfo['componentStack'] | null;\n  error: Error | null;\n  eventId: string | null;\n};\n\nconst INITIAL_STATE = {\n  componentStack: null,\n  error: null,\n  eventId: null,\n};\n\n/**\n * A ErrorBoundary component that logs errors to Sentry. Requires React >= 16.\n * NOTE: If you are a Sentry user, and you are seeing this stack frame, it means the\n * Sentry React SDK ErrorBoundary caught an error invoking your application code. This\n * is expected behavior and NOT indicative of a bug with the Sentry React SDK.\n */\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  public state: ErrorBoundaryState = INITIAL_STATE;\n\n  public componentDidCatch(error: Error & { cause?: Error }, { componentStack }: React.ErrorInfo): void {\n    const { beforeCapture, onError, showDialog, dialogOptions } = this.props;\n\n    withScope(scope => {\n      // If on React version >= 17, create stack trace from componentStack param and links\n      // to to the original error using `error.cause` otherwise relies on error param for stacktrace.\n      // Linking errors requires the `LinkedErrors` integration be enabled.\n      if (isAtLeastReact17(React.version)) {\n        const errorBoundaryError = new Error(error.message);\n        errorBoundaryError.name = `React ErrorBoundary ${errorBoundaryError.name}`;\n        errorBoundaryError.stack = componentStack;\n\n        // Using the `LinkedErrors` integration to link the errors together.\n        error.cause = errorBoundaryError;\n      }\n\n      if (beforeCapture) {\n        beforeCapture(scope, error, componentStack);\n      }\n      const eventId = captureException(error, { contexts: { react: { componentStack } } });\n      if (onError) {\n        onError(error, componentStack, eventId);\n      }\n      if (showDialog) {\n        showReportDialog({ ...dialogOptions, eventId });\n      }\n\n      // componentDidCatch is used over getDerivedStateFromError\n      // so that componentStack is accessible through state.\n      this.setState({ error, componentStack, eventId });\n    });\n  }\n\n  public componentDidMount(): void {\n    const { onMount } = this.props;\n    if (onMount) {\n      onMount();\n    }\n  }\n\n  public componentWillUnmount(): void {\n    const { error, componentStack, eventId } = this.state;\n    const { onUnmount } = this.props;\n    if (onUnmount) {\n      onUnmount(error, componentStack, eventId);\n    }\n  }\n\n  public resetErrorBoundary: () => void = () => {\n    const { onReset } = this.props;\n    const { error, componentStack, eventId } = this.state;\n    if (onReset) {\n      onReset(error, componentStack, eventId);\n    }\n    this.setState(INITIAL_STATE);\n  };\n\n  public render(): React.ReactNode {\n    const { fallback, children } = this.props;\n    const { error, componentStack, eventId } = this.state;\n\n    if (error) {\n      let element: React.ReactElement | undefined = undefined;\n      if (typeof fallback === 'function') {\n        element = fallback({ error, componentStack, resetError: this.resetErrorBoundary, eventId });\n      } else {\n        element = fallback;\n      }\n\n      if (React.isValidElement(element)) {\n        return element;\n      }\n\n      if (fallback) {\n        __DEBUG_BUILD__ && logger.warn('fallback did not produce a valid ReactElement');\n      }\n\n      // Fail gracefully if no fallback provided or is not valid\n      return null;\n    }\n\n    if (typeof children === 'function') {\n      return (children as () => React.ReactNode)();\n    }\n    return children;\n  }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction withErrorBoundary<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  errorBoundaryOptions: ErrorBoundaryProps,\n): React.FC<P> {\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  const componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <ErrorBoundary {...errorBoundaryOptions}>\n      <WrappedComponent {...props} />\n    </ErrorBoundary>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\nexport { ErrorBoundary, withErrorBoundary };\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;;;AAQA;;;;AA+CA;;;;AAIA;;AAEA;;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyFA;;AAEA;;;AAIA;;;;;;;;;;;;;;;AAiBA;;;;;"}
+{"version":3,"file":"errorboundary.js","sources":["../../src/errorboundary.tsx"],"sourcesContent":["import { captureException, ReportDialogOptions, Scope, showReportDialog, withScope } from '@sentry/browser';\nimport { logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nexport function isAtLeastReact17(version: string): boolean {\n  const major = version.match(/^([^.]+)/);\n  return major !== null && parseInt(major[0]) >= 17;\n}\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type FallbackRender = (errorData: {\n  error: Error;\n  componentStack: string | null;\n  eventId: string | null;\n  resetError(): void;\n}) => React.ReactElement;\n\nexport type ErrorBoundaryProps = {\n  children?: React.ReactNode | (() => React.ReactNode);\n  /** If a Sentry report dialog should be rendered on error */\n  showDialog?: boolean;\n  /**\n   * Options to be passed into the Sentry report dialog.\n   * No-op if {@link showDialog} is false.\n   */\n  dialogOptions?: ReportDialogOptions;\n  /**\n   * A fallback component that gets rendered when the error boundary encounters an error.\n   *\n   * Can either provide a React Component, or a function that returns React Component as\n   * a valid fallback prop. If a function is provided, the function will be called with\n   * the error, the component stack, and an function that resets the error boundary on error.\n   *\n   */\n  fallback?: React.ReactElement | FallbackRender;\n  /** Called when the error boundary encounters an error */\n  onError?(error: Error, componentStack: string, eventId: string): void;\n  /** Called on componentDidMount() */\n  onMount?(): void;\n  /** Called if resetError() is called from the fallback render props function  */\n  onReset?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called on componentWillUnmount() */\n  onUnmount?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called before the error is captured by Sentry, allows for you to add tags or context using the scope */\n  beforeCapture?(scope: Scope, error: Error | null, componentStack: string | null): void;\n};\n\ntype ErrorBoundaryState = {\n  componentStack: React.ErrorInfo['componentStack'] | null;\n  error: Error | null;\n  eventId: string | null;\n};\n\nconst INITIAL_STATE = {\n  componentStack: null,\n  error: null,\n  eventId: null,\n};\n\n/**\n * A ErrorBoundary component that logs errors to Sentry. Requires React >= 16.\n * NOTE: If you are a Sentry user, and you are seeing this stack frame, it means the\n * Sentry React SDK ErrorBoundary caught an error invoking your application code. This\n * is expected behavior and NOT indicative of a bug with the Sentry React SDK.\n */\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  public state: ErrorBoundaryState = INITIAL_STATE;\n\n  public componentDidCatch(error: Error & { cause?: Error }, { componentStack }: React.ErrorInfo): void {\n    const { beforeCapture, onError, showDialog, dialogOptions } = this.props;\n\n    withScope(scope => {\n      // If on React version >= 17, create stack trace from componentStack param and links\n      // to to the original error using `error.cause` otherwise relies on error param for stacktrace.\n      // Linking errors requires the `LinkedErrors` integration be enabled.\n      if (isAtLeastReact17(React.version)) {\n        const errorBoundaryError = new Error(error.message);\n        errorBoundaryError.name = `React ErrorBoundary ${errorBoundaryError.name}`;\n        errorBoundaryError.stack = componentStack;\n\n        // Using the `LinkedErrors` integration to link the errors together.\n        error.cause = errorBoundaryError;\n      }\n\n      if (beforeCapture) {\n        beforeCapture(scope, error, componentStack);\n      }\n      const eventId = captureException(error, { contexts: { react: { componentStack } } });\n      if (onError) {\n        onError(error, componentStack, eventId);\n      }\n      if (showDialog) {\n        showReportDialog({ ...dialogOptions, eventId });\n      }\n\n      // componentDidCatch is used over getDerivedStateFromError\n      // so that componentStack is accessible through state.\n      this.setState({ error, componentStack, eventId });\n    });\n  }\n\n  public componentDidMount(): void {\n    const { onMount } = this.props;\n    if (onMount) {\n      onMount();\n    }\n  }\n\n  public componentWillUnmount(): void {\n    const { error, componentStack, eventId } = this.state;\n    const { onUnmount } = this.props;\n    if (onUnmount) {\n      onUnmount(error, componentStack, eventId);\n    }\n  }\n\n  public resetErrorBoundary: () => void = () => {\n    const { onReset } = this.props;\n    const { error, componentStack, eventId } = this.state;\n    if (onReset) {\n      onReset(error, componentStack, eventId);\n    }\n    this.setState(INITIAL_STATE);\n  };\n\n  public render(): React.ReactNode {\n    const { fallback, children } = this.props;\n    const { error, componentStack, eventId } = this.state;\n\n    if (error) {\n      let element: React.ReactElement | undefined = undefined;\n      if (typeof fallback === 'function') {\n        element = fallback({ error, componentStack, resetError: this.resetErrorBoundary, eventId });\n      } else {\n        element = fallback;\n      }\n\n      if (React.isValidElement(element)) {\n        return element;\n      }\n\n      if (fallback) {\n        __DEBUG_BUILD__ && logger.warn('fallback did not produce a valid ReactElement');\n      }\n\n      // Fail gracefully if no fallback provided or is not valid\n      return null;\n    }\n\n    if (typeof children === 'function') {\n      return (children as () => React.ReactNode)();\n    }\n    return children;\n  }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction withErrorBoundary<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  errorBoundaryOptions: ErrorBoundaryProps,\n): React.FC<P> {\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  const componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <ErrorBoundary {...errorBoundaryOptions}>\n      <WrappedComponent {...props} />\n    </ErrorBoundary>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\nexport { ErrorBoundary, withErrorBoundary };\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;;;AAQA;;;;AA+CA;;;;AAIA;;AAEA;;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyFA;;AAEA;AACA;;;AAGA;;;;;;;;;;;;;;;;;AAiBA;;;;;"}

package/cjs/profiler.js

@@ -14,7 +14,8 @@ var constants = require('./constants.js');
 var hoistNonReactStatics__default = /*#__PURE__*/_interopDefault(hoistNonReactStatics);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packages/react/src/profiler.tsx";
+var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packages/react/src/profiler.tsx";/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+
 var UNKNOWN_COMPONENT = 'unknown';
 
 /**
@@ -32,7 +33,8 @@ class Profiler extends React__namespace.Component {
    */
    __init2() {this._updateSpan = undefined;}
 
-     static __initStatic() {this.defaultProps = {
+  // eslint-disable-next-line @typescript-eslint/member-ordering
+   static __initStatic() {this.defaultProps = {
     disabled: false,
     includeRender: true,
     includeUpdates: true,
@@ -191,7 +193,8 @@ function useProfiler(
       }
     };
     // We only want this to run once.
-      }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 }
 
 /** Grabs active transaction off scope */

package/cjs/profiler.js.map

@@ -1 +1 @@
-{"version":3,"file":"profiler.js","sources":["../../src/profiler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { getCurrentHub, Hub } from '@sentry/browser';\nimport { Span, Transaction } from '@sentry/types';\nimport { timestampWithMs } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { REACT_MOUNT_OP, REACT_RENDER_OP, REACT_UPDATE_OP } from './constants';\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type ProfilerProps = {\n  // The name of the component being profiled.\n  name: string;\n  // If the Profiler is disabled. False by default. This is useful if you want to disable profilers\n  // in certain environments.\n  disabled?: boolean;\n  // If time component is on page should be displayed as spans. True by default.\n  includeRender?: boolean;\n  // If component updates should be displayed as spans. True by default.\n  includeUpdates?: boolean;\n  // props given to component being profiled.\n  updateProps: { [key: string]: unknown };\n};\n\n/**\n * The Profiler component leverages Sentry's Tracing integration to generate\n * spans based on component lifecycles.\n */\nclass Profiler extends React.Component<ProfilerProps> {\n  /**\n   * The span of the mount activity\n   * Made protected for the React Native SDK to access\n   */\n  protected _mountSpan: Span | undefined = undefined;\n  /**\n   * The span that represents the duration of time between shouldComponentUpdate and componentDidUpdate\n   */\n  protected _updateSpan: Span | undefined = undefined;\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  public static defaultProps: Partial<ProfilerProps> = {\n    disabled: false,\n    includeRender: true,\n    includeUpdates: true,\n  };\n\n  public constructor(props: ProfilerProps) {\n    super(props);\n    const { name, disabled = false } = this.props;\n\n    if (disabled) {\n      return;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      this._mountSpan = activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n  }\n\n  // If a component mounted, we can finish the mount activity.\n  public componentDidMount(): void {\n    if (this._mountSpan) {\n      this._mountSpan.finish();\n    }\n  }\n\n  public shouldComponentUpdate({ updateProps, includeUpdates = true }: ProfilerProps): boolean {\n    // Only generate an update span if includeUpdates is true, if there is a valid mountSpan,\n    // and if the updateProps have changed. It is ok to not do a deep equality check here as it is expensive.\n    // We are just trying to give baseline clues for further investigation.\n    if (includeUpdates && this._mountSpan && updateProps !== this.props.updateProps) {\n      // See what props haved changed between the previous props, and the current props. This is\n      // set as data on the span. We just store the prop keys as the values could be potenially very large.\n      const changedProps = Object.keys(updateProps).filter(k => updateProps[k] !== this.props.updateProps[k]);\n      if (changedProps.length > 0) {\n        const now = timestampWithMs();\n        this._updateSpan = this._mountSpan.startChild({\n          data: {\n            changedProps,\n          },\n          description: `<${this.props.name}>`,\n          op: REACT_UPDATE_OP,\n          startTimestamp: now,\n        });\n      }\n    }\n\n    return true;\n  }\n\n  public componentDidUpdate(): void {\n    if (this._updateSpan) {\n      this._updateSpan.finish();\n      this._updateSpan = undefined;\n    }\n  }\n\n  // If a component is unmounted, we can say it is no longer on the screen.\n  // This means we can finish the span representing the component render.\n  public componentWillUnmount(): void {\n    const { name, includeRender = true } = this.props;\n\n    if (this._mountSpan && includeRender) {\n      // If we were able to obtain the spanId of the mount activity, we should set the\n      // next activity as a child to the component mount activity.\n      this._mountSpan.startChild({\n        description: `<${name}>`,\n        endTimestamp: timestampWithMs(),\n        op: REACT_RENDER_OP,\n        startTimestamp: this._mountSpan.endTimestamp,\n      });\n    }\n  }\n\n  public render(): React.ReactNode {\n    return this.props.children;\n  }\n}\n\n/**\n * withProfiler is a higher order component that wraps a\n * component in a {@link Profiler} component. It is recommended that\n * the higher order component be used over the regular {@link Profiler} component.\n *\n * @param WrappedComponent component that is wrapped by Profiler\n * @param options the {@link ProfilerProps} you can pass into the Profiler\n */\nfunction withProfiler<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  // We do not want to have `updateProps` given in options, it is instead filled through the HOC.\n  options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>,\n): React.FC<P> {\n  const componentDisplayName =\n    (options && options.name) || WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <Profiler {...options} name={componentDisplayName} updateProps={props}>\n      <WrappedComponent {...props} />\n    </Profiler>\n  );\n\n  Wrapped.displayName = `profiler(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\n/**\n *\n * `useProfiler` is a React hook that profiles a React component.\n *\n * Requires React 16.8 or above.\n * @param name displayName of component being profiled\n */\nfunction useProfiler(\n  name: string,\n  options: { disabled?: boolean; hasRenderSpan?: boolean } = {\n    disabled: false,\n    hasRenderSpan: true,\n  },\n): void {\n  const [mountSpan] = React.useState(() => {\n    if (options && options.disabled) {\n      return undefined;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      return activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n\n    return undefined;\n  });\n\n  React.useEffect(() => {\n    if (mountSpan) {\n      mountSpan.finish();\n    }\n\n    return (): void => {\n      if (mountSpan && options.hasRenderSpan) {\n        mountSpan.startChild({\n          description: `<${name}>`,\n          endTimestamp: timestampWithMs(),\n          op: REACT_RENDER_OP,\n          startTimestamp: mountSpan.endTimestamp,\n        });\n      }\n    };\n    // We only want this to run once.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n}\n\nexport { withProfiler, Profiler, useProfiler };\n\n/** Grabs active transaction off scope */\nexport function getActiveTransaction<T extends Transaction>(hub: Hub = getCurrentHub()): T | undefined {\n  if (hub) {\n    const scope = hub.getScope();\n    if (scope) {\n      return scope.getTransaction() as T | undefined;\n    }\n  }\n\n  return undefined;\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA;;;AA0BA;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FA;;AAEA;;;;;;;;AAQA;;;;AAIA;;;;;;;;;;;;;;;;AAgBA;;AAEA;;;;;;;AAOA;;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;AAIA;;;;;;;;;;AAUA;;;;;;"}
+{"version":3,"file":"profiler.js","sources":["../../src/profiler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { getCurrentHub, Hub } from '@sentry/browser';\nimport { Span, Transaction } from '@sentry/types';\nimport { timestampWithMs } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { REACT_MOUNT_OP, REACT_RENDER_OP, REACT_UPDATE_OP } from './constants';\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type ProfilerProps = {\n  // The name of the component being profiled.\n  name: string;\n  // If the Profiler is disabled. False by default. This is useful if you want to disable profilers\n  // in certain environments.\n  disabled?: boolean;\n  // If time component is on page should be displayed as spans. True by default.\n  includeRender?: boolean;\n  // If component updates should be displayed as spans. True by default.\n  includeUpdates?: boolean;\n  // props given to component being profiled.\n  updateProps: { [key: string]: unknown };\n};\n\n/**\n * The Profiler component leverages Sentry's Tracing integration to generate\n * spans based on component lifecycles.\n */\nclass Profiler extends React.Component<ProfilerProps> {\n  /**\n   * The span of the mount activity\n   * Made protected for the React Native SDK to access\n   */\n  protected _mountSpan: Span | undefined = undefined;\n  /**\n   * The span that represents the duration of time between shouldComponentUpdate and componentDidUpdate\n   */\n  protected _updateSpan: Span | undefined = undefined;\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  public static defaultProps: Partial<ProfilerProps> = {\n    disabled: false,\n    includeRender: true,\n    includeUpdates: true,\n  };\n\n  public constructor(props: ProfilerProps) {\n    super(props);\n    const { name, disabled = false } = this.props;\n\n    if (disabled) {\n      return;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      this._mountSpan = activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n  }\n\n  // If a component mounted, we can finish the mount activity.\n  public componentDidMount(): void {\n    if (this._mountSpan) {\n      this._mountSpan.finish();\n    }\n  }\n\n  public shouldComponentUpdate({ updateProps, includeUpdates = true }: ProfilerProps): boolean {\n    // Only generate an update span if includeUpdates is true, if there is a valid mountSpan,\n    // and if the updateProps have changed. It is ok to not do a deep equality check here as it is expensive.\n    // We are just trying to give baseline clues for further investigation.\n    if (includeUpdates && this._mountSpan && updateProps !== this.props.updateProps) {\n      // See what props haved changed between the previous props, and the current props. This is\n      // set as data on the span. We just store the prop keys as the values could be potenially very large.\n      const changedProps = Object.keys(updateProps).filter(k => updateProps[k] !== this.props.updateProps[k]);\n      if (changedProps.length > 0) {\n        const now = timestampWithMs();\n        this._updateSpan = this._mountSpan.startChild({\n          data: {\n            changedProps,\n          },\n          description: `<${this.props.name}>`,\n          op: REACT_UPDATE_OP,\n          startTimestamp: now,\n        });\n      }\n    }\n\n    return true;\n  }\n\n  public componentDidUpdate(): void {\n    if (this._updateSpan) {\n      this._updateSpan.finish();\n      this._updateSpan = undefined;\n    }\n  }\n\n  // If a component is unmounted, we can say it is no longer on the screen.\n  // This means we can finish the span representing the component render.\n  public componentWillUnmount(): void {\n    const { name, includeRender = true } = this.props;\n\n    if (this._mountSpan && includeRender) {\n      // If we were able to obtain the spanId of the mount activity, we should set the\n      // next activity as a child to the component mount activity.\n      this._mountSpan.startChild({\n        description: `<${name}>`,\n        endTimestamp: timestampWithMs(),\n        op: REACT_RENDER_OP,\n        startTimestamp: this._mountSpan.endTimestamp,\n      });\n    }\n  }\n\n  public render(): React.ReactNode {\n    return this.props.children;\n  }\n}\n\n/**\n * withProfiler is a higher order component that wraps a\n * component in a {@link Profiler} component. It is recommended that\n * the higher order component be used over the regular {@link Profiler} component.\n *\n * @param WrappedComponent component that is wrapped by Profiler\n * @param options the {@link ProfilerProps} you can pass into the Profiler\n */\nfunction withProfiler<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  // We do not want to have `updateProps` given in options, it is instead filled through the HOC.\n  options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>,\n): React.FC<P> {\n  const componentDisplayName =\n    (options && options.name) || WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <Profiler {...options} name={componentDisplayName} updateProps={props}>\n      <WrappedComponent {...props} />\n    </Profiler>\n  );\n\n  Wrapped.displayName = `profiler(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\n/**\n *\n * `useProfiler` is a React hook that profiles a React component.\n *\n * Requires React 16.8 or above.\n * @param name displayName of component being profiled\n */\nfunction useProfiler(\n  name: string,\n  options: { disabled?: boolean; hasRenderSpan?: boolean } = {\n    disabled: false,\n    hasRenderSpan: true,\n  },\n): void {\n  const [mountSpan] = React.useState(() => {\n    if (options && options.disabled) {\n      return undefined;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      return activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n\n    return undefined;\n  });\n\n  React.useEffect(() => {\n    if (mountSpan) {\n      mountSpan.finish();\n    }\n\n    return (): void => {\n      if (mountSpan && options.hasRenderSpan) {\n        mountSpan.startChild({\n          description: `<${name}>`,\n          endTimestamp: timestampWithMs(),\n          op: REACT_RENDER_OP,\n          startTimestamp: mountSpan.endTimestamp,\n        });\n      }\n    };\n    // We only want this to run once.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n}\n\nexport { withProfiler, Profiler, useProfiler };\n\n/** Grabs active transaction off scope */\nexport function getActiveTransaction<T extends Transaction>(hub: Hub = getCurrentHub()): T | undefined {\n  if (hub) {\n    const scope = hub.getScope();\n    if (scope) {\n      return scope.getTransaction() as T | undefined;\n    }\n  }\n\n  return undefined;\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA;;;;AA0BA;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FA;;AAEA;;;;;;;;AAQA;;;;AAIA;;;;;;;;;;;;;;;;AAgBA;;AAEA;;;;;;;AAOA;;;;;;AAMA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA;;AAIA;;;;;;;;;;AAUA;;;;;;"}

package/cjs/reactrouter.js

@@ -16,6 +16,9 @@ var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packag
 
 // We need to disable eslint no-explict-any because any is required for the
 // react-router typings.
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/* eslint-enable @typescript-eslint/no-explicit-any */
 
 var global = utils.getGlobalObject();
 
@@ -67,7 +70,8 @@ function createReactRouterInstrumentation(
     }
 
     var branches = matchRoutes(allRoutes, pathname, matchPath);
-        for (let x = 0; x < branches.length; x++) {
+    // eslint-disable-next-line @typescript-eslint/prefer-for-of
+    for (let x = 0; x < branches.length; x++) {
       if (branches[x].match.isExact) {
         return [branches[x].match.path, 'route'];
       }
@@ -151,6 +155,7 @@ function computeRootMatch(pathname) {
   return { path: '/', url: '/', params: {}, isExact: pathname === '/' };
 }
 
+/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */
 function withSentryRouting(Route) {
   var componentDisplayName = (Route ).displayName || (Route ).name;
 
@@ -172,6 +177,7 @@ function withSentryRouting(Route) {
   // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164
   return WrappedRoute;
 }
+/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */
 
 exports.reactRouterV4Instrumentation = reactRouterV4Instrumentation;
 exports.reactRouterV5Instrumentation = reactRouterV5Instrumentation;

package/cjs/reactrouter.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactrouter.js","sources":["../../src/reactrouter.tsx"],"sourcesContent":["import { Transaction, TransactionSource } from '@sentry/types';\nimport { getGlobalObject } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { Action, Location, ReactRouterInstrumentation } from './types';\n\n// We need to disable eslint no-explict-any because any is required for the\n// react-router typings.\n/* eslint-disable @typescript-eslint/no-explicit-any */\ntype Match = { path: string; url: string; params: Record<string, any>; isExact: boolean };\n\nexport type RouterHistory = {\n  location?: Location;\n  listen?(cb: (location: Location, action: Action) => void): void;\n} & Record<string, any>;\n\nexport type RouteConfig = {\n  [propName: string]: any;\n  path?: string | string[];\n  exact?: boolean;\n  component?: JSX.Element;\n  routes?: RouteConfig[];\n};\n\ntype MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;\n/* eslint-enable @typescript-eslint/no-explicit-any */\n\nconst global = getGlobalObject<Window>();\n\nlet activeTransaction: Transaction | undefined;\n\nexport function reactRouterV4Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);\n}\n\nexport function reactRouterV5Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);\n}\n\nfunction createReactRouterInstrumentation(\n  history: RouterHistory,\n  name: string,\n  allRoutes: RouteConfig[] = [],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  function getInitPathName(): string | undefined {\n    if (history && history.location) {\n      return history.location.pathname;\n    }\n\n    if (global && global.location) {\n      return global.location.pathname;\n    }\n\n    return undefined;\n  }\n\n  /**\n   * Normalizes a transaction name. Returns the new name as well as the\n   * source of the transaction.\n   *\n   * @param pathname The initial pathname we normalize\n   */\n  function normalizeTransactionName(pathname: string): [string, TransactionSource] {\n    if (allRoutes.length === 0 || !matchPath) {\n      return [pathname, 'url'];\n    }\n\n    const branches = matchRoutes(allRoutes, pathname, matchPath);\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      if (branches[x].match.isExact) {\n        return [branches[x].match.path, 'route'];\n      }\n    }\n\n    return [pathname, 'url'];\n  }\n\n  const tags = {\n    'routing.instrumentation': name,\n  };\n\n  return (customStartTransaction, startTransactionOnPageLoad = true, startTransactionOnLocationChange = true): void => {\n    const initPathName = getInitPathName();\n    if (startTransactionOnPageLoad && initPathName) {\n      const [name, source] = normalizeTransactionName(initPathName);\n      activeTransaction = customStartTransaction({\n        name,\n        op: 'pageload',\n        tags,\n        metadata: {\n          source,\n        },\n      });\n    }\n\n    if (startTransactionOnLocationChange && history.listen) {\n      history.listen((location, action) => {\n        if (action && (action === 'PUSH' || action === 'POP')) {\n          if (activeTransaction) {\n            activeTransaction.finish();\n          }\n\n          const [name, source] = normalizeTransactionName(location.pathname);\n          activeTransaction = customStartTransaction({\n            name,\n            op: 'navigation',\n            tags,\n            metadata: {\n              source,\n            },\n          });\n        }\n      });\n    }\n  };\n}\n\n/**\n * Matches a set of routes to a pathname\n * Based on implementation from\n */\nfunction matchRoutes(\n  routes: RouteConfig[],\n  pathname: string,\n  matchPath: MatchPath,\n  branch: Array<{ route: RouteConfig; match: Match }> = [],\n): Array<{ route: RouteConfig; match: Match }> {\n  routes.some(route => {\n    const match = route.path\n      ? matchPath(pathname, route)\n      : branch.length\n      ? branch[branch.length - 1].match // use parent match\n      : computeRootMatch(pathname); // use default \"root\" match\n\n    if (match) {\n      branch.push({ route, match });\n\n      if (route.routes) {\n        matchRoutes(route.routes, pathname, matchPath, branch);\n      }\n    }\n\n    return !!match;\n  });\n\n  return branch;\n}\n\nfunction computeRootMatch(pathname: string): Match {\n  return { path: '/', url: '/', params: {}, isExact: pathname === '/' };\n}\n\n/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\nexport function withSentryRouting<P extends Record<string, any>, R extends React.ComponentType<P>>(Route: R): R {\n  const componentDisplayName = (Route as any).displayName || (Route as any).name;\n\n  const WrappedRoute: React.FC<P> = (props: P) => {\n    if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {\n      activeTransaction.setName(props.computedMatch.path, 'route');\n    }\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params:\n    // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n    return <Route {...props} />;\n  };\n\n  WrappedRoute.displayName = `sentryRoute(${componentDisplayName})`;\n  hoistNonReactStatics(WrappedRoute, Route);\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params:\n  // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n  return WrappedRoute;\n}\n/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;;AAOA;AACA;;AAoBA;;AAEA;;;;;;AAMA;;AAEA;;;;;;AAMA;;AAEA;;AAEA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyEA;;AAEA;;;;AAIA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;AAoBA;;AAEA;;AAEA;;;;;;;;;;;;;;;;;;;;;;AAuBA;;;;"}
+{"version":3,"file":"reactrouter.js","sources":["../../src/reactrouter.tsx"],"sourcesContent":["import { Transaction, TransactionSource } from '@sentry/types';\nimport { getGlobalObject } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { Action, Location, ReactRouterInstrumentation } from './types';\n\n// We need to disable eslint no-explict-any because any is required for the\n// react-router typings.\n/* eslint-disable @typescript-eslint/no-explicit-any */\ntype Match = { path: string; url: string; params: Record<string, any>; isExact: boolean };\n\nexport type RouterHistory = {\n  location?: Location;\n  listen?(cb: (location: Location, action: Action) => void): void;\n} & Record<string, any>;\n\nexport type RouteConfig = {\n  [propName: string]: any;\n  path?: string | string[];\n  exact?: boolean;\n  component?: JSX.Element;\n  routes?: RouteConfig[];\n};\n\ntype MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;\n/* eslint-enable @typescript-eslint/no-explicit-any */\n\nconst global = getGlobalObject<Window>();\n\nlet activeTransaction: Transaction | undefined;\n\nexport function reactRouterV4Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);\n}\n\nexport function reactRouterV5Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);\n}\n\nfunction createReactRouterInstrumentation(\n  history: RouterHistory,\n  name: string,\n  allRoutes: RouteConfig[] = [],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  function getInitPathName(): string | undefined {\n    if (history && history.location) {\n      return history.location.pathname;\n    }\n\n    if (global && global.location) {\n      return global.location.pathname;\n    }\n\n    return undefined;\n  }\n\n  /**\n   * Normalizes a transaction name. Returns the new name as well as the\n   * source of the transaction.\n   *\n   * @param pathname The initial pathname we normalize\n   */\n  function normalizeTransactionName(pathname: string): [string, TransactionSource] {\n    if (allRoutes.length === 0 || !matchPath) {\n      return [pathname, 'url'];\n    }\n\n    const branches = matchRoutes(allRoutes, pathname, matchPath);\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      if (branches[x].match.isExact) {\n        return [branches[x].match.path, 'route'];\n      }\n    }\n\n    return [pathname, 'url'];\n  }\n\n  const tags = {\n    'routing.instrumentation': name,\n  };\n\n  return (customStartTransaction, startTransactionOnPageLoad = true, startTransactionOnLocationChange = true): void => {\n    const initPathName = getInitPathName();\n    if (startTransactionOnPageLoad && initPathName) {\n      const [name, source] = normalizeTransactionName(initPathName);\n      activeTransaction = customStartTransaction({\n        name,\n        op: 'pageload',\n        tags,\n        metadata: {\n          source,\n        },\n      });\n    }\n\n    if (startTransactionOnLocationChange && history.listen) {\n      history.listen((location, action) => {\n        if (action && (action === 'PUSH' || action === 'POP')) {\n          if (activeTransaction) {\n            activeTransaction.finish();\n          }\n\n          const [name, source] = normalizeTransactionName(location.pathname);\n          activeTransaction = customStartTransaction({\n            name,\n            op: 'navigation',\n            tags,\n            metadata: {\n              source,\n            },\n          });\n        }\n      });\n    }\n  };\n}\n\n/**\n * Matches a set of routes to a pathname\n * Based on implementation from\n */\nfunction matchRoutes(\n  routes: RouteConfig[],\n  pathname: string,\n  matchPath: MatchPath,\n  branch: Array<{ route: RouteConfig; match: Match }> = [],\n): Array<{ route: RouteConfig; match: Match }> {\n  routes.some(route => {\n    const match = route.path\n      ? matchPath(pathname, route)\n      : branch.length\n      ? branch[branch.length - 1].match // use parent match\n      : computeRootMatch(pathname); // use default \"root\" match\n\n    if (match) {\n      branch.push({ route, match });\n\n      if (route.routes) {\n        matchRoutes(route.routes, pathname, matchPath, branch);\n      }\n    }\n\n    return !!match;\n  });\n\n  return branch;\n}\n\nfunction computeRootMatch(pathname: string): Match {\n  return { path: '/', url: '/', params: {}, isExact: pathname === '/' };\n}\n\n/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\nexport function withSentryRouting<P extends Record<string, any>, R extends React.ComponentType<P>>(Route: R): R {\n  const componentDisplayName = (Route as any).displayName || (Route as any).name;\n\n  const WrappedRoute: React.FC<P> = (props: P) => {\n    if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {\n      activeTransaction.setName(props.computedMatch.path, 'route');\n    }\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params:\n    // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n    return <Route {...props} />;\n  };\n\n  WrappedRoute.displayName = `sentryRoute(${componentDisplayName})`;\n  hoistNonReactStatics(WrappedRoute, Route);\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params:\n  // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n  return WrappedRoute;\n}\n/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA;;AAOA;AACA;AACA;;AAiBA;;AAEA;;AAEA;;;;;;AAMA;;AAEA;;;;;;AAMA;;AAEA;;AAEA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyEA;;AAEA;;;;AAIA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;AAoBA;;AAEA;;AAEA;;AAEA;;;;;;;;;;;;;;;;;;;;;AAqBA;AACA;;;;"}

package/cjs/reactrouterv6.js

@@ -77,7 +77,8 @@ function getNormalizedName(
 
   let pathBuilder = '';
   if (branches) {
-        for (let x = 0; x < branches.length; x++) {
+    // eslint-disable-next-line @typescript-eslint/prefer-for-of
+    for (let x = 0; x < branches.length; x++) {
       var branch = branches[x];
       var route = branch.route;
       if (route) {
@@ -173,7 +174,8 @@ function withSentryReactRouterV6Routing(Routes) {
       isBaseLocation = true;
 
       updatePageloadTransaction(location, routes);
-          }, [props.children]);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.children]);
 
     _useEffect(() => {
       handleNavigation(location, routes, navigationType, isBaseLocation);

package/cjs/reactrouterv6.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactrouterv6.js","sources":["../../src/reactrouterv6.tsx"],"sourcesContent":["// Inspired from Donnie McNeal's solution:\n// https://gist.github.com/wontondon/e8c4bdf2888875e4c755712e99279536\n\nimport { Transaction, TransactionContext, TransactionSource } from '@sentry/types';\nimport { getGlobalObject, getNumberOfUrlSegments, logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport React from 'react';\n\nimport { Action, Location } from './types';\n\ninterface RouteObject {\n  caseSensitive?: boolean;\n  children?: RouteObject[];\n  element?: React.ReactNode;\n  index?: boolean;\n  path?: string;\n}\n\ntype Params<Key extends string = string> = {\n  readonly [key in Key]: string | undefined;\n};\n\ntype UseRoutes = (routes: RouteObject[], locationArg?: Partial<Location> | string) => React.ReactElement | null;\n\n// https://github.com/remix-run/react-router/blob/9fa54d643134cd75a0335581a75db8100ed42828/packages/react-router/lib/router.ts#L114-L134\ninterface RouteMatch<ParamKey extends string = string> {\n  /**\n   * The names and values of dynamic parameters in the URL.\n   */\n  params: Params<ParamKey>;\n  /**\n   * The portion of the URL pathname that was matched.\n   */\n  pathname: string;\n  /**\n   * The portion of the URL pathname that was matched before child routes.\n   */\n  pathnameBase: string;\n  /**\n   * The route object that was used to match.\n   */\n  route: RouteObject;\n}\n\ntype UseEffect = (cb: () => void, deps: unknown[]) => void;\ntype UseLocation = () => Location;\ntype UseNavigationType = () => Action;\ntype CreateRoutesFromChildren = (children: JSX.Element[]) => RouteObject[];\ntype MatchRoutes = (routes: RouteObject[], location: Location) => RouteMatch[] | null;\n\nlet activeTransaction: Transaction | undefined;\n\nlet _useEffect: UseEffect;\nlet _useLocation: UseLocation;\nlet _useNavigationType: UseNavigationType;\nlet _createRoutesFromChildren: CreateRoutesFromChildren;\nlet _matchRoutes: MatchRoutes;\nlet _customStartTransaction: (context: TransactionContext) => Transaction | undefined;\nlet _startTransactionOnLocationChange: boolean;\n\nconst global = getGlobalObject<Window>();\n\nconst SENTRY_TAGS = {\n  'routing.instrumentation': 'react-router-v6',\n};\n\nexport function reactRouterV6Instrumentation(\n  useEffect: UseEffect,\n  useLocation: UseLocation,\n  useNavigationType: UseNavigationType,\n  createRoutesFromChildren: CreateRoutesFromChildren,\n  matchRoutes: MatchRoutes,\n) {\n  return (\n    customStartTransaction: (context: TransactionContext) => Transaction | undefined,\n    startTransactionOnPageLoad = true,\n    startTransactionOnLocationChange = true,\n  ): void => {\n    const initPathName = global && global.location && global.location.pathname;\n    if (startTransactionOnPageLoad && initPathName) {\n      activeTransaction = customStartTransaction({\n        name: initPathName,\n        op: 'pageload',\n        tags: SENTRY_TAGS,\n        metadata: {\n          source: 'url',\n        },\n      });\n    }\n\n    _useEffect = useEffect;\n    _useLocation = useLocation;\n    _useNavigationType = useNavigationType;\n    _matchRoutes = matchRoutes;\n    _createRoutesFromChildren = createRoutesFromChildren;\n\n    _customStartTransaction = customStartTransaction;\n    _startTransactionOnLocationChange = startTransactionOnLocationChange;\n  };\n}\n\nfunction getNormalizedName(\n  routes: RouteObject[],\n  location: Location,\n  matchRoutes: MatchRoutes,\n): [string, TransactionSource] {\n  if (!routes || routes.length === 0 || !matchRoutes) {\n    return [location.pathname, 'url'];\n  }\n\n  const branches = matchRoutes(routes, location);\n\n  let pathBuilder = '';\n  if (branches) {\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      const branch = branches[x];\n      const route = branch.route;\n      if (route) {\n        // Early return if index route\n        if (route.index) {\n          return [branch.pathname, 'route'];\n        }\n\n        const path = route.path;\n        if (path) {\n          const newPath = path[0] === '/' ? path : `/${path}`;\n          pathBuilder += newPath;\n          if (branch.pathname === location.pathname) {\n            // If the route defined on the element is something like\n            // <Route path=\"/stores/:storeId/products/:productId\" element={<div>Product</div>} />\n            // We should check against the branch.pathname for the number of / seperators\n            if (getNumberOfUrlSegments(pathBuilder) !== getNumberOfUrlSegments(branch.pathname)) {\n              return [newPath, 'route'];\n            }\n            return [pathBuilder, 'route'];\n          }\n        }\n      }\n    }\n  }\n\n  return [location.pathname, 'url'];\n}\n\nfunction updatePageloadTransaction(location: Location, routes: RouteObject[]): void {\n  if (activeTransaction) {\n    activeTransaction.setName(...getNormalizedName(routes, location, _matchRoutes));\n  }\n}\n\nfunction handleNavigation(\n  location: Location,\n  routes: RouteObject[],\n  navigationType: Action,\n  isBaseLocation: boolean,\n): void {\n  if (isBaseLocation) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    return;\n  }\n\n  if (_startTransactionOnLocationChange && (navigationType === 'PUSH' || navigationType === 'POP')) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    const [name, source] = getNormalizedName(routes, location, _matchRoutes);\n    activeTransaction = _customStartTransaction({\n      name,\n      op: 'navigation',\n      tags: SENTRY_TAGS,\n      metadata: {\n        source,\n      },\n    });\n  }\n}\n\nexport function withSentryReactRouterV6Routing<P extends Record<string, any>, R extends React.FC<P>>(Routes: R): R {\n  if (\n    !_useEffect ||\n    !_useLocation ||\n    !_useNavigationType ||\n    !_createRoutesFromChildren ||\n    !_matchRoutes ||\n    !_customStartTransaction\n  ) {\n    __DEBUG_BUILD__ &&\n      logger.warn('reactRouterV6Instrumentation was unable to wrap Routes because of one or more missing parameters.');\n\n    return Routes;\n  }\n\n  let isBaseLocation: boolean = false;\n  let routes: RouteObject[];\n\n  const SentryRoutes: React.FC<P> = (props: P) => {\n    const location = _useLocation();\n    const navigationType = _useNavigationType();\n\n    _useEffect(() => {\n      // Performance concern:\n      // This is repeated when <Routes /> is rendered.\n      routes = _createRoutesFromChildren(props.children);\n      isBaseLocation = true;\n\n      updatePageloadTransaction(location, routes);\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [props.children]);\n\n    _useEffect(() => {\n      handleNavigation(location, routes, navigationType, isBaseLocation);\n    }, [props.children, location, navigationType, isBaseLocation]);\n\n    isBaseLocation = false;\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params\n    return <Routes {...props} />;\n  };\n\n  hoistNonReactStatics(SentryRoutes, Routes);\n\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params\n  return SentryRoutes;\n}\n\nexport function wrapUseRoutes(origUseRoutes: UseRoutes): UseRoutes {\n  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes || !_customStartTransaction) {\n    __DEBUG_BUILD__ &&\n      logger.warn(\n        'reactRouterV6Instrumentation was unable to wrap `useRoutes` because of one or more missing parameters.',\n      );\n\n    return origUseRoutes;\n  }\n\n  let isBaseLocation: boolean = false;\n\n  return (routes: RouteObject[], location?: Partial<Location> | string): React.ReactElement | null => {\n    const SentryRoutes: React.FC<unknown> = (props: unknown) => {\n      const Routes = origUseRoutes(routes, location);\n\n      const locationArgObject = typeof location === 'string' ? { pathname: location } : location;\n      const locationObject = (locationArgObject as Location) || _useLocation();\n      const navigationType = _useNavigationType();\n\n      _useEffect(() => {\n        isBaseLocation = true;\n\n        updatePageloadTransaction(locationObject, routes);\n      }, [props]);\n\n      _useEffect(() => {\n        handleNavigation(locationObject, routes, navigationType, isBaseLocation);\n      }, [props, locationObject, navigationType, isBaseLocation]);\n\n      isBaseLocation = false;\n\n      return Routes;\n    };\n\n    return <SentryRoutes />;\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAAA;;AAkDA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA;;AAEA;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA;;AAEA;;;;AAIA;;AAEA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;AAwBA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA;;;;"}
+{"version":3,"file":"reactrouterv6.js","sources":["../../src/reactrouterv6.tsx"],"sourcesContent":["// Inspired from Donnie McNeal's solution:\n// https://gist.github.com/wontondon/e8c4bdf2888875e4c755712e99279536\n\nimport { Transaction, TransactionContext, TransactionSource } from '@sentry/types';\nimport { getGlobalObject, getNumberOfUrlSegments, logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport React from 'react';\n\nimport { Action, Location } from './types';\n\ninterface RouteObject {\n  caseSensitive?: boolean;\n  children?: RouteObject[];\n  element?: React.ReactNode;\n  index?: boolean;\n  path?: string;\n}\n\ntype Params<Key extends string = string> = {\n  readonly [key in Key]: string | undefined;\n};\n\ntype UseRoutes = (routes: RouteObject[], locationArg?: Partial<Location> | string) => React.ReactElement | null;\n\n// https://github.com/remix-run/react-router/blob/9fa54d643134cd75a0335581a75db8100ed42828/packages/react-router/lib/router.ts#L114-L134\ninterface RouteMatch<ParamKey extends string = string> {\n  /**\n   * The names and values of dynamic parameters in the URL.\n   */\n  params: Params<ParamKey>;\n  /**\n   * The portion of the URL pathname that was matched.\n   */\n  pathname: string;\n  /**\n   * The portion of the URL pathname that was matched before child routes.\n   */\n  pathnameBase: string;\n  /**\n   * The route object that was used to match.\n   */\n  route: RouteObject;\n}\n\ntype UseEffect = (cb: () => void, deps: unknown[]) => void;\ntype UseLocation = () => Location;\ntype UseNavigationType = () => Action;\ntype CreateRoutesFromChildren = (children: JSX.Element[]) => RouteObject[];\ntype MatchRoutes = (routes: RouteObject[], location: Location) => RouteMatch[] | null;\n\nlet activeTransaction: Transaction | undefined;\n\nlet _useEffect: UseEffect;\nlet _useLocation: UseLocation;\nlet _useNavigationType: UseNavigationType;\nlet _createRoutesFromChildren: CreateRoutesFromChildren;\nlet _matchRoutes: MatchRoutes;\nlet _customStartTransaction: (context: TransactionContext) => Transaction | undefined;\nlet _startTransactionOnLocationChange: boolean;\n\nconst global = getGlobalObject<Window>();\n\nconst SENTRY_TAGS = {\n  'routing.instrumentation': 'react-router-v6',\n};\n\nexport function reactRouterV6Instrumentation(\n  useEffect: UseEffect,\n  useLocation: UseLocation,\n  useNavigationType: UseNavigationType,\n  createRoutesFromChildren: CreateRoutesFromChildren,\n  matchRoutes: MatchRoutes,\n) {\n  return (\n    customStartTransaction: (context: TransactionContext) => Transaction | undefined,\n    startTransactionOnPageLoad = true,\n    startTransactionOnLocationChange = true,\n  ): void => {\n    const initPathName = global && global.location && global.location.pathname;\n    if (startTransactionOnPageLoad && initPathName) {\n      activeTransaction = customStartTransaction({\n        name: initPathName,\n        op: 'pageload',\n        tags: SENTRY_TAGS,\n        metadata: {\n          source: 'url',\n        },\n      });\n    }\n\n    _useEffect = useEffect;\n    _useLocation = useLocation;\n    _useNavigationType = useNavigationType;\n    _matchRoutes = matchRoutes;\n    _createRoutesFromChildren = createRoutesFromChildren;\n\n    _customStartTransaction = customStartTransaction;\n    _startTransactionOnLocationChange = startTransactionOnLocationChange;\n  };\n}\n\nfunction getNormalizedName(\n  routes: RouteObject[],\n  location: Location,\n  matchRoutes: MatchRoutes,\n): [string, TransactionSource] {\n  if (!routes || routes.length === 0 || !matchRoutes) {\n    return [location.pathname, 'url'];\n  }\n\n  const branches = matchRoutes(routes, location);\n\n  let pathBuilder = '';\n  if (branches) {\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      const branch = branches[x];\n      const route = branch.route;\n      if (route) {\n        // Early return if index route\n        if (route.index) {\n          return [branch.pathname, 'route'];\n        }\n\n        const path = route.path;\n        if (path) {\n          const newPath = path[0] === '/' ? path : `/${path}`;\n          pathBuilder += newPath;\n          if (branch.pathname === location.pathname) {\n            // If the route defined on the element is something like\n            // <Route path=\"/stores/:storeId/products/:productId\" element={<div>Product</div>} />\n            // We should check against the branch.pathname for the number of / seperators\n            if (getNumberOfUrlSegments(pathBuilder) !== getNumberOfUrlSegments(branch.pathname)) {\n              return [newPath, 'route'];\n            }\n            return [pathBuilder, 'route'];\n          }\n        }\n      }\n    }\n  }\n\n  return [location.pathname, 'url'];\n}\n\nfunction updatePageloadTransaction(location: Location, routes: RouteObject[]): void {\n  if (activeTransaction) {\n    activeTransaction.setName(...getNormalizedName(routes, location, _matchRoutes));\n  }\n}\n\nfunction handleNavigation(\n  location: Location,\n  routes: RouteObject[],\n  navigationType: Action,\n  isBaseLocation: boolean,\n): void {\n  if (isBaseLocation) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    return;\n  }\n\n  if (_startTransactionOnLocationChange && (navigationType === 'PUSH' || navigationType === 'POP')) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    const [name, source] = getNormalizedName(routes, location, _matchRoutes);\n    activeTransaction = _customStartTransaction({\n      name,\n      op: 'navigation',\n      tags: SENTRY_TAGS,\n      metadata: {\n        source,\n      },\n    });\n  }\n}\n\nexport function withSentryReactRouterV6Routing<P extends Record<string, any>, R extends React.FC<P>>(Routes: R): R {\n  if (\n    !_useEffect ||\n    !_useLocation ||\n    !_useNavigationType ||\n    !_createRoutesFromChildren ||\n    !_matchRoutes ||\n    !_customStartTransaction\n  ) {\n    __DEBUG_BUILD__ &&\n      logger.warn('reactRouterV6Instrumentation was unable to wrap Routes because of one or more missing parameters.');\n\n    return Routes;\n  }\n\n  let isBaseLocation: boolean = false;\n  let routes: RouteObject[];\n\n  const SentryRoutes: React.FC<P> = (props: P) => {\n    const location = _useLocation();\n    const navigationType = _useNavigationType();\n\n    _useEffect(() => {\n      // Performance concern:\n      // This is repeated when <Routes /> is rendered.\n      routes = _createRoutesFromChildren(props.children);\n      isBaseLocation = true;\n\n      updatePageloadTransaction(location, routes);\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [props.children]);\n\n    _useEffect(() => {\n      handleNavigation(location, routes, navigationType, isBaseLocation);\n    }, [props.children, location, navigationType, isBaseLocation]);\n\n    isBaseLocation = false;\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params\n    return <Routes {...props} />;\n  };\n\n  hoistNonReactStatics(SentryRoutes, Routes);\n\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params\n  return SentryRoutes;\n}\n\nexport function wrapUseRoutes(origUseRoutes: UseRoutes): UseRoutes {\n  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes || !_customStartTransaction) {\n    __DEBUG_BUILD__ &&\n      logger.warn(\n        'reactRouterV6Instrumentation was unable to wrap `useRoutes` because of one or more missing parameters.',\n      );\n\n    return origUseRoutes;\n  }\n\n  let isBaseLocation: boolean = false;\n\n  return (routes: RouteObject[], location?: Partial<Location> | string): React.ReactElement | null => {\n    const SentryRoutes: React.FC<unknown> = (props: unknown) => {\n      const Routes = origUseRoutes(routes, location);\n\n      const locationArgObject = typeof location === 'string' ? { pathname: location } : location;\n      const locationObject = (locationArgObject as Location) || _useLocation();\n      const navigationType = _useNavigationType();\n\n      _useEffect(() => {\n        isBaseLocation = true;\n\n        updatePageloadTransaction(locationObject, routes);\n      }, [props]);\n\n      _useEffect(() => {\n        handleNavigation(locationObject, routes, navigationType, isBaseLocation);\n      }, [props, locationObject, navigationType, isBaseLocation]);\n\n      isBaseLocation = false;\n\n      return Routes;\n    };\n\n    return <SentryRoutes />;\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAAA;;AAkDA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;;AAEA;;;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA;;AAEA;;;;AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA;;AAEA;;;;AAIA;;AAEA;;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;AAwBA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA;;;;"}

package/cjs/redux.js

@@ -2,6 +2,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var browser = require('@sentry/browser');
 
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
 var ACTION_BREADCRUMB_CATEGORY = 'redux.action';
 var ACTION_BREADCRUMB_TYPE = 'info';
 
@@ -47,7 +49,8 @@ function createReduxEnhancer(enhancerOptions) {
           }
 
           /* Allow user to configure scope with latest state */
-                    const { configureScopeWithState } = options;
+          // eslint-disable-next-line @typescript-eslint/unbound-method
+          const { configureScopeWithState } = options;
           if (typeof configureScopeWithState === 'function') {
             configureScopeWithState(scope, newState);
           }

package/cjs/redux.js.map

@@ -1 +1 @@
-{"version":3,"file":"redux.js","sources":["../../src/redux.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { configureScope } from '@sentry/browser';\nimport { Scope } from '@sentry/types';\n\ninterface Action<T = any> {\n  type: T;\n}\n\ninterface AnyAction extends Action {\n  [extraProps: string]: any;\n}\n\ntype Reducer<S = any, A extends Action = AnyAction> = (state: S | undefined, action: A) => S;\n\ntype Dispatch<A extends Action = AnyAction> = <T extends A>(action: T, ...extraArgs: any[]) => T;\n\ntype ExtendState<State, Extension> = [Extension] extends [never] ? State : State & Extension;\n\ntype Unsubscribe = () => void;\n\ninterface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {\n  dispatch: Dispatch<A>;\n  getState(): S;\n  subscribe(listener: () => void): Unsubscribe;\n  replaceReducer<NewState, NewActions extends Action>(\n    nextReducer: Reducer<NewState, NewActions>,\n  ): Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext;\n}\n\ndeclare const $CombinedState: unique symbol;\n\ntype CombinedState<S> = { readonly [$CombinedState]?: undefined } & S;\n\ntype PreloadedState<S> = Required<S> extends {\n  [$CombinedState]: undefined;\n}\n  ? S extends CombinedState<infer S1>\n    ? { [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K] }\n    : never\n  : { [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]> };\n\ntype StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <\n  S = any,\n  A extends Action = AnyAction,\n>(\n  reducer: Reducer<S, A>,\n  preloadedState?: PreloadedState<S>,\n) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;\n\nexport interface SentryEnhancerOptions<S = any> {\n  /**\n   * Transforms the state before attaching it to an event.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not attach the state.\n   */\n  stateTransformer(state: S | undefined): (S & any) | null;\n  /**\n   * Transforms the action before sending it as a breadcrumb.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not send the breadcrumb.\n   */\n  actionTransformer(action: AnyAction): AnyAction | null;\n  /**\n   * Called on every state update, configure the Sentry Scope with the redux state.\n   */\n  configureScopeWithState?(scope: Scope, state: S): void;\n}\n\nconst ACTION_BREADCRUMB_CATEGORY = 'redux.action';\nconst ACTION_BREADCRUMB_TYPE = 'info';\n\nconst defaultOptions: SentryEnhancerOptions = {\n  actionTransformer: action => action,\n  stateTransformer: state => state || null,\n};\n\n/**\n * Creates an enhancer that would be passed to Redux's createStore to log actions and the latest state to Sentry.\n *\n * @param enhancerOptions Options to pass to the enhancer\n */\nfunction createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>): any {\n  // Note: We return an any type as to not have type conflicts.\n  const options = {\n    ...defaultOptions,\n    ...enhancerOptions,\n  };\n\n  return (next: StoreEnhancerStoreCreator): StoreEnhancerStoreCreator =>\n    <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, initialState?: PreloadedState<S>) => {\n      const sentryReducer: Reducer<S, A> = (state, action): S => {\n        const newState = reducer(state, action);\n\n        configureScope(scope => {\n          /* Action breadcrumbs */\n          const transformedAction = options.actionTransformer(action);\n          if (typeof transformedAction !== 'undefined' && transformedAction !== null) {\n            scope.addBreadcrumb({\n              category: ACTION_BREADCRUMB_CATEGORY,\n              data: transformedAction,\n              type: ACTION_BREADCRUMB_TYPE,\n            });\n          }\n\n          /* Set latest state to scope */\n          const transformedState = options.stateTransformer(newState);\n          if (typeof transformedState !== 'undefined' && transformedState !== null) {\n            scope.setContext('state', { state: { type: 'redux', value: transformedState } });\n          } else {\n            scope.setContext('state', null);\n          }\n\n          /* Allow user to configure scope with latest state */\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          const { configureScopeWithState } = options;\n          if (typeof configureScopeWithState === 'function') {\n            configureScopeWithState(scope, newState);\n          }\n        });\n\n        return newState;\n      };\n\n      return next(sentryReducer, initialState);\n    };\n}\n\nexport { createReduxEnhancer };\n"],"names":[],"mappings":";;;;AAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;"}
+{"version":3,"file":"redux.js","sources":["../../src/redux.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { configureScope } from '@sentry/browser';\nimport { Scope } from '@sentry/types';\n\ninterface Action<T = any> {\n  type: T;\n}\n\ninterface AnyAction extends Action {\n  [extraProps: string]: any;\n}\n\ntype Reducer<S = any, A extends Action = AnyAction> = (state: S | undefined, action: A) => S;\n\ntype Dispatch<A extends Action = AnyAction> = <T extends A>(action: T, ...extraArgs: any[]) => T;\n\ntype ExtendState<State, Extension> = [Extension] extends [never] ? State : State & Extension;\n\ntype Unsubscribe = () => void;\n\ninterface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {\n  dispatch: Dispatch<A>;\n  getState(): S;\n  subscribe(listener: () => void): Unsubscribe;\n  replaceReducer<NewState, NewActions extends Action>(\n    nextReducer: Reducer<NewState, NewActions>,\n  ): Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext;\n}\n\ndeclare const $CombinedState: unique symbol;\n\ntype CombinedState<S> = { readonly [$CombinedState]?: undefined } & S;\n\ntype PreloadedState<S> = Required<S> extends {\n  [$CombinedState]: undefined;\n}\n  ? S extends CombinedState<infer S1>\n    ? { [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K] }\n    : never\n  : { [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]> };\n\ntype StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <\n  S = any,\n  A extends Action = AnyAction,\n>(\n  reducer: Reducer<S, A>,\n  preloadedState?: PreloadedState<S>,\n) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;\n\nexport interface SentryEnhancerOptions<S = any> {\n  /**\n   * Transforms the state before attaching it to an event.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not attach the state.\n   */\n  stateTransformer(state: S | undefined): (S & any) | null;\n  /**\n   * Transforms the action before sending it as a breadcrumb.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not send the breadcrumb.\n   */\n  actionTransformer(action: AnyAction): AnyAction | null;\n  /**\n   * Called on every state update, configure the Sentry Scope with the redux state.\n   */\n  configureScopeWithState?(scope: Scope, state: S): void;\n}\n\nconst ACTION_BREADCRUMB_CATEGORY = 'redux.action';\nconst ACTION_BREADCRUMB_TYPE = 'info';\n\nconst defaultOptions: SentryEnhancerOptions = {\n  actionTransformer: action => action,\n  stateTransformer: state => state || null,\n};\n\n/**\n * Creates an enhancer that would be passed to Redux's createStore to log actions and the latest state to Sentry.\n *\n * @param enhancerOptions Options to pass to the enhancer\n */\nfunction createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>): any {\n  // Note: We return an any type as to not have type conflicts.\n  const options = {\n    ...defaultOptions,\n    ...enhancerOptions,\n  };\n\n  return (next: StoreEnhancerStoreCreator): StoreEnhancerStoreCreator =>\n    <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, initialState?: PreloadedState<S>) => {\n      const sentryReducer: Reducer<S, A> = (state, action): S => {\n        const newState = reducer(state, action);\n\n        configureScope(scope => {\n          /* Action breadcrumbs */\n          const transformedAction = options.actionTransformer(action);\n          if (typeof transformedAction !== 'undefined' && transformedAction !== null) {\n            scope.addBreadcrumb({\n              category: ACTION_BREADCRUMB_CATEGORY,\n              data: transformedAction,\n              type: ACTION_BREADCRUMB_TYPE,\n            });\n          }\n\n          /* Set latest state to scope */\n          const transformedState = options.stateTransformer(newState);\n          if (typeof transformedState !== 'undefined' && transformedState !== null) {\n            scope.setContext('state', { state: { type: 'redux', value: transformedState } });\n          } else {\n            scope.setContext('state', null);\n          }\n\n          /* Allow user to configure scope with latest state */\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          const { configureScopeWithState } = options;\n          if (typeof configureScopeWithState === 'function') {\n            configureScopeWithState(scope, newState);\n          }\n        });\n\n        return newState;\n      };\n\n      return next(sentryReducer, initialState);\n    };\n}\n\nexport { createReduxEnhancer };\n"],"names":[],"mappings":";;;;AAAA;;AAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;"}

package/esm/errorboundary.js

@@ -114,11 +114,13 @@ class ErrorBoundary extends React.Component {constructor(...args) { super(...arg
   }
 }
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function withErrorBoundary(
   WrappedComponent,
   errorBoundaryOptions,
 ) {
-    var componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+  var componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;
 
   var Wrapped = (props) => (
     React.createElement(ErrorBoundary, { ...errorBoundaryOptions, __self: this, __source: {fileName: _jsxFileName, lineNumber: 168}}
@@ -126,7 +128,8 @@ function withErrorBoundary(
     )
   );
 
-    Wrapped.displayName = `errorBoundary(${componentDisplayName})`;
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;
 
   // Copy over static methods from Wrapped component to Profiler HOC
   // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over

package/esm/errorboundary.js.map

@@ -1 +1 @@
-{"version":3,"file":"errorboundary.js","sources":["../../src/errorboundary.tsx"],"sourcesContent":["import { captureException, ReportDialogOptions, Scope, showReportDialog, withScope } from '@sentry/browser';\nimport { logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nexport function isAtLeastReact17(version: string): boolean {\n  const major = version.match(/^([^.]+)/);\n  return major !== null && parseInt(major[0]) >= 17;\n}\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type FallbackRender = (errorData: {\n  error: Error;\n  componentStack: string | null;\n  eventId: string | null;\n  resetError(): void;\n}) => React.ReactElement;\n\nexport type ErrorBoundaryProps = {\n  children?: React.ReactNode | (() => React.ReactNode);\n  /** If a Sentry report dialog should be rendered on error */\n  showDialog?: boolean;\n  /**\n   * Options to be passed into the Sentry report dialog.\n   * No-op if {@link showDialog} is false.\n   */\n  dialogOptions?: ReportDialogOptions;\n  /**\n   * A fallback component that gets rendered when the error boundary encounters an error.\n   *\n   * Can either provide a React Component, or a function that returns React Component as\n   * a valid fallback prop. If a function is provided, the function will be called with\n   * the error, the component stack, and an function that resets the error boundary on error.\n   *\n   */\n  fallback?: React.ReactElement | FallbackRender;\n  /** Called when the error boundary encounters an error */\n  onError?(error: Error, componentStack: string, eventId: string): void;\n  /** Called on componentDidMount() */\n  onMount?(): void;\n  /** Called if resetError() is called from the fallback render props function  */\n  onReset?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called on componentWillUnmount() */\n  onUnmount?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called before the error is captured by Sentry, allows for you to add tags or context using the scope */\n  beforeCapture?(scope: Scope, error: Error | null, componentStack: string | null): void;\n};\n\ntype ErrorBoundaryState = {\n  componentStack: React.ErrorInfo['componentStack'] | null;\n  error: Error | null;\n  eventId: string | null;\n};\n\nconst INITIAL_STATE = {\n  componentStack: null,\n  error: null,\n  eventId: null,\n};\n\n/**\n * A ErrorBoundary component that logs errors to Sentry. Requires React >= 16.\n * NOTE: If you are a Sentry user, and you are seeing this stack frame, it means the\n * Sentry React SDK ErrorBoundary caught an error invoking your application code. This\n * is expected behavior and NOT indicative of a bug with the Sentry React SDK.\n */\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  public state: ErrorBoundaryState = INITIAL_STATE;\n\n  public componentDidCatch(error: Error & { cause?: Error }, { componentStack }: React.ErrorInfo): void {\n    const { beforeCapture, onError, showDialog, dialogOptions } = this.props;\n\n    withScope(scope => {\n      // If on React version >= 17, create stack trace from componentStack param and links\n      // to to the original error using `error.cause` otherwise relies on error param for stacktrace.\n      // Linking errors requires the `LinkedErrors` integration be enabled.\n      if (isAtLeastReact17(React.version)) {\n        const errorBoundaryError = new Error(error.message);\n        errorBoundaryError.name = `React ErrorBoundary ${errorBoundaryError.name}`;\n        errorBoundaryError.stack = componentStack;\n\n        // Using the `LinkedErrors` integration to link the errors together.\n        error.cause = errorBoundaryError;\n      }\n\n      if (beforeCapture) {\n        beforeCapture(scope, error, componentStack);\n      }\n      const eventId = captureException(error, { contexts: { react: { componentStack } } });\n      if (onError) {\n        onError(error, componentStack, eventId);\n      }\n      if (showDialog) {\n        showReportDialog({ ...dialogOptions, eventId });\n      }\n\n      // componentDidCatch is used over getDerivedStateFromError\n      // so that componentStack is accessible through state.\n      this.setState({ error, componentStack, eventId });\n    });\n  }\n\n  public componentDidMount(): void {\n    const { onMount } = this.props;\n    if (onMount) {\n      onMount();\n    }\n  }\n\n  public componentWillUnmount(): void {\n    const { error, componentStack, eventId } = this.state;\n    const { onUnmount } = this.props;\n    if (onUnmount) {\n      onUnmount(error, componentStack, eventId);\n    }\n  }\n\n  public resetErrorBoundary: () => void = () => {\n    const { onReset } = this.props;\n    const { error, componentStack, eventId } = this.state;\n    if (onReset) {\n      onReset(error, componentStack, eventId);\n    }\n    this.setState(INITIAL_STATE);\n  };\n\n  public render(): React.ReactNode {\n    const { fallback, children } = this.props;\n    const { error, componentStack, eventId } = this.state;\n\n    if (error) {\n      let element: React.ReactElement | undefined = undefined;\n      if (typeof fallback === 'function') {\n        element = fallback({ error, componentStack, resetError: this.resetErrorBoundary, eventId });\n      } else {\n        element = fallback;\n      }\n\n      if (React.isValidElement(element)) {\n        return element;\n      }\n\n      if (fallback) {\n        __DEBUG_BUILD__ && logger.warn('fallback did not produce a valid ReactElement');\n      }\n\n      // Fail gracefully if no fallback provided or is not valid\n      return null;\n    }\n\n    if (typeof children === 'function') {\n      return (children as () => React.ReactNode)();\n    }\n    return children;\n  }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction withErrorBoundary<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  errorBoundaryOptions: ErrorBoundaryProps,\n): React.FC<P> {\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  const componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <ErrorBoundary {...errorBoundaryOptions}>\n      <WrappedComponent {...props} />\n    </ErrorBoundary>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\nexport { ErrorBoundary, withErrorBoundary };\n"],"names":[],"mappings":";;;;;AAAA,gHAIA;;AAEA;AACA;AACA;AACA;;;AA8CA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;;;;"}
+{"version":3,"file":"errorboundary.js","sources":["../../src/errorboundary.tsx"],"sourcesContent":["import { captureException, ReportDialogOptions, Scope, showReportDialog, withScope } from '@sentry/browser';\nimport { logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nexport function isAtLeastReact17(version: string): boolean {\n  const major = version.match(/^([^.]+)/);\n  return major !== null && parseInt(major[0]) >= 17;\n}\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type FallbackRender = (errorData: {\n  error: Error;\n  componentStack: string | null;\n  eventId: string | null;\n  resetError(): void;\n}) => React.ReactElement;\n\nexport type ErrorBoundaryProps = {\n  children?: React.ReactNode | (() => React.ReactNode);\n  /** If a Sentry report dialog should be rendered on error */\n  showDialog?: boolean;\n  /**\n   * Options to be passed into the Sentry report dialog.\n   * No-op if {@link showDialog} is false.\n   */\n  dialogOptions?: ReportDialogOptions;\n  /**\n   * A fallback component that gets rendered when the error boundary encounters an error.\n   *\n   * Can either provide a React Component, or a function that returns React Component as\n   * a valid fallback prop. If a function is provided, the function will be called with\n   * the error, the component stack, and an function that resets the error boundary on error.\n   *\n   */\n  fallback?: React.ReactElement | FallbackRender;\n  /** Called when the error boundary encounters an error */\n  onError?(error: Error, componentStack: string, eventId: string): void;\n  /** Called on componentDidMount() */\n  onMount?(): void;\n  /** Called if resetError() is called from the fallback render props function  */\n  onReset?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called on componentWillUnmount() */\n  onUnmount?(error: Error | null, componentStack: string | null, eventId: string | null): void;\n  /** Called before the error is captured by Sentry, allows for you to add tags or context using the scope */\n  beforeCapture?(scope: Scope, error: Error | null, componentStack: string | null): void;\n};\n\ntype ErrorBoundaryState = {\n  componentStack: React.ErrorInfo['componentStack'] | null;\n  error: Error | null;\n  eventId: string | null;\n};\n\nconst INITIAL_STATE = {\n  componentStack: null,\n  error: null,\n  eventId: null,\n};\n\n/**\n * A ErrorBoundary component that logs errors to Sentry. Requires React >= 16.\n * NOTE: If you are a Sentry user, and you are seeing this stack frame, it means the\n * Sentry React SDK ErrorBoundary caught an error invoking your application code. This\n * is expected behavior and NOT indicative of a bug with the Sentry React SDK.\n */\nclass ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  public state: ErrorBoundaryState = INITIAL_STATE;\n\n  public componentDidCatch(error: Error & { cause?: Error }, { componentStack }: React.ErrorInfo): void {\n    const { beforeCapture, onError, showDialog, dialogOptions } = this.props;\n\n    withScope(scope => {\n      // If on React version >= 17, create stack trace from componentStack param and links\n      // to to the original error using `error.cause` otherwise relies on error param for stacktrace.\n      // Linking errors requires the `LinkedErrors` integration be enabled.\n      if (isAtLeastReact17(React.version)) {\n        const errorBoundaryError = new Error(error.message);\n        errorBoundaryError.name = `React ErrorBoundary ${errorBoundaryError.name}`;\n        errorBoundaryError.stack = componentStack;\n\n        // Using the `LinkedErrors` integration to link the errors together.\n        error.cause = errorBoundaryError;\n      }\n\n      if (beforeCapture) {\n        beforeCapture(scope, error, componentStack);\n      }\n      const eventId = captureException(error, { contexts: { react: { componentStack } } });\n      if (onError) {\n        onError(error, componentStack, eventId);\n      }\n      if (showDialog) {\n        showReportDialog({ ...dialogOptions, eventId });\n      }\n\n      // componentDidCatch is used over getDerivedStateFromError\n      // so that componentStack is accessible through state.\n      this.setState({ error, componentStack, eventId });\n    });\n  }\n\n  public componentDidMount(): void {\n    const { onMount } = this.props;\n    if (onMount) {\n      onMount();\n    }\n  }\n\n  public componentWillUnmount(): void {\n    const { error, componentStack, eventId } = this.state;\n    const { onUnmount } = this.props;\n    if (onUnmount) {\n      onUnmount(error, componentStack, eventId);\n    }\n  }\n\n  public resetErrorBoundary: () => void = () => {\n    const { onReset } = this.props;\n    const { error, componentStack, eventId } = this.state;\n    if (onReset) {\n      onReset(error, componentStack, eventId);\n    }\n    this.setState(INITIAL_STATE);\n  };\n\n  public render(): React.ReactNode {\n    const { fallback, children } = this.props;\n    const { error, componentStack, eventId } = this.state;\n\n    if (error) {\n      let element: React.ReactElement | undefined = undefined;\n      if (typeof fallback === 'function') {\n        element = fallback({ error, componentStack, resetError: this.resetErrorBoundary, eventId });\n      } else {\n        element = fallback;\n      }\n\n      if (React.isValidElement(element)) {\n        return element;\n      }\n\n      if (fallback) {\n        __DEBUG_BUILD__ && logger.warn('fallback did not produce a valid ReactElement');\n      }\n\n      // Fail gracefully if no fallback provided or is not valid\n      return null;\n    }\n\n    if (typeof children === 'function') {\n      return (children as () => React.ReactNode)();\n    }\n    return children;\n  }\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nfunction withErrorBoundary<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  errorBoundaryOptions: ErrorBoundaryProps,\n): React.FC<P> {\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  const componentDisplayName = WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <ErrorBoundary {...errorBoundaryOptions}>\n      <WrappedComponent {...props} />\n    </ErrorBoundary>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  Wrapped.displayName = `errorBoundary(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\nexport { ErrorBoundary, withErrorBoundary };\n"],"names":[],"mappings":";;;;;AAAA,gHAIA;;AAEA;AACA;AACA;AACA;;;AA8CA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/esm/profiler.js

@@ -4,7 +4,8 @@ import hoistNonReactStatics from 'hoist-non-react-statics';
 import * as React from 'react';
 import { REACT_MOUNT_OP, REACT_UPDATE_OP, REACT_RENDER_OP } from './constants.js';
 
-var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packages/react/src/profiler.tsx";
+var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packages/react/src/profiler.tsx";/* eslint-disable @typescript-eslint/no-unsafe-member-access */
+
 var UNKNOWN_COMPONENT = 'unknown';
 
 /**
@@ -22,7 +23,8 @@ class Profiler extends React.Component {
    */
    __init2() {this._updateSpan = undefined;}
 
-     static __initStatic() {this.defaultProps = {
+  // eslint-disable-next-line @typescript-eslint/member-ordering
+   static __initStatic() {this.defaultProps = {
     disabled: false,
     includeRender: true,
     includeUpdates: true,
@@ -181,7 +183,8 @@ function useProfiler(
       }
     };
     // We only want this to run once.
-      }, []);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
 }
 
 /** Grabs active transaction off scope */

package/esm/profiler.js.map

@@ -1 +1 @@
-{"version":3,"file":"profiler.js","sources":["../../src/profiler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { getCurrentHub, Hub } from '@sentry/browser';\nimport { Span, Transaction } from '@sentry/types';\nimport { timestampWithMs } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { REACT_MOUNT_OP, REACT_RENDER_OP, REACT_UPDATE_OP } from './constants';\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type ProfilerProps = {\n  // The name of the component being profiled.\n  name: string;\n  // If the Profiler is disabled. False by default. This is useful if you want to disable profilers\n  // in certain environments.\n  disabled?: boolean;\n  // If time component is on page should be displayed as spans. True by default.\n  includeRender?: boolean;\n  // If component updates should be displayed as spans. True by default.\n  includeUpdates?: boolean;\n  // props given to component being profiled.\n  updateProps: { [key: string]: unknown };\n};\n\n/**\n * The Profiler component leverages Sentry's Tracing integration to generate\n * spans based on component lifecycles.\n */\nclass Profiler extends React.Component<ProfilerProps> {\n  /**\n   * The span of the mount activity\n   * Made protected for the React Native SDK to access\n   */\n  protected _mountSpan: Span | undefined = undefined;\n  /**\n   * The span that represents the duration of time between shouldComponentUpdate and componentDidUpdate\n   */\n  protected _updateSpan: Span | undefined = undefined;\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  public static defaultProps: Partial<ProfilerProps> = {\n    disabled: false,\n    includeRender: true,\n    includeUpdates: true,\n  };\n\n  public constructor(props: ProfilerProps) {\n    super(props);\n    const { name, disabled = false } = this.props;\n\n    if (disabled) {\n      return;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      this._mountSpan = activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n  }\n\n  // If a component mounted, we can finish the mount activity.\n  public componentDidMount(): void {\n    if (this._mountSpan) {\n      this._mountSpan.finish();\n    }\n  }\n\n  public shouldComponentUpdate({ updateProps, includeUpdates = true }: ProfilerProps): boolean {\n    // Only generate an update span if includeUpdates is true, if there is a valid mountSpan,\n    // and if the updateProps have changed. It is ok to not do a deep equality check here as it is expensive.\n    // We are just trying to give baseline clues for further investigation.\n    if (includeUpdates && this._mountSpan && updateProps !== this.props.updateProps) {\n      // See what props haved changed between the previous props, and the current props. This is\n      // set as data on the span. We just store the prop keys as the values could be potenially very large.\n      const changedProps = Object.keys(updateProps).filter(k => updateProps[k] !== this.props.updateProps[k]);\n      if (changedProps.length > 0) {\n        const now = timestampWithMs();\n        this._updateSpan = this._mountSpan.startChild({\n          data: {\n            changedProps,\n          },\n          description: `<${this.props.name}>`,\n          op: REACT_UPDATE_OP,\n          startTimestamp: now,\n        });\n      }\n    }\n\n    return true;\n  }\n\n  public componentDidUpdate(): void {\n    if (this._updateSpan) {\n      this._updateSpan.finish();\n      this._updateSpan = undefined;\n    }\n  }\n\n  // If a component is unmounted, we can say it is no longer on the screen.\n  // This means we can finish the span representing the component render.\n  public componentWillUnmount(): void {\n    const { name, includeRender = true } = this.props;\n\n    if (this._mountSpan && includeRender) {\n      // If we were able to obtain the spanId of the mount activity, we should set the\n      // next activity as a child to the component mount activity.\n      this._mountSpan.startChild({\n        description: `<${name}>`,\n        endTimestamp: timestampWithMs(),\n        op: REACT_RENDER_OP,\n        startTimestamp: this._mountSpan.endTimestamp,\n      });\n    }\n  }\n\n  public render(): React.ReactNode {\n    return this.props.children;\n  }\n}\n\n/**\n * withProfiler is a higher order component that wraps a\n * component in a {@link Profiler} component. It is recommended that\n * the higher order component be used over the regular {@link Profiler} component.\n *\n * @param WrappedComponent component that is wrapped by Profiler\n * @param options the {@link ProfilerProps} you can pass into the Profiler\n */\nfunction withProfiler<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  // We do not want to have `updateProps` given in options, it is instead filled through the HOC.\n  options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>,\n): React.FC<P> {\n  const componentDisplayName =\n    (options && options.name) || WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <Profiler {...options} name={componentDisplayName} updateProps={props}>\n      <WrappedComponent {...props} />\n    </Profiler>\n  );\n\n  Wrapped.displayName = `profiler(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\n/**\n *\n * `useProfiler` is a React hook that profiles a React component.\n *\n * Requires React 16.8 or above.\n * @param name displayName of component being profiled\n */\nfunction useProfiler(\n  name: string,\n  options: { disabled?: boolean; hasRenderSpan?: boolean } = {\n    disabled: false,\n    hasRenderSpan: true,\n  },\n): void {\n  const [mountSpan] = React.useState(() => {\n    if (options && options.disabled) {\n      return undefined;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      return activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n\n    return undefined;\n  });\n\n  React.useEffect(() => {\n    if (mountSpan) {\n      mountSpan.finish();\n    }\n\n    return (): void => {\n      if (mountSpan && options.hasRenderSpan) {\n        mountSpan.startChild({\n          description: `<${name}>`,\n          endTimestamp: timestampWithMs(),\n          op: REACT_RENDER_OP,\n          startTimestamp: mountSpan.endTimestamp,\n        });\n      }\n    };\n    // We only want this to run once.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n}\n\nexport { withProfiler, Profiler, useProfiler };\n\n/** Grabs active transaction off scope */\nexport function getActiveTransaction<T extends Transaction>(hub: Hub = getCurrentHub()): T | undefined {\n  if (hub) {\n    const scope = hub.getScope();\n    if (scope) {\n      return scope.getTransaction() as T | undefined;\n    }\n  }\n\n  return undefined;\n}\n"],"names":[],"mappings":";;;;;;AAAA,2GASA;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAGA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}
+{"version":3,"file":"profiler.js","sources":["../../src/profiler.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { getCurrentHub, Hub } from '@sentry/browser';\nimport { Span, Transaction } from '@sentry/types';\nimport { timestampWithMs } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { REACT_MOUNT_OP, REACT_RENDER_OP, REACT_UPDATE_OP } from './constants';\n\nexport const UNKNOWN_COMPONENT = 'unknown';\n\nexport type ProfilerProps = {\n  // The name of the component being profiled.\n  name: string;\n  // If the Profiler is disabled. False by default. This is useful if you want to disable profilers\n  // in certain environments.\n  disabled?: boolean;\n  // If time component is on page should be displayed as spans. True by default.\n  includeRender?: boolean;\n  // If component updates should be displayed as spans. True by default.\n  includeUpdates?: boolean;\n  // props given to component being profiled.\n  updateProps: { [key: string]: unknown };\n};\n\n/**\n * The Profiler component leverages Sentry's Tracing integration to generate\n * spans based on component lifecycles.\n */\nclass Profiler extends React.Component<ProfilerProps> {\n  /**\n   * The span of the mount activity\n   * Made protected for the React Native SDK to access\n   */\n  protected _mountSpan: Span | undefined = undefined;\n  /**\n   * The span that represents the duration of time between shouldComponentUpdate and componentDidUpdate\n   */\n  protected _updateSpan: Span | undefined = undefined;\n\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  public static defaultProps: Partial<ProfilerProps> = {\n    disabled: false,\n    includeRender: true,\n    includeUpdates: true,\n  };\n\n  public constructor(props: ProfilerProps) {\n    super(props);\n    const { name, disabled = false } = this.props;\n\n    if (disabled) {\n      return;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      this._mountSpan = activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n  }\n\n  // If a component mounted, we can finish the mount activity.\n  public componentDidMount(): void {\n    if (this._mountSpan) {\n      this._mountSpan.finish();\n    }\n  }\n\n  public shouldComponentUpdate({ updateProps, includeUpdates = true }: ProfilerProps): boolean {\n    // Only generate an update span if includeUpdates is true, if there is a valid mountSpan,\n    // and if the updateProps have changed. It is ok to not do a deep equality check here as it is expensive.\n    // We are just trying to give baseline clues for further investigation.\n    if (includeUpdates && this._mountSpan && updateProps !== this.props.updateProps) {\n      // See what props haved changed between the previous props, and the current props. This is\n      // set as data on the span. We just store the prop keys as the values could be potenially very large.\n      const changedProps = Object.keys(updateProps).filter(k => updateProps[k] !== this.props.updateProps[k]);\n      if (changedProps.length > 0) {\n        const now = timestampWithMs();\n        this._updateSpan = this._mountSpan.startChild({\n          data: {\n            changedProps,\n          },\n          description: `<${this.props.name}>`,\n          op: REACT_UPDATE_OP,\n          startTimestamp: now,\n        });\n      }\n    }\n\n    return true;\n  }\n\n  public componentDidUpdate(): void {\n    if (this._updateSpan) {\n      this._updateSpan.finish();\n      this._updateSpan = undefined;\n    }\n  }\n\n  // If a component is unmounted, we can say it is no longer on the screen.\n  // This means we can finish the span representing the component render.\n  public componentWillUnmount(): void {\n    const { name, includeRender = true } = this.props;\n\n    if (this._mountSpan && includeRender) {\n      // If we were able to obtain the spanId of the mount activity, we should set the\n      // next activity as a child to the component mount activity.\n      this._mountSpan.startChild({\n        description: `<${name}>`,\n        endTimestamp: timestampWithMs(),\n        op: REACT_RENDER_OP,\n        startTimestamp: this._mountSpan.endTimestamp,\n      });\n    }\n  }\n\n  public render(): React.ReactNode {\n    return this.props.children;\n  }\n}\n\n/**\n * withProfiler is a higher order component that wraps a\n * component in a {@link Profiler} component. It is recommended that\n * the higher order component be used over the regular {@link Profiler} component.\n *\n * @param WrappedComponent component that is wrapped by Profiler\n * @param options the {@link ProfilerProps} you can pass into the Profiler\n */\nfunction withProfiler<P extends Record<string, any>>(\n  WrappedComponent: React.ComponentType<P>,\n  // We do not want to have `updateProps` given in options, it is instead filled through the HOC.\n  options?: Pick<Partial<ProfilerProps>, Exclude<keyof ProfilerProps, 'updateProps'>>,\n): React.FC<P> {\n  const componentDisplayName =\n    (options && options.name) || WrappedComponent.displayName || WrappedComponent.name || UNKNOWN_COMPONENT;\n\n  const Wrapped: React.FC<P> = (props: P) => (\n    <Profiler {...options} name={componentDisplayName} updateProps={props}>\n      <WrappedComponent {...props} />\n    </Profiler>\n  );\n\n  Wrapped.displayName = `profiler(${componentDisplayName})`;\n\n  // Copy over static methods from Wrapped component to Profiler HOC\n  // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over\n  hoistNonReactStatics(Wrapped, WrappedComponent);\n  return Wrapped;\n}\n\n/**\n *\n * `useProfiler` is a React hook that profiles a React component.\n *\n * Requires React 16.8 or above.\n * @param name displayName of component being profiled\n */\nfunction useProfiler(\n  name: string,\n  options: { disabled?: boolean; hasRenderSpan?: boolean } = {\n    disabled: false,\n    hasRenderSpan: true,\n  },\n): void {\n  const [mountSpan] = React.useState(() => {\n    if (options && options.disabled) {\n      return undefined;\n    }\n\n    const activeTransaction = getActiveTransaction();\n    if (activeTransaction) {\n      return activeTransaction.startChild({\n        description: `<${name}>`,\n        op: REACT_MOUNT_OP,\n      });\n    }\n\n    return undefined;\n  });\n\n  React.useEffect(() => {\n    if (mountSpan) {\n      mountSpan.finish();\n    }\n\n    return (): void => {\n      if (mountSpan && options.hasRenderSpan) {\n        mountSpan.startChild({\n          description: `<${name}>`,\n          endTimestamp: timestampWithMs(),\n          op: REACT_RENDER_OP,\n          startTimestamp: mountSpan.endTimestamp,\n        });\n      }\n    };\n    // We only want this to run once.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n}\n\nexport { withProfiler, Profiler, useProfiler };\n\n/** Grabs active transaction off scope */\nexport function getActiveTransaction<T extends Transaction>(hub: Hub = getCurrentHub()): T | undefined {\n  if (hub) {\n    const scope = hub.getScope();\n    if (scope) {\n      return scope.getTransaction() as T | undefined;\n    }\n  }\n\n  return undefined;\n}\n"],"names":[],"mappings":";;;;;;AAAA;AASA;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/esm/reactrouter.js

@@ -6,6 +6,9 @@ var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packag
 
 // We need to disable eslint no-explict-any because any is required for the
 // react-router typings.
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+/* eslint-enable @typescript-eslint/no-explicit-any */
 
 var global = getGlobalObject();
 
@@ -57,7 +60,8 @@ function createReactRouterInstrumentation(
     }
 
     var branches = matchRoutes(allRoutes, pathname, matchPath);
-        for (let x = 0; x < branches.length; x++) {
+    // eslint-disable-next-line @typescript-eslint/prefer-for-of
+    for (let x = 0; x < branches.length; x++) {
       if (branches[x].match.isExact) {
         return [branches[x].match.path, 'route'];
       }
@@ -141,6 +145,7 @@ function computeRootMatch(pathname) {
   return { path: '/', url: '/', params: {}, isExact: pathname === '/' };
 }
 
+/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */
 function withSentryRouting(Route) {
   var componentDisplayName = (Route ).displayName || (Route ).name;
 
@@ -162,6 +167,7 @@ function withSentryRouting(Route) {
   // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164
   return WrappedRoute;
 }
+/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */
 
 export { reactRouterV4Instrumentation, reactRouterV5Instrumentation, withSentryRouting };
 //# sourceMappingURL=reactrouter.js.map

package/esm/reactrouter.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactrouter.js","sources":["../../src/reactrouter.tsx"],"sourcesContent":["import { Transaction, TransactionSource } from '@sentry/types';\nimport { getGlobalObject } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { Action, Location, ReactRouterInstrumentation } from './types';\n\n// We need to disable eslint no-explict-any because any is required for the\n// react-router typings.\n/* eslint-disable @typescript-eslint/no-explicit-any */\ntype Match = { path: string; url: string; params: Record<string, any>; isExact: boolean };\n\nexport type RouterHistory = {\n  location?: Location;\n  listen?(cb: (location: Location, action: Action) => void): void;\n} & Record<string, any>;\n\nexport type RouteConfig = {\n  [propName: string]: any;\n  path?: string | string[];\n  exact?: boolean;\n  component?: JSX.Element;\n  routes?: RouteConfig[];\n};\n\ntype MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;\n/* eslint-enable @typescript-eslint/no-explicit-any */\n\nconst global = getGlobalObject<Window>();\n\nlet activeTransaction: Transaction | undefined;\n\nexport function reactRouterV4Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);\n}\n\nexport function reactRouterV5Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);\n}\n\nfunction createReactRouterInstrumentation(\n  history: RouterHistory,\n  name: string,\n  allRoutes: RouteConfig[] = [],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  function getInitPathName(): string | undefined {\n    if (history && history.location) {\n      return history.location.pathname;\n    }\n\n    if (global && global.location) {\n      return global.location.pathname;\n    }\n\n    return undefined;\n  }\n\n  /**\n   * Normalizes a transaction name. Returns the new name as well as the\n   * source of the transaction.\n   *\n   * @param pathname The initial pathname we normalize\n   */\n  function normalizeTransactionName(pathname: string): [string, TransactionSource] {\n    if (allRoutes.length === 0 || !matchPath) {\n      return [pathname, 'url'];\n    }\n\n    const branches = matchRoutes(allRoutes, pathname, matchPath);\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      if (branches[x].match.isExact) {\n        return [branches[x].match.path, 'route'];\n      }\n    }\n\n    return [pathname, 'url'];\n  }\n\n  const tags = {\n    'routing.instrumentation': name,\n  };\n\n  return (customStartTransaction, startTransactionOnPageLoad = true, startTransactionOnLocationChange = true): void => {\n    const initPathName = getInitPathName();\n    if (startTransactionOnPageLoad && initPathName) {\n      const [name, source] = normalizeTransactionName(initPathName);\n      activeTransaction = customStartTransaction({\n        name,\n        op: 'pageload',\n        tags,\n        metadata: {\n          source,\n        },\n      });\n    }\n\n    if (startTransactionOnLocationChange && history.listen) {\n      history.listen((location, action) => {\n        if (action && (action === 'PUSH' || action === 'POP')) {\n          if (activeTransaction) {\n            activeTransaction.finish();\n          }\n\n          const [name, source] = normalizeTransactionName(location.pathname);\n          activeTransaction = customStartTransaction({\n            name,\n            op: 'navigation',\n            tags,\n            metadata: {\n              source,\n            },\n          });\n        }\n      });\n    }\n  };\n}\n\n/**\n * Matches a set of routes to a pathname\n * Based on implementation from\n */\nfunction matchRoutes(\n  routes: RouteConfig[],\n  pathname: string,\n  matchPath: MatchPath,\n  branch: Array<{ route: RouteConfig; match: Match }> = [],\n): Array<{ route: RouteConfig; match: Match }> {\n  routes.some(route => {\n    const match = route.path\n      ? matchPath(pathname, route)\n      : branch.length\n      ? branch[branch.length - 1].match // use parent match\n      : computeRootMatch(pathname); // use default \"root\" match\n\n    if (match) {\n      branch.push({ route, match });\n\n      if (route.routes) {\n        matchRoutes(route.routes, pathname, matchPath, branch);\n      }\n    }\n\n    return !!match;\n  });\n\n  return branch;\n}\n\nfunction computeRootMatch(pathname: string): Match {\n  return { path: '/', url: '/', params: {}, isExact: pathname === '/' };\n}\n\n/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\nexport function withSentryRouting<P extends Record<string, any>, R extends React.ComponentType<P>>(Route: R): R {\n  const componentDisplayName = (Route as any).displayName || (Route as any).name;\n\n  const WrappedRoute: React.FC<P> = (props: P) => {\n    if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {\n      activeTransaction.setName(props.computedMatch.path, 'route');\n    }\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params:\n    // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n    return <Route {...props} />;\n  };\n\n  WrappedRoute.displayName = `sentryRoute(${componentDisplayName})`;\n  hoistNonReactStatics(WrappedRoute, Route);\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params:\n  // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n  return WrappedRoute;\n}\n/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\n"],"names":[],"mappings":";;;;AAAA;;AAOA;AACA;;AAoBA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}
+{"version":3,"file":"reactrouter.js","sources":["../../src/reactrouter.tsx"],"sourcesContent":["import { Transaction, TransactionSource } from '@sentry/types';\nimport { getGlobalObject } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport * as React from 'react';\n\nimport { Action, Location, ReactRouterInstrumentation } from './types';\n\n// We need to disable eslint no-explict-any because any is required for the\n// react-router typings.\n/* eslint-disable @typescript-eslint/no-explicit-any */\ntype Match = { path: string; url: string; params: Record<string, any>; isExact: boolean };\n\nexport type RouterHistory = {\n  location?: Location;\n  listen?(cb: (location: Location, action: Action) => void): void;\n} & Record<string, any>;\n\nexport type RouteConfig = {\n  [propName: string]: any;\n  path?: string | string[];\n  exact?: boolean;\n  component?: JSX.Element;\n  routes?: RouteConfig[];\n};\n\ntype MatchPath = (pathname: string, props: string | string[] | any, parent?: Match | null) => Match | null;\n/* eslint-enable @typescript-eslint/no-explicit-any */\n\nconst global = getGlobalObject<Window>();\n\nlet activeTransaction: Transaction | undefined;\n\nexport function reactRouterV4Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v4', routes, matchPath);\n}\n\nexport function reactRouterV5Instrumentation(\n  history: RouterHistory,\n  routes?: RouteConfig[],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  return createReactRouterInstrumentation(history, 'react-router-v5', routes, matchPath);\n}\n\nfunction createReactRouterInstrumentation(\n  history: RouterHistory,\n  name: string,\n  allRoutes: RouteConfig[] = [],\n  matchPath?: MatchPath,\n): ReactRouterInstrumentation {\n  function getInitPathName(): string | undefined {\n    if (history && history.location) {\n      return history.location.pathname;\n    }\n\n    if (global && global.location) {\n      return global.location.pathname;\n    }\n\n    return undefined;\n  }\n\n  /**\n   * Normalizes a transaction name. Returns the new name as well as the\n   * source of the transaction.\n   *\n   * @param pathname The initial pathname we normalize\n   */\n  function normalizeTransactionName(pathname: string): [string, TransactionSource] {\n    if (allRoutes.length === 0 || !matchPath) {\n      return [pathname, 'url'];\n    }\n\n    const branches = matchRoutes(allRoutes, pathname, matchPath);\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      if (branches[x].match.isExact) {\n        return [branches[x].match.path, 'route'];\n      }\n    }\n\n    return [pathname, 'url'];\n  }\n\n  const tags = {\n    'routing.instrumentation': name,\n  };\n\n  return (customStartTransaction, startTransactionOnPageLoad = true, startTransactionOnLocationChange = true): void => {\n    const initPathName = getInitPathName();\n    if (startTransactionOnPageLoad && initPathName) {\n      const [name, source] = normalizeTransactionName(initPathName);\n      activeTransaction = customStartTransaction({\n        name,\n        op: 'pageload',\n        tags,\n        metadata: {\n          source,\n        },\n      });\n    }\n\n    if (startTransactionOnLocationChange && history.listen) {\n      history.listen((location, action) => {\n        if (action && (action === 'PUSH' || action === 'POP')) {\n          if (activeTransaction) {\n            activeTransaction.finish();\n          }\n\n          const [name, source] = normalizeTransactionName(location.pathname);\n          activeTransaction = customStartTransaction({\n            name,\n            op: 'navigation',\n            tags,\n            metadata: {\n              source,\n            },\n          });\n        }\n      });\n    }\n  };\n}\n\n/**\n * Matches a set of routes to a pathname\n * Based on implementation from\n */\nfunction matchRoutes(\n  routes: RouteConfig[],\n  pathname: string,\n  matchPath: MatchPath,\n  branch: Array<{ route: RouteConfig; match: Match }> = [],\n): Array<{ route: RouteConfig; match: Match }> {\n  routes.some(route => {\n    const match = route.path\n      ? matchPath(pathname, route)\n      : branch.length\n      ? branch[branch.length - 1].match // use parent match\n      : computeRootMatch(pathname); // use default \"root\" match\n\n    if (match) {\n      branch.push({ route, match });\n\n      if (route.routes) {\n        matchRoutes(route.routes, pathname, matchPath, branch);\n      }\n    }\n\n    return !!match;\n  });\n\n  return branch;\n}\n\nfunction computeRootMatch(pathname: string): Match {\n  return { path: '/', url: '/', params: {}, isExact: pathname === '/' };\n}\n\n/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\nexport function withSentryRouting<P extends Record<string, any>, R extends React.ComponentType<P>>(Route: R): R {\n  const componentDisplayName = (Route as any).displayName || (Route as any).name;\n\n  const WrappedRoute: React.FC<P> = (props: P) => {\n    if (activeTransaction && props && props.computedMatch && props.computedMatch.isExact) {\n      activeTransaction.setName(props.computedMatch.path, 'route');\n    }\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params:\n    // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n    return <Route {...props} />;\n  };\n\n  WrappedRoute.displayName = `sentryRoute(${componentDisplayName})`;\n  hoistNonReactStatics(WrappedRoute, Route);\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params:\n  // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164\n  return WrappedRoute;\n}\n/* eslint-enable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access */\n"],"names":[],"mappings":";;;;AAAA;;AAOA;AACA;AACA;;AAiBA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/esm/reactrouterv6.js

@@ -68,7 +68,8 @@ function getNormalizedName(
 
   let pathBuilder = '';
   if (branches) {
-        for (let x = 0; x < branches.length; x++) {
+    // eslint-disable-next-line @typescript-eslint/prefer-for-of
+    for (let x = 0; x < branches.length; x++) {
       var branch = branches[x];
       var route = branch.route;
       if (route) {
@@ -164,7 +165,8 @@ function withSentryReactRouterV6Routing(Routes) {
       isBaseLocation = true;
 
       updatePageloadTransaction(location, routes);
-          }, [props.children]);
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.children]);
 
     _useEffect(() => {
       handleNavigation(location, routes, navigationType, isBaseLocation);

package/esm/reactrouterv6.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactrouterv6.js","sources":["../../src/reactrouterv6.tsx"],"sourcesContent":["// Inspired from Donnie McNeal's solution:\n// https://gist.github.com/wontondon/e8c4bdf2888875e4c755712e99279536\n\nimport { Transaction, TransactionContext, TransactionSource } from '@sentry/types';\nimport { getGlobalObject, getNumberOfUrlSegments, logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport React from 'react';\n\nimport { Action, Location } from './types';\n\ninterface RouteObject {\n  caseSensitive?: boolean;\n  children?: RouteObject[];\n  element?: React.ReactNode;\n  index?: boolean;\n  path?: string;\n}\n\ntype Params<Key extends string = string> = {\n  readonly [key in Key]: string | undefined;\n};\n\ntype UseRoutes = (routes: RouteObject[], locationArg?: Partial<Location> | string) => React.ReactElement | null;\n\n// https://github.com/remix-run/react-router/blob/9fa54d643134cd75a0335581a75db8100ed42828/packages/react-router/lib/router.ts#L114-L134\ninterface RouteMatch<ParamKey extends string = string> {\n  /**\n   * The names and values of dynamic parameters in the URL.\n   */\n  params: Params<ParamKey>;\n  /**\n   * The portion of the URL pathname that was matched.\n   */\n  pathname: string;\n  /**\n   * The portion of the URL pathname that was matched before child routes.\n   */\n  pathnameBase: string;\n  /**\n   * The route object that was used to match.\n   */\n  route: RouteObject;\n}\n\ntype UseEffect = (cb: () => void, deps: unknown[]) => void;\ntype UseLocation = () => Location;\ntype UseNavigationType = () => Action;\ntype CreateRoutesFromChildren = (children: JSX.Element[]) => RouteObject[];\ntype MatchRoutes = (routes: RouteObject[], location: Location) => RouteMatch[] | null;\n\nlet activeTransaction: Transaction | undefined;\n\nlet _useEffect: UseEffect;\nlet _useLocation: UseLocation;\nlet _useNavigationType: UseNavigationType;\nlet _createRoutesFromChildren: CreateRoutesFromChildren;\nlet _matchRoutes: MatchRoutes;\nlet _customStartTransaction: (context: TransactionContext) => Transaction | undefined;\nlet _startTransactionOnLocationChange: boolean;\n\nconst global = getGlobalObject<Window>();\n\nconst SENTRY_TAGS = {\n  'routing.instrumentation': 'react-router-v6',\n};\n\nexport function reactRouterV6Instrumentation(\n  useEffect: UseEffect,\n  useLocation: UseLocation,\n  useNavigationType: UseNavigationType,\n  createRoutesFromChildren: CreateRoutesFromChildren,\n  matchRoutes: MatchRoutes,\n) {\n  return (\n    customStartTransaction: (context: TransactionContext) => Transaction | undefined,\n    startTransactionOnPageLoad = true,\n    startTransactionOnLocationChange = true,\n  ): void => {\n    const initPathName = global && global.location && global.location.pathname;\n    if (startTransactionOnPageLoad && initPathName) {\n      activeTransaction = customStartTransaction({\n        name: initPathName,\n        op: 'pageload',\n        tags: SENTRY_TAGS,\n        metadata: {\n          source: 'url',\n        },\n      });\n    }\n\n    _useEffect = useEffect;\n    _useLocation = useLocation;\n    _useNavigationType = useNavigationType;\n    _matchRoutes = matchRoutes;\n    _createRoutesFromChildren = createRoutesFromChildren;\n\n    _customStartTransaction = customStartTransaction;\n    _startTransactionOnLocationChange = startTransactionOnLocationChange;\n  };\n}\n\nfunction getNormalizedName(\n  routes: RouteObject[],\n  location: Location,\n  matchRoutes: MatchRoutes,\n): [string, TransactionSource] {\n  if (!routes || routes.length === 0 || !matchRoutes) {\n    return [location.pathname, 'url'];\n  }\n\n  const branches = matchRoutes(routes, location);\n\n  let pathBuilder = '';\n  if (branches) {\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      const branch = branches[x];\n      const route = branch.route;\n      if (route) {\n        // Early return if index route\n        if (route.index) {\n          return [branch.pathname, 'route'];\n        }\n\n        const path = route.path;\n        if (path) {\n          const newPath = path[0] === '/' ? path : `/${path}`;\n          pathBuilder += newPath;\n          if (branch.pathname === location.pathname) {\n            // If the route defined on the element is something like\n            // <Route path=\"/stores/:storeId/products/:productId\" element={<div>Product</div>} />\n            // We should check against the branch.pathname for the number of / seperators\n            if (getNumberOfUrlSegments(pathBuilder) !== getNumberOfUrlSegments(branch.pathname)) {\n              return [newPath, 'route'];\n            }\n            return [pathBuilder, 'route'];\n          }\n        }\n      }\n    }\n  }\n\n  return [location.pathname, 'url'];\n}\n\nfunction updatePageloadTransaction(location: Location, routes: RouteObject[]): void {\n  if (activeTransaction) {\n    activeTransaction.setName(...getNormalizedName(routes, location, _matchRoutes));\n  }\n}\n\nfunction handleNavigation(\n  location: Location,\n  routes: RouteObject[],\n  navigationType: Action,\n  isBaseLocation: boolean,\n): void {\n  if (isBaseLocation) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    return;\n  }\n\n  if (_startTransactionOnLocationChange && (navigationType === 'PUSH' || navigationType === 'POP')) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    const [name, source] = getNormalizedName(routes, location, _matchRoutes);\n    activeTransaction = _customStartTransaction({\n      name,\n      op: 'navigation',\n      tags: SENTRY_TAGS,\n      metadata: {\n        source,\n      },\n    });\n  }\n}\n\nexport function withSentryReactRouterV6Routing<P extends Record<string, any>, R extends React.FC<P>>(Routes: R): R {\n  if (\n    !_useEffect ||\n    !_useLocation ||\n    !_useNavigationType ||\n    !_createRoutesFromChildren ||\n    !_matchRoutes ||\n    !_customStartTransaction\n  ) {\n    __DEBUG_BUILD__ &&\n      logger.warn('reactRouterV6Instrumentation was unable to wrap Routes because of one or more missing parameters.');\n\n    return Routes;\n  }\n\n  let isBaseLocation: boolean = false;\n  let routes: RouteObject[];\n\n  const SentryRoutes: React.FC<P> = (props: P) => {\n    const location = _useLocation();\n    const navigationType = _useNavigationType();\n\n    _useEffect(() => {\n      // Performance concern:\n      // This is repeated when <Routes /> is rendered.\n      routes = _createRoutesFromChildren(props.children);\n      isBaseLocation = true;\n\n      updatePageloadTransaction(location, routes);\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [props.children]);\n\n    _useEffect(() => {\n      handleNavigation(location, routes, navigationType, isBaseLocation);\n    }, [props.children, location, navigationType, isBaseLocation]);\n\n    isBaseLocation = false;\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params\n    return <Routes {...props} />;\n  };\n\n  hoistNonReactStatics(SentryRoutes, Routes);\n\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params\n  return SentryRoutes;\n}\n\nexport function wrapUseRoutes(origUseRoutes: UseRoutes): UseRoutes {\n  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes || !_customStartTransaction) {\n    __DEBUG_BUILD__ &&\n      logger.warn(\n        'reactRouterV6Instrumentation was unable to wrap `useRoutes` because of one or more missing parameters.',\n      );\n\n    return origUseRoutes;\n  }\n\n  let isBaseLocation: boolean = false;\n\n  return (routes: RouteObject[], location?: Partial<Location> | string): React.ReactElement | null => {\n    const SentryRoutes: React.FC<unknown> = (props: unknown) => {\n      const Routes = origUseRoutes(routes, location);\n\n      const locationArgObject = typeof location === 'string' ? { pathname: location } : location;\n      const locationObject = (locationArgObject as Location) || _useLocation();\n      const navigationType = _useNavigationType();\n\n      _useEffect(() => {\n        isBaseLocation = true;\n\n        updatePageloadTransaction(locationObject, routes);\n      }, [props]);\n\n      _useEffect(() => {\n        handleNavigation(locationObject, routes, navigationType, isBaseLocation);\n      }, [props, locationObject, navigationType, isBaseLocation]);\n\n      isBaseLocation = false;\n\n      return Routes;\n    };\n\n    return <SentryRoutes />;\n  };\n}\n"],"names":[],"mappings":";;;;AAAA;;AAkDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}
+{"version":3,"file":"reactrouterv6.js","sources":["../../src/reactrouterv6.tsx"],"sourcesContent":["// Inspired from Donnie McNeal's solution:\n// https://gist.github.com/wontondon/e8c4bdf2888875e4c755712e99279536\n\nimport { Transaction, TransactionContext, TransactionSource } from '@sentry/types';\nimport { getGlobalObject, getNumberOfUrlSegments, logger } from '@sentry/utils';\nimport hoistNonReactStatics from 'hoist-non-react-statics';\nimport React from 'react';\n\nimport { Action, Location } from './types';\n\ninterface RouteObject {\n  caseSensitive?: boolean;\n  children?: RouteObject[];\n  element?: React.ReactNode;\n  index?: boolean;\n  path?: string;\n}\n\ntype Params<Key extends string = string> = {\n  readonly [key in Key]: string | undefined;\n};\n\ntype UseRoutes = (routes: RouteObject[], locationArg?: Partial<Location> | string) => React.ReactElement | null;\n\n// https://github.com/remix-run/react-router/blob/9fa54d643134cd75a0335581a75db8100ed42828/packages/react-router/lib/router.ts#L114-L134\ninterface RouteMatch<ParamKey extends string = string> {\n  /**\n   * The names and values of dynamic parameters in the URL.\n   */\n  params: Params<ParamKey>;\n  /**\n   * The portion of the URL pathname that was matched.\n   */\n  pathname: string;\n  /**\n   * The portion of the URL pathname that was matched before child routes.\n   */\n  pathnameBase: string;\n  /**\n   * The route object that was used to match.\n   */\n  route: RouteObject;\n}\n\ntype UseEffect = (cb: () => void, deps: unknown[]) => void;\ntype UseLocation = () => Location;\ntype UseNavigationType = () => Action;\ntype CreateRoutesFromChildren = (children: JSX.Element[]) => RouteObject[];\ntype MatchRoutes = (routes: RouteObject[], location: Location) => RouteMatch[] | null;\n\nlet activeTransaction: Transaction | undefined;\n\nlet _useEffect: UseEffect;\nlet _useLocation: UseLocation;\nlet _useNavigationType: UseNavigationType;\nlet _createRoutesFromChildren: CreateRoutesFromChildren;\nlet _matchRoutes: MatchRoutes;\nlet _customStartTransaction: (context: TransactionContext) => Transaction | undefined;\nlet _startTransactionOnLocationChange: boolean;\n\nconst global = getGlobalObject<Window>();\n\nconst SENTRY_TAGS = {\n  'routing.instrumentation': 'react-router-v6',\n};\n\nexport function reactRouterV6Instrumentation(\n  useEffect: UseEffect,\n  useLocation: UseLocation,\n  useNavigationType: UseNavigationType,\n  createRoutesFromChildren: CreateRoutesFromChildren,\n  matchRoutes: MatchRoutes,\n) {\n  return (\n    customStartTransaction: (context: TransactionContext) => Transaction | undefined,\n    startTransactionOnPageLoad = true,\n    startTransactionOnLocationChange = true,\n  ): void => {\n    const initPathName = global && global.location && global.location.pathname;\n    if (startTransactionOnPageLoad && initPathName) {\n      activeTransaction = customStartTransaction({\n        name: initPathName,\n        op: 'pageload',\n        tags: SENTRY_TAGS,\n        metadata: {\n          source: 'url',\n        },\n      });\n    }\n\n    _useEffect = useEffect;\n    _useLocation = useLocation;\n    _useNavigationType = useNavigationType;\n    _matchRoutes = matchRoutes;\n    _createRoutesFromChildren = createRoutesFromChildren;\n\n    _customStartTransaction = customStartTransaction;\n    _startTransactionOnLocationChange = startTransactionOnLocationChange;\n  };\n}\n\nfunction getNormalizedName(\n  routes: RouteObject[],\n  location: Location,\n  matchRoutes: MatchRoutes,\n): [string, TransactionSource] {\n  if (!routes || routes.length === 0 || !matchRoutes) {\n    return [location.pathname, 'url'];\n  }\n\n  const branches = matchRoutes(routes, location);\n\n  let pathBuilder = '';\n  if (branches) {\n    // eslint-disable-next-line @typescript-eslint/prefer-for-of\n    for (let x = 0; x < branches.length; x++) {\n      const branch = branches[x];\n      const route = branch.route;\n      if (route) {\n        // Early return if index route\n        if (route.index) {\n          return [branch.pathname, 'route'];\n        }\n\n        const path = route.path;\n        if (path) {\n          const newPath = path[0] === '/' ? path : `/${path}`;\n          pathBuilder += newPath;\n          if (branch.pathname === location.pathname) {\n            // If the route defined on the element is something like\n            // <Route path=\"/stores/:storeId/products/:productId\" element={<div>Product</div>} />\n            // We should check against the branch.pathname for the number of / seperators\n            if (getNumberOfUrlSegments(pathBuilder) !== getNumberOfUrlSegments(branch.pathname)) {\n              return [newPath, 'route'];\n            }\n            return [pathBuilder, 'route'];\n          }\n        }\n      }\n    }\n  }\n\n  return [location.pathname, 'url'];\n}\n\nfunction updatePageloadTransaction(location: Location, routes: RouteObject[]): void {\n  if (activeTransaction) {\n    activeTransaction.setName(...getNormalizedName(routes, location, _matchRoutes));\n  }\n}\n\nfunction handleNavigation(\n  location: Location,\n  routes: RouteObject[],\n  navigationType: Action,\n  isBaseLocation: boolean,\n): void {\n  if (isBaseLocation) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    return;\n  }\n\n  if (_startTransactionOnLocationChange && (navigationType === 'PUSH' || navigationType === 'POP')) {\n    if (activeTransaction) {\n      activeTransaction.finish();\n    }\n\n    const [name, source] = getNormalizedName(routes, location, _matchRoutes);\n    activeTransaction = _customStartTransaction({\n      name,\n      op: 'navigation',\n      tags: SENTRY_TAGS,\n      metadata: {\n        source,\n      },\n    });\n  }\n}\n\nexport function withSentryReactRouterV6Routing<P extends Record<string, any>, R extends React.FC<P>>(Routes: R): R {\n  if (\n    !_useEffect ||\n    !_useLocation ||\n    !_useNavigationType ||\n    !_createRoutesFromChildren ||\n    !_matchRoutes ||\n    !_customStartTransaction\n  ) {\n    __DEBUG_BUILD__ &&\n      logger.warn('reactRouterV6Instrumentation was unable to wrap Routes because of one or more missing parameters.');\n\n    return Routes;\n  }\n\n  let isBaseLocation: boolean = false;\n  let routes: RouteObject[];\n\n  const SentryRoutes: React.FC<P> = (props: P) => {\n    const location = _useLocation();\n    const navigationType = _useNavigationType();\n\n    _useEffect(() => {\n      // Performance concern:\n      // This is repeated when <Routes /> is rendered.\n      routes = _createRoutesFromChildren(props.children);\n      isBaseLocation = true;\n\n      updatePageloadTransaction(location, routes);\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [props.children]);\n\n    _useEffect(() => {\n      handleNavigation(location, routes, navigationType, isBaseLocation);\n    }, [props.children, location, navigationType, isBaseLocation]);\n\n    isBaseLocation = false;\n\n    // @ts-ignore Setting more specific React Component typing for `R` generic above\n    // will break advanced type inference done by react router params\n    return <Routes {...props} />;\n  };\n\n  hoistNonReactStatics(SentryRoutes, Routes);\n\n  // @ts-ignore Setting more specific React Component typing for `R` generic above\n  // will break advanced type inference done by react router params\n  return SentryRoutes;\n}\n\nexport function wrapUseRoutes(origUseRoutes: UseRoutes): UseRoutes {\n  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes || !_customStartTransaction) {\n    __DEBUG_BUILD__ &&\n      logger.warn(\n        'reactRouterV6Instrumentation was unable to wrap `useRoutes` because of one or more missing parameters.',\n      );\n\n    return origUseRoutes;\n  }\n\n  let isBaseLocation: boolean = false;\n\n  return (routes: RouteObject[], location?: Partial<Location> | string): React.ReactElement | null => {\n    const SentryRoutes: React.FC<unknown> = (props: unknown) => {\n      const Routes = origUseRoutes(routes, location);\n\n      const locationArgObject = typeof location === 'string' ? { pathname: location } : location;\n      const locationObject = (locationArgObject as Location) || _useLocation();\n      const navigationType = _useNavigationType();\n\n      _useEffect(() => {\n        isBaseLocation = true;\n\n        updatePageloadTransaction(locationObject, routes);\n      }, [props]);\n\n      _useEffect(() => {\n        handleNavigation(locationObject, routes, navigationType, isBaseLocation);\n      }, [props, locationObject, navigationType, isBaseLocation]);\n\n      isBaseLocation = false;\n\n      return Routes;\n    };\n\n    return <SentryRoutes />;\n  };\n}\n"],"names":[],"mappings":";;;;AAAA;;AAkDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/esm/redux.js

@@ -1,5 +1,7 @@
 import { configureScope } from '@sentry/browser';
 
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
 var ACTION_BREADCRUMB_CATEGORY = 'redux.action';
 var ACTION_BREADCRUMB_TYPE = 'info';
 
@@ -45,7 +47,8 @@ function createReduxEnhancer(enhancerOptions) {
           }
 
           /* Allow user to configure scope with latest state */
-                    const { configureScopeWithState } = options;
+          // eslint-disable-next-line @typescript-eslint/unbound-method
+          const { configureScopeWithState } = options;
           if (typeof configureScopeWithState === 'function') {
             configureScopeWithState(scope, newState);
           }

package/esm/redux.js.map

@@ -1 +1 @@
-{"version":3,"file":"redux.js","sources":["../../src/redux.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { configureScope } from '@sentry/browser';\nimport { Scope } from '@sentry/types';\n\ninterface Action<T = any> {\n  type: T;\n}\n\ninterface AnyAction extends Action {\n  [extraProps: string]: any;\n}\n\ntype Reducer<S = any, A extends Action = AnyAction> = (state: S | undefined, action: A) => S;\n\ntype Dispatch<A extends Action = AnyAction> = <T extends A>(action: T, ...extraArgs: any[]) => T;\n\ntype ExtendState<State, Extension> = [Extension] extends [never] ? State : State & Extension;\n\ntype Unsubscribe = () => void;\n\ninterface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {\n  dispatch: Dispatch<A>;\n  getState(): S;\n  subscribe(listener: () => void): Unsubscribe;\n  replaceReducer<NewState, NewActions extends Action>(\n    nextReducer: Reducer<NewState, NewActions>,\n  ): Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext;\n}\n\ndeclare const $CombinedState: unique symbol;\n\ntype CombinedState<S> = { readonly [$CombinedState]?: undefined } & S;\n\ntype PreloadedState<S> = Required<S> extends {\n  [$CombinedState]: undefined;\n}\n  ? S extends CombinedState<infer S1>\n    ? { [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K] }\n    : never\n  : { [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]> };\n\ntype StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <\n  S = any,\n  A extends Action = AnyAction,\n>(\n  reducer: Reducer<S, A>,\n  preloadedState?: PreloadedState<S>,\n) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;\n\nexport interface SentryEnhancerOptions<S = any> {\n  /**\n   * Transforms the state before attaching it to an event.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not attach the state.\n   */\n  stateTransformer(state: S | undefined): (S & any) | null;\n  /**\n   * Transforms the action before sending it as a breadcrumb.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not send the breadcrumb.\n   */\n  actionTransformer(action: AnyAction): AnyAction | null;\n  /**\n   * Called on every state update, configure the Sentry Scope with the redux state.\n   */\n  configureScopeWithState?(scope: Scope, state: S): void;\n}\n\nconst ACTION_BREADCRUMB_CATEGORY = 'redux.action';\nconst ACTION_BREADCRUMB_TYPE = 'info';\n\nconst defaultOptions: SentryEnhancerOptions = {\n  actionTransformer: action => action,\n  stateTransformer: state => state || null,\n};\n\n/**\n * Creates an enhancer that would be passed to Redux's createStore to log actions and the latest state to Sentry.\n *\n * @param enhancerOptions Options to pass to the enhancer\n */\nfunction createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>): any {\n  // Note: We return an any type as to not have type conflicts.\n  const options = {\n    ...defaultOptions,\n    ...enhancerOptions,\n  };\n\n  return (next: StoreEnhancerStoreCreator): StoreEnhancerStoreCreator =>\n    <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, initialState?: PreloadedState<S>) => {\n      const sentryReducer: Reducer<S, A> = (state, action): S => {\n        const newState = reducer(state, action);\n\n        configureScope(scope => {\n          /* Action breadcrumbs */\n          const transformedAction = options.actionTransformer(action);\n          if (typeof transformedAction !== 'undefined' && transformedAction !== null) {\n            scope.addBreadcrumb({\n              category: ACTION_BREADCRUMB_CATEGORY,\n              data: transformedAction,\n              type: ACTION_BREADCRUMB_TYPE,\n            });\n          }\n\n          /* Set latest state to scope */\n          const transformedState = options.stateTransformer(newState);\n          if (typeof transformedState !== 'undefined' && transformedState !== null) {\n            scope.setContext('state', { state: { type: 'redux', value: transformedState } });\n          } else {\n            scope.setContext('state', null);\n          }\n\n          /* Allow user to configure scope with latest state */\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          const { configureScopeWithState } = options;\n          if (typeof configureScopeWithState === 'function') {\n            configureScopeWithState(scope, newState);\n          }\n        });\n\n        return newState;\n      };\n\n      return next(sentryReducer, initialState);\n    };\n}\n\nexport { createReduxEnhancer };\n"],"names":[],"mappings":";;AAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}
+{"version":3,"file":"redux.js","sources":["../../src/redux.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { configureScope } from '@sentry/browser';\nimport { Scope } from '@sentry/types';\n\ninterface Action<T = any> {\n  type: T;\n}\n\ninterface AnyAction extends Action {\n  [extraProps: string]: any;\n}\n\ntype Reducer<S = any, A extends Action = AnyAction> = (state: S | undefined, action: A) => S;\n\ntype Dispatch<A extends Action = AnyAction> = <T extends A>(action: T, ...extraArgs: any[]) => T;\n\ntype ExtendState<State, Extension> = [Extension] extends [never] ? State : State & Extension;\n\ntype Unsubscribe = () => void;\n\ninterface Store<S = any, A extends Action = AnyAction, StateExt = never, Ext = Record<string, unknown>> {\n  dispatch: Dispatch<A>;\n  getState(): S;\n  subscribe(listener: () => void): Unsubscribe;\n  replaceReducer<NewState, NewActions extends Action>(\n    nextReducer: Reducer<NewState, NewActions>,\n  ): Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext;\n}\n\ndeclare const $CombinedState: unique symbol;\n\ntype CombinedState<S> = { readonly [$CombinedState]?: undefined } & S;\n\ntype PreloadedState<S> = Required<S> extends {\n  [$CombinedState]: undefined;\n}\n  ? S extends CombinedState<infer S1>\n    ? { [K in keyof S1]?: S1[K] extends Record<string, unknown> ? PreloadedState<S1[K]> : S1[K] }\n    : never\n  : { [K in keyof S]: S[K] extends string | number | boolean | symbol ? S[K] : PreloadedState<S[K]> };\n\ntype StoreEnhancerStoreCreator<Ext = Record<string, unknown>, StateExt = never> = <\n  S = any,\n  A extends Action = AnyAction,\n>(\n  reducer: Reducer<S, A>,\n  preloadedState?: PreloadedState<S>,\n) => Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;\n\nexport interface SentryEnhancerOptions<S = any> {\n  /**\n   * Transforms the state before attaching it to an event.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not attach the state.\n   */\n  stateTransformer(state: S | undefined): (S & any) | null;\n  /**\n   * Transforms the action before sending it as a breadcrumb.\n   * Use this to remove any private data before sending it to Sentry.\n   * Return null to not send the breadcrumb.\n   */\n  actionTransformer(action: AnyAction): AnyAction | null;\n  /**\n   * Called on every state update, configure the Sentry Scope with the redux state.\n   */\n  configureScopeWithState?(scope: Scope, state: S): void;\n}\n\nconst ACTION_BREADCRUMB_CATEGORY = 'redux.action';\nconst ACTION_BREADCRUMB_TYPE = 'info';\n\nconst defaultOptions: SentryEnhancerOptions = {\n  actionTransformer: action => action,\n  stateTransformer: state => state || null,\n};\n\n/**\n * Creates an enhancer that would be passed to Redux's createStore to log actions and the latest state to Sentry.\n *\n * @param enhancerOptions Options to pass to the enhancer\n */\nfunction createReduxEnhancer(enhancerOptions?: Partial<SentryEnhancerOptions>): any {\n  // Note: We return an any type as to not have type conflicts.\n  const options = {\n    ...defaultOptions,\n    ...enhancerOptions,\n  };\n\n  return (next: StoreEnhancerStoreCreator): StoreEnhancerStoreCreator =>\n    <S = any, A extends Action = AnyAction>(reducer: Reducer<S, A>, initialState?: PreloadedState<S>) => {\n      const sentryReducer: Reducer<S, A> = (state, action): S => {\n        const newState = reducer(state, action);\n\n        configureScope(scope => {\n          /* Action breadcrumbs */\n          const transformedAction = options.actionTransformer(action);\n          if (typeof transformedAction !== 'undefined' && transformedAction !== null) {\n            scope.addBreadcrumb({\n              category: ACTION_BREADCRUMB_CATEGORY,\n              data: transformedAction,\n              type: ACTION_BREADCRUMB_TYPE,\n            });\n          }\n\n          /* Set latest state to scope */\n          const transformedState = options.stateTransformer(newState);\n          if (typeof transformedState !== 'undefined' && transformedState !== null) {\n            scope.setContext('state', { state: { type: 'redux', value: transformedState } });\n          } else {\n            scope.setContext('state', null);\n          }\n\n          /* Allow user to configure scope with latest state */\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          const { configureScopeWithState } = options;\n          if (typeof configureScopeWithState === 'function') {\n            configureScopeWithState(scope, newState);\n          }\n        });\n\n        return newState;\n      };\n\n      return next(sentryReducer, initialState);\n    };\n}\n\nexport { createReduxEnhancer };\n"],"names":[],"mappings":";;AAAA;;AAoEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentry/react",
-  "version": "7.12.1",
+  "version": "7.14.0",
   "description": "Official Sentry SDK for React.js",
   "repository": "git://github.com/getsentry/sentry-javascript.git",
   "homepage": "https://github.com/getsentry/sentry-javascript/tree/master/packages/react",
@@ -16,9 +16,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@sentry/browser": "7.12.1",
-    "@sentry/types": "7.12.1",
-    "@sentry/utils": "7.12.1",
+    "@sentry/browser": "7.14.0",
+    "@sentry/types": "7.14.0",
+    "@sentry/utils": "7.14.0",
     "hoist-non-react-statics": "^3.3.2",
     "tslib": "^1.9.3"
   },