@jaak.ai/stamps 2.2.0-dev.6 → 2.2.0

package/dist/components/jaak-stamps.js

@@ -530,17 +530,30 @@ class CameraService {
             }
             const constraints = { ...videoConstraints };
             if (capabilities.width && capabilities.height) {
-                const maxWidth = Math.min(capabilities.width.max, 1920);
-                const maxHeight = Math.min(capabilities.height.max, 1080);
                 const isTablet = /iPad|Android/i.test(navigator.userAgent) && window.innerWidth >= 768;
-                if (isTablet) {
-                    constraints.width = { ideal: Math.min(maxWidth, 1280) };
-                    constraints.height = { ideal: Math.min(maxHeight, 720) };
+                const isMobileDevice = this.deviceType === 'mobile' ||
+                    /Android|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+                // Optimize resolution based on device type to prevent "slow motion" effect
+                // on devices with high-resolution cameras
+                let targetWidth;
+                let targetHeight;
+                if (isMobileDevice && !isTablet) {
+                    // Mobile phones: Use 720p max to ensure smooth detection performance
+                    targetWidth = Math.min(capabilities.width.max, 1280);
+                    targetHeight = Math.min(capabilities.height.max, 720);
+                }
+                else if (isTablet) {
+                    // Tablets: Can handle slightly higher resolution
+                    targetWidth = Math.min(capabilities.width.max, 1280);
+                    targetHeight = Math.min(capabilities.height.max, 720);
                 }
                 else {
-                    constraints.width = { ideal: maxWidth };
-                    constraints.height = { ideal: maxHeight };
+                    // Desktop: Can handle full HD
+                    targetWidth = Math.min(capabilities.width.max, 1920);
+                    targetHeight = Math.min(capabilities.height.max, 1080);
                 }
+                constraints.width = { ideal: targetWidth };
+                constraints.height = { ideal: targetHeight };
             }
             // Configure autofocus if camera has the capability
             const capabilitiesAny = capabilities;
@@ -560,9 +573,28 @@ class CameraService {
                 await this.detectDeviceType();
             }
             const isTablet = /iPad|Android/i.test(navigator.userAgent) && window.innerWidth >= 768;
+            const isMobileDevice = this.deviceType === 'mobile' ||
+                /Android|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+            // Optimized fallback constraints for device type
+            let fallbackWidth;
+            let fallbackHeight;
+            if (isMobileDevice && !isTablet) {
+                // Mobile phones: Use 720p for smooth performance
+                fallbackWidth = 1280;
+                fallbackHeight = 720;
+            }
+            else if (isTablet) {
+                fallbackWidth = 1280;
+                fallbackHeight = 720;
+            }
+            else {
+                // Desktop
+                fallbackWidth = 1920;
+                fallbackHeight = 1080;
+            }
             const fallbackConstraints = {
-                width: { ideal: isTablet ? 1280 : 1920 },
-                height: { ideal: isTablet ? 720 : 1080 }
+                width: { ideal: fallbackWidth },
+                height: { ideal: fallbackHeight }
             };
             if (this.selectedCameraId) {
                 fallbackConstraints.deviceId = { exact: this.selectedCameraId };
@@ -1178,7 +1210,7 @@ class DetectionService {
  */
 /** only globals that common to node and browsers are allowed */
 // eslint-disable-next-line node/no-unsupported-features/es-builtins, no-undef
-var _globalThis$2 = typeof globalThis === 'object'
+var _globalThis$1 = typeof globalThis === 'object'
     ? globalThis
     : typeof self === 'object'
         ? self
@@ -1204,7 +1236,7 @@ var _globalThis$2 = typeof globalThis === 'object'
  * limitations under the License.
  */
 // this is autogenerated file, see scripts/version-update.js
-var VERSION$4 = '1.9.0';
+var VERSION$2 = '1.9.0';
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -1321,7 +1353,7 @@ function _makeCompatibilityCheck(ownVersion) {
  *
  * @param version version of the API requesting an instance of the global API
  */
-var isCompatible = _makeCompatibilityCheck(VERSION$4);
+var isCompatible = _makeCompatibilityCheck(VERSION$2);
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -1338,14 +1370,14 @@ var isCompatible = _makeCompatibilityCheck(VERSION$4);
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-var major = VERSION$4.split('.')[0];
+var major = VERSION$2.split('.')[0];
 var GLOBAL_OPENTELEMETRY_API_KEY = Symbol.for("opentelemetry.js.api." + major);
-var _global$1 = _globalThis$2;
+var _global$1 = _globalThis$1;
 function registerGlobal(type, instance, diag, allowOverride) {
     var _a;
     if (allowOverride === void 0) { allowOverride = false; }
     var api = (_global$1[GLOBAL_OPENTELEMETRY_API_KEY] = (_a = _global$1[GLOBAL_OPENTELEMETRY_API_KEY]) !== null && _a !== void 0 ? _a : {
-        version: VERSION$4,
+        version: VERSION$2,
     });
     if (!allowOverride && api[type]) {
         // already registered an API of this type
@@ -1353,14 +1385,14 @@ function registerGlobal(type, instance, diag, allowOverride) {
         diag.error(err.stack || err.message);
         return false;
     }
-    if (api.version !== VERSION$4) {
+    if (api.version !== VERSION$2) {
         // All registered APIs must be of the same version exactly
-        var err = new Error("@opentelemetry/api: Registration of version v" + api.version + " for " + type + " does not match previously registered API v" + VERSION$4);
+        var err = new Error("@opentelemetry/api: Registration of version v" + api.version + " for " + type + " does not match previously registered API v" + VERSION$2);
         diag.error(err.stack || err.message);
         return false;
     }
     api[type] = instance;
-    diag.debug("@opentelemetry/api: Registered a global for " + type + " v" + VERSION$4 + ".");
+    diag.debug("@opentelemetry/api: Registered a global for " + type + " v" + VERSION$2 + ".");
     return true;
 }
 function getGlobal(type) {
@@ -1372,7 +1404,7 @@ function getGlobal(type) {
     return (_b = _global$1[GLOBAL_OPENTELEMETRY_API_KEY]) === null || _b === void 0 ? void 0 : _b[type];
 }
 function unregisterGlobal(type, diag) {
-    diag.debug("@opentelemetry/api: Unregistering a global for " + type + " v" + VERSION$4 + ".");
+    diag.debug("@opentelemetry/api: Unregistering a global for " + type + " v" + VERSION$2 + ".");
     var api = _global$1[GLOBAL_OPENTELEMETRY_API_KEY];
     if (api) {
         delete api[type];
@@ -3608,41 +3640,6 @@ function getNumberFromEnv(_) {
     return undefined;
 }
 
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// Updates to this file should also be replicated to @opentelemetry/api too.
-/**
- * - globalThis (New standard)
- * - self (Will return the current window instance for supported browsers)
- * - window (fallback for older browser implementations)
- * - global (NodeJS implementation)
- * - <object> (When all else fails)
- */
-/** only globals that common to node and browsers are allowed */
-// eslint-disable-next-line n/no-unsupported-features/es-builtins, no-undef
-const _globalThis$1 = typeof globalThis === 'object'
-    ? globalThis
-    : typeof self === 'object'
-        ? self
-        : typeof window === 'object'
-            ? window
-            : typeof global === 'object'
-                ? global
-                : {};
-
 /*
  * Copyright The OpenTelemetry Authors
  *
@@ -3676,7 +3673,7 @@ const otperformance = performance;
  * limitations under the License.
  */
 // this is autogenerated file, see scripts/version-update.js
-const VERSION$3 = '2.2.0';
+const VERSION$1 = '2.2.0';
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -3702,35 +3699,6 @@ const VERSION$3 = '2.2.0';
  * @example handled
  * @example unhandled
  */
-/**
- * Describes a class of error the operation ended with.
- *
- * @example timeout
- * @example java.net.UnknownHostException
- * @example server_certificate_invalid
- * @example 500
- *
- * @note The `error.type` **SHOULD** be predictable, and **SHOULD** have low cardinality.
- *
- * When `error.type` is set to a type (e.g., an exception type), its
- * canonical class name identifying the type within the artifact **SHOULD** be used.
- *
- * Instrumentations **SHOULD** document the list of errors they report.
- *
- * The cardinality of `error.type` within one instrumentation library **SHOULD** be low.
- * Telemetry consumers that aggregate data from multiple instrumentation libraries and applications
- * should be prepared for `error.type` to have high cardinality at query time when no
- * additional filters are applied.
- *
- * If the operation has completed successfully, instrumentations **SHOULD NOT** set `error.type`.
- *
- * If a specific domain defines its own set of error identifiers (such as HTTP or gRPC status codes),
- * it's **RECOMMENDED** to:
- *
- *   - Use a domain-specific attribute
- *   - Set `error.type` to capture all errors, regardless of whether they are defined within the domain-specific set or not.
- */
-const ATTR_ERROR_TYPE = 'error.type';
 /**
  * The exception message.
  *
@@ -3751,64 +3719,6 @@ const ATTR_EXCEPTION_STACKTRACE = 'exception.stacktrace';
  * @example OSError
  */
 const ATTR_EXCEPTION_TYPE = 'exception.type';
-/**
- * HTTP request method.
- *
- * @example GET
- * @example POST
- * @example HEAD
- *
- * @note HTTP request method value **SHOULD** be "known" to the instrumentation.
- * By default, this convention defines "known" methods as the ones listed in [RFC9110](https://www.rfc-editor.org/rfc/rfc9110.html#name-methods),
- * the PATCH method defined in [RFC5789](https://www.rfc-editor.org/rfc/rfc5789.html)
- * and the QUERY method defined in [httpbis-safe-method-w-body](https://datatracker.ietf.org/doc/draft-ietf-httpbis-safe-method-w-body/?include_text=1).
- *
- * If the HTTP request method is not known to instrumentation, it **MUST** set the `http.request.method` attribute to `_OTHER`.
- *
- * If the HTTP instrumentation could end up converting valid HTTP request methods to `_OTHER`, then it **MUST** provide a way to override
- * the list of known HTTP methods. If this override is done via environment variable, then the environment variable **MUST** be named
- * OTEL_INSTRUMENTATION_HTTP_KNOWN_METHODS and support a comma-separated list of case-sensitive known HTTP methods
- * (this list **MUST** be a full override of the default known method, it is not a list of known methods in addition to the defaults).
- *
- * HTTP method names are case-sensitive and `http.request.method` attribute value **MUST** match a known HTTP method name exactly.
- * Instrumentations for specific web frameworks that consider HTTP methods to be case insensitive, **SHOULD** populate a canonical equivalent.
- * Tracing instrumentations that do so, **MUST** also set `http.request.method_original` to the original value.
- */
-const ATTR_HTTP_REQUEST_METHOD = 'http.request.method';
-/**
- * Original HTTP method sent by the client in the request line.
- *
- * @example GeT
- * @example ACL
- * @example foo
- */
-const ATTR_HTTP_REQUEST_METHOD_ORIGINAL = 'http.request.method_original';
-/**
- * [HTTP response status code](https://tools.ietf.org/html/rfc7231#section-6).
- *
- * @example 200
- */
-const ATTR_HTTP_RESPONSE_STATUS_CODE = 'http.response.status_code';
-/**
- * Server domain name if available without reverse DNS lookup; otherwise, IP address or Unix domain socket name.
- *
- * @example example.com
- * @example 10.1.2.80
- * @example /tmp/my.sock
- *
- * @note When observed from the client side, and when communicating through an intermediary, `server.address` **SHOULD** represent the server address behind any intermediaries, for example proxies, if it's available.
- */
-const ATTR_SERVER_ADDRESS = 'server.address';
-/**
- * Server port number.
- *
- * @example 80
- * @example 8080
- * @example 443
- *
- * @note When observed from the client side, and when communicating through an intermediary, `server.port` **SHOULD** represent the server port behind any intermediaries, for example proxies, if it's available.
- */
-const ATTR_SERVER_PORT = 'server.port';
 /**
  * Logical name of the service.
  *
@@ -3844,45 +3754,6 @@ const ATTR_TELEMETRY_SDK_NAME = 'telemetry.sdk.name';
  * @example 1.2.3
  */
 const ATTR_TELEMETRY_SDK_VERSION = 'telemetry.sdk.version';
-/**
- * Absolute URL describing a network resource according to [RFC3986](https://www.rfc-editor.org/rfc/rfc3986)
- *
- * @example https://www.foo.bar/search?q=OpenTelemetry#SemConv
- * @example //localhost
- *
- * @note For network calls, URL usually has `scheme://host[:port][path][?query][#fragment]` format, where the fragment
- * is not transmitted over HTTP, but if it is known, it **SHOULD** be included nevertheless.
- *
- * `url.full` **MUST NOT** contain credentials passed via URL in form of `https://username:password@www.example.com/`.
- * In such case username and password **SHOULD** be redacted and attribute's value **SHOULD** be `https://REDACTED:REDACTED@www.example.com/`.
- *
- * `url.full` **SHOULD** capture the absolute URL when it is available (or can be reconstructed).
- *
- * Sensitive content provided in `url.full` **SHOULD** be scrubbed when instrumentations can identify it.
- *
- *
- * Query string values for the following keys **SHOULD** be redacted by default and replaced by the
- * value `REDACTED`:
- *
- *   - [`AWSAccessKeyId`](https://docs.aws.amazon.com/AmazonS3/latest/userguide/RESTAuthentication.html#RESTAuthenticationQueryStringAuth)
- *   - [`Signature`](https://docs.aws.amazon.com/AmazonS3/latest/userguide/RESTAuthentication.html#RESTAuthenticationQueryStringAuth)
- *   - [`sig`](https://learn.microsoft.com/azure/storage/common/storage-sas-overview#sas-token)
- *   - [`X-Goog-Signature`](https://cloud.google.com/storage/docs/access-control/signed-urls)
- *
- * This list is subject to change over time.
- *
- * When a query string value is redacted, the query string key **SHOULD** still be preserved, e.g.
- * `https://www.example.com/path?color=blue&sig=REDACTED`.
- */
-const ATTR_URL_FULL = 'url.full';
-/**
- * Value of the [HTTP User-Agent](https://www.rfc-editor.org/rfc/rfc9110.html#field.user-agent) header sent by the client.
- *
- * @example CERN-LineMode/2.15 libwww/2.17b3
- * @example Mozilla/5.0 (iPhone; CPU iPhone OS 14_7_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.2 Mobile/15E148 Safari/604.1
- * @example YourApp/1.0.0 grpc-java-okhttp/1.27.2
- */
-const ATTR_USER_AGENT_ORIGINAL = 'user_agent.original';
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -3933,7 +3804,7 @@ const SDK_INFO = {
     [ATTR_TELEMETRY_SDK_NAME]: 'opentelemetry',
     [ATTR_PROCESS_RUNTIME_NAME]: 'browser',
     [ATTR_TELEMETRY_SDK_LANGUAGE]: TELEMETRY_SDK_LANGUAGE_VALUE_WEBJS,
-    [ATTR_TELEMETRY_SDK_VERSION]: VERSION$3,
+    [ATTR_TELEMETRY_SDK_VERSION]: VERSION$1,
 };
 
 /*
@@ -3984,33 +3855,6 @@ function hrTime(performanceNow) {
     const now = millisToHrTime(typeof performanceNow === 'number' ? performanceNow : otperformance.now());
     return addHrTimes(timeOrigin, now);
 }
-/**
- *
- * Converts a TimeInput to an HrTime, defaults to _hrtime().
- * @param time
- */
-function timeInputToHrTime(time) {
-    // process.hrtime
-    if (isTimeInputHrTime(time)) {
-        return time;
-    }
-    else if (typeof time === 'number') {
-        // Must be a performance.now() if it's smaller than process start time.
-        if (time < getTimeOrigin()) {
-            return hrTime(time);
-        }
-        else {
-            // epoch milliseconds or performance.timeOrigin
-            return millisToHrTime(time);
-        }
-    }
-    else if (time instanceof Date) {
-        return millisToHrTime(time.getTime());
-    }
-    else {
-        throw TypeError('Invalid input type');
-    }
-}
 /**
  * Returns a duration of two hrTime.
  * @param startTime
@@ -4323,7 +4167,7 @@ class TraceState {
  */
 const TRACE_PARENT_HEADER = 'traceparent';
 const TRACE_STATE_HEADER = 'tracestate';
-const VERSION$2 = '00';
+const VERSION = '00';
 const VERSION_PART = '(?!ff)[\\da-f]{2}';
 const TRACE_ID_PART = '(?![0]{32})[\\da-f]{32}';
 const PARENT_ID_PART = '(?![0]{16})[\\da-f]{16}';
@@ -4367,7 +4211,7 @@ class W3CTraceContextPropagator {
             isTracingSuppressed(context) ||
             !isSpanContextValid(spanContext))
             return;
-        const traceParent = `${VERSION$2}-${spanContext.traceId}-${spanContext.spanId}-0${Number(spanContext.traceFlags || TraceFlags.NONE).toString(16)}`;
+        const traceParent = `${VERSION}-${spanContext.traceId}-${spanContext.spanId}-0${Number(spanContext.traceFlags || TraceFlags.NONE).toString(16)}`;
         setter.set(carrier, TRACE_PARENT_HEADER, traceParent);
         if (spanContext.traceState) {
             setter.set(carrier, TRACE_STATE_HEADER, spanContext.traceState.serialize());
@@ -4712,46 +4556,6 @@ function shouldMerge(one, two) {
     return true;
 }
 
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-function urlMatches(url, urlToMatch) {
-    if (typeof urlToMatch === 'string') {
-        return url === urlToMatch;
-    }
-    else {
-        return !!url.match(urlToMatch);
-    }
-}
-/**
- * Check if {@param url} should be ignored when comparing against {@param ignoredUrls}
- * @param url
- * @param ignoredUrls
- */
-function isUrlIgnored(url, ignoredUrls) {
-    if (!ignoredUrls) {
-        return false;
-    }
-    for (const ignoreUrl of ignoredUrls) {
-        if (urlMatches(url, ignoreUrl)) {
-            return true;
-        }
-    }
-    return false;
-}
-
 /*
  * Copyright The OpenTelemetry Authors
  *
@@ -6555,288 +6359,6 @@ class WebTracerProvider extends BasicTracerProvider {
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-var PerformanceTimingNames;
-(function (PerformanceTimingNames) {
-    PerformanceTimingNames["CONNECT_END"] = "connectEnd";
-    PerformanceTimingNames["CONNECT_START"] = "connectStart";
-    PerformanceTimingNames["DECODED_BODY_SIZE"] = "decodedBodySize";
-    PerformanceTimingNames["DOM_COMPLETE"] = "domComplete";
-    PerformanceTimingNames["DOM_CONTENT_LOADED_EVENT_END"] = "domContentLoadedEventEnd";
-    PerformanceTimingNames["DOM_CONTENT_LOADED_EVENT_START"] = "domContentLoadedEventStart";
-    PerformanceTimingNames["DOM_INTERACTIVE"] = "domInteractive";
-    PerformanceTimingNames["DOMAIN_LOOKUP_END"] = "domainLookupEnd";
-    PerformanceTimingNames["DOMAIN_LOOKUP_START"] = "domainLookupStart";
-    PerformanceTimingNames["ENCODED_BODY_SIZE"] = "encodedBodySize";
-    PerformanceTimingNames["FETCH_START"] = "fetchStart";
-    PerformanceTimingNames["LOAD_EVENT_END"] = "loadEventEnd";
-    PerformanceTimingNames["LOAD_EVENT_START"] = "loadEventStart";
-    PerformanceTimingNames["NAVIGATION_START"] = "navigationStart";
-    PerformanceTimingNames["REDIRECT_END"] = "redirectEnd";
-    PerformanceTimingNames["REDIRECT_START"] = "redirectStart";
-    PerformanceTimingNames["REQUEST_START"] = "requestStart";
-    PerformanceTimingNames["RESPONSE_END"] = "responseEnd";
-    PerformanceTimingNames["RESPONSE_START"] = "responseStart";
-    PerformanceTimingNames["SECURE_CONNECTION_START"] = "secureConnectionStart";
-    PerformanceTimingNames["START_TIME"] = "startTime";
-    PerformanceTimingNames["UNLOAD_EVENT_END"] = "unloadEventEnd";
-    PerformanceTimingNames["UNLOAD_EVENT_START"] = "unloadEventStart";
-})(PerformanceTimingNames || (PerformanceTimingNames = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/*
- * This file contains a copy of unstable semantic convention definitions
- * used by this package.
- * @see https://github.com/open-telemetry/opentelemetry-js/tree/main/semantic-conventions#unstable-semconv
- */
-/**
- * Deprecated, use `http.response.header.<key>` instead.
- *
- * @example 3495
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.response.header.<key>`.
- */
-const ATTR_HTTP_RESPONSE_CONTENT_LENGTH = 'http.response_content_length';
-/**
- * Deprecated, use `http.response.body.size` instead.
- *
- * @example 5493
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replace by `http.response.body.size`.
- */
-const ATTR_HTTP_RESPONSE_CONTENT_LENGTH_UNCOMPRESSED = 'http.response_content_length_uncompressed';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// Used to normalize relative URLs
-let urlNormalizingAnchor;
-function getUrlNormalizingAnchor() {
-    if (!urlNormalizingAnchor) {
-        urlNormalizingAnchor = document.createElement('a');
-    }
-    return urlNormalizingAnchor;
-}
-/**
- * Helper function to be able to use enum as typed key in type and in interface when using forEach
- * @param obj
- * @param key
- */
-function hasKey(obj, key) {
-    return key in obj;
-}
-/**
- * Helper function for starting an event on span based on {@link PerformanceEntries}
- * @param span
- * @param performanceName name of performance entry for time start
- * @param entries
- * @param ignoreZeros
- */
-function addSpanNetworkEvent(span, performanceName, entries, ignoreZeros = true) {
-    if (hasKey(entries, performanceName) &&
-        typeof entries[performanceName] === 'number' &&
-        !(ignoreZeros && entries[performanceName] === 0)) {
-        return span.addEvent(performanceName, entries[performanceName]);
-    }
-    return undefined;
-}
-/**
- * Helper function for adding network events and content length attributes.
- */
-function addSpanNetworkEvents(span, resource, ignoreNetworkEvents = false, ignoreZeros, skipOldSemconvContentLengthAttrs) {
-    if (ignoreZeros === undefined) {
-        ignoreZeros = resource[PerformanceTimingNames.START_TIME] !== 0;
-    }
-    if (!ignoreNetworkEvents) {
-        addSpanNetworkEvent(span, PerformanceTimingNames.FETCH_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.DOMAIN_LOOKUP_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.DOMAIN_LOOKUP_END, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.CONNECT_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.SECURE_CONNECTION_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.CONNECT_END, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.REQUEST_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.RESPONSE_START, resource, ignoreZeros);
-        addSpanNetworkEvent(span, PerformanceTimingNames.RESPONSE_END, resource, ignoreZeros);
-    }
-    if (!skipOldSemconvContentLengthAttrs) {
-        // This block adds content-length-related span attributes using the
-        // *old* HTTP semconv (v1.7.0).
-        const encodedLength = resource[PerformanceTimingNames.ENCODED_BODY_SIZE];
-        if (encodedLength !== undefined) {
-            span.setAttribute(ATTR_HTTP_RESPONSE_CONTENT_LENGTH, encodedLength);
-        }
-        const decodedLength = resource[PerformanceTimingNames.DECODED_BODY_SIZE];
-        // Spec: Not set if transport encoding not used (in which case encoded and decoded sizes match)
-        if (decodedLength !== undefined && encodedLength !== decodedLength) {
-            span.setAttribute(ATTR_HTTP_RESPONSE_CONTENT_LENGTH_UNCOMPRESSED, decodedLength);
-        }
-    }
-}
-/**
- * sort resources by startTime
- * @param filteredResources
- */
-function sortResources(filteredResources) {
-    return filteredResources.slice().sort((a, b) => {
-        const valueA = a[PerformanceTimingNames.FETCH_START];
-        const valueB = b[PerformanceTimingNames.FETCH_START];
-        if (valueA > valueB) {
-            return 1;
-        }
-        else if (valueA < valueB) {
-            return -1;
-        }
-        return 0;
-    });
-}
-/** Returns the origin if present (if in browser context). */
-function getOrigin() {
-    return typeof location !== 'undefined' ? location.origin : undefined;
-}
-/**
- * Get closest performance resource ignoring the resources that have been
- * already used.
- * @param spanUrl
- * @param startTimeHR
- * @param endTimeHR
- * @param resources
- * @param ignoredResources
- * @param initiatorType
- */
-function getResource(spanUrl, startTimeHR, endTimeHR, resources, ignoredResources = new WeakSet(), initiatorType) {
-    // de-relativize the URL before usage (does no harm to absolute URLs)
-    const parsedSpanUrl = parseUrl(spanUrl);
-    spanUrl = parsedSpanUrl.toString();
-    const filteredResources = filterResourcesForSpan(spanUrl, startTimeHR, endTimeHR, resources, ignoredResources, initiatorType);
-    if (filteredResources.length === 0) {
-        return {
-            mainRequest: undefined,
-        };
-    }
-    if (filteredResources.length === 1) {
-        return {
-            mainRequest: filteredResources[0],
-        };
-    }
-    const sorted = sortResources(filteredResources);
-    if (parsedSpanUrl.origin !== getOrigin() && sorted.length > 1) {
-        let corsPreFlightRequest = sorted[0];
-        let mainRequest = findMainRequest(sorted, corsPreFlightRequest[PerformanceTimingNames.RESPONSE_END], endTimeHR);
-        const responseEnd = corsPreFlightRequest[PerformanceTimingNames.RESPONSE_END];
-        const fetchStart = mainRequest[PerformanceTimingNames.FETCH_START];
-        // no corsPreFlightRequest
-        if (fetchStart < responseEnd) {
-            mainRequest = corsPreFlightRequest;
-            corsPreFlightRequest = undefined;
-        }
-        return {
-            corsPreFlightRequest,
-            mainRequest,
-        };
-    }
-    else {
-        return {
-            mainRequest: filteredResources[0],
-        };
-    }
-}
-/**
- * Will find the main request skipping the cors pre flight requests
- * @param resources
- * @param corsPreFlightRequestEndTime
- * @param spanEndTimeHR
- */
-function findMainRequest(resources, corsPreFlightRequestEndTime, spanEndTimeHR) {
-    const spanEndTime = hrTimeToNanoseconds(spanEndTimeHR);
-    const minTime = hrTimeToNanoseconds(timeInputToHrTime(corsPreFlightRequestEndTime));
-    let mainRequest = resources[1];
-    let bestGap;
-    const length = resources.length;
-    for (let i = 1; i < length; i++) {
-        const resource = resources[i];
-        const resourceStartTime = hrTimeToNanoseconds(timeInputToHrTime(resource[PerformanceTimingNames.FETCH_START]));
-        const resourceEndTime = hrTimeToNanoseconds(timeInputToHrTime(resource[PerformanceTimingNames.RESPONSE_END]));
-        const currentGap = spanEndTime - resourceEndTime;
-        if (resourceStartTime >= minTime && (!bestGap || currentGap < bestGap)) {
-            bestGap = currentGap;
-            mainRequest = resource;
-        }
-    }
-    return mainRequest;
-}
-/**
- * Filter all resources that has started and finished according to span start time and end time.
- *     It will return the closest resource to a start time
- * @param spanUrl
- * @param startTimeHR
- * @param endTimeHR
- * @param resources
- * @param ignoredResources
- */
-function filterResourcesForSpan(spanUrl, startTimeHR, endTimeHR, resources, ignoredResources, initiatorType) {
-    const startTime = hrTimeToNanoseconds(startTimeHR);
-    const endTime = hrTimeToNanoseconds(endTimeHR);
-    let filteredResources = resources.filter(resource => {
-        const resourceStartTime = hrTimeToNanoseconds(timeInputToHrTime(resource[PerformanceTimingNames.FETCH_START]));
-        const resourceEndTime = hrTimeToNanoseconds(timeInputToHrTime(resource[PerformanceTimingNames.RESPONSE_END]));
-        return (resource.initiatorType.toLowerCase() ===
-            (initiatorType || 'xmlhttprequest') &&
-            resource.name === spanUrl &&
-            resourceStartTime >= startTime &&
-            resourceEndTime <= endTime);
-    });
-    if (filteredResources.length > 0) {
-        filteredResources = filteredResources.filter(resource => {
-            return !ignoredResources.has(resource);
-        });
-    }
-    return filteredResources;
-}
-/**
- * Parses url using URL constructor or fallback to anchor element.
- * @param url
- */
-function parseUrl(url) {
-    if (typeof URL === 'function') {
-        return new URL(url, typeof document !== 'undefined'
-            ? document.baseURI
-            : typeof location !== 'undefined' // Some JS runtimes (e.g. Deno) don't define this
-                ? location.href
-                : undefined);
-    }
-    const element = getUrlNormalizingAnchor();
-    element.href = url;
-    return element;
-}
 /**
  * Get element XPath
  * @param target - target element
@@ -6915,25 +6437,6 @@ function getNodeValue(target, optimised) {
     }
     return `/${nodeValue}`;
 }
-/**
- * Checks if trace headers should be propagated
- * @param spanUrl
- * @private
- */
-function shouldPropagateTraceHeaders(spanUrl, propagateTraceHeaderCorsUrls) {
-    let propagateTraceHeaderUrls = propagateTraceHeaderCorsUrls || [];
-    if (typeof propagateTraceHeaderUrls === 'string' ||
-        propagateTraceHeaderUrls instanceof RegExp) {
-        propagateTraceHeaderUrls = [propagateTraceHeaderUrls];
-    }
-    const parsedSpanUrl = parseUrl(spanUrl);
-    if (parsedSpanUrl.origin === getOrigin()) {
-        return true;
-    }
-    else {
-        return propagateTraceHeaderUrls.some(propagateTraceHeaderUrl => urlMatches(spanUrl, propagateTraceHeaderUrl));
-    }
-}
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -16263,21 +15766,6 @@ class InstrumentationBase extends InstrumentationAbstract {
  * @param execute - function to be executed
  * @param onFinish - callback to run when execute finishes
  */
-function safeExecuteInTheMiddle(execute, onFinish, preventThrowingError) {
-    let error;
-    let result;
-    try {
-        result = execute();
-    }
-    catch (e) {
-        error = e;
-    }
-    finally {
-        onFinish(error, result);
-        // eslint-disable-next-line no-unsafe-finally
-        return result;
-    }
-}
 /**
  * Checks if certain function has been already wrapped
  * @param func
@@ -16304,104 +15792,13 @@ function isWrapped(func) {
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-var SemconvStability;
-(function (SemconvStability) {
-    /** Emit only stable semantic conventions. */
-    SemconvStability[SemconvStability["STABLE"] = 1] = "STABLE";
-    /** Emit only old semantic conventions. */
-    SemconvStability[SemconvStability["OLD"] = 2] = "OLD";
-    /** Emit both stable and old semantic conventions. */
-    SemconvStability[SemconvStability["DUPLICATE"] = 3] = "DUPLICATE";
-})(SemconvStability || (SemconvStability = {}));
-/**
- * Determine the appropriate semconv stability for the given namespace.
- *
- * This will parse the given string of comma-separated values (often
- * `process.env.OTEL_SEMCONV_STABILITY_OPT_IN`) looking for the `${namespace}`
- * or `${namespace}/dup` tokens. This is a pattern defined by a number of
- * non-normative semconv documents.
- *
- * For example:
- * - namespace 'http': https://opentelemetry.io/docs/specs/semconv/non-normative/http-migration/
- * - namespace 'database': https://opentelemetry.io/docs/specs/semconv/non-normative/database-migration/
- * - namespace 'k8s': https://opentelemetry.io/docs/specs/semconv/non-normative/k8s-migration/
- *
- * Usage:
- *
- *  import {SemconvStability, semconvStabilityFromStr} from '@opentelemetry/instrumentation';
- *
- *  export class FooInstrumentation extends InstrumentationBase<FooInstrumentationConfig> {
- *    private _semconvStability: SemconvStability;
- *    constructor(config: FooInstrumentationConfig = {}) {
- *      super('@opentelemetry/instrumentation-foo', VERSION, config);
- *
- *      // When supporting the OTEL_SEMCONV_STABILITY_OPT_IN envvar
- *      this._semconvStability = semconvStabilityFromStr(
- *        'http',
- *        process.env.OTEL_SEMCONV_STABILITY_OPT_IN
- *      );
- *
- *      // or when supporting a `semconvStabilityOptIn` config option (e.g. for
- *      // the web where there are no envvars).
- *      this._semconvStability = semconvStabilityFromStr(
- *        'http',
- *        config?.semconvStabilityOptIn
- *      );
- *    }
- *  }
- *
- *  // Then, to apply semconv, use the following or similar:
- *  if (this._semconvStability & SemconvStability.OLD) {
- *    // ...
- *  }
- *  if (this._semconvStability & SemconvStability.STABLE) {
- *    // ...
- *  }
- *
- */
-function semconvStabilityFromStr(namespace, str) {
-    let semconvStability = SemconvStability.OLD;
-    // The same parsing of `str` as `getStringListFromEnv` from the core pkg.
-    const entries = str
-        ?.split(',')
-        .map(v => v.trim())
-        .filter(s => s !== '');
-    for (const entry of entries ?? []) {
-        if (entry.toLowerCase() === namespace + '/dup') {
-            // DUPLICATE takes highest precedence.
-            semconvStability = SemconvStability.DUPLICATE;
-            break;
-        }
-        else if (entry.toLowerCase() === namespace) {
-            semconvStability = SemconvStability.STABLE;
-        }
-    }
-    return semconvStability;
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * https://github.com/open-telemetry/opentelemetry-specification/blob/master/specification/trace/semantic_conventions/http.md
- */
-var AttributeNames$3;
+var AttributeNames;
 (function (AttributeNames) {
-    AttributeNames["COMPONENT"] = "component";
-    AttributeNames["HTTP_STATUS_TEXT"] = "http.status_text";
-})(AttributeNames$3 || (AttributeNames$3 = {}));
+    AttributeNames["EVENT_TYPE"] = "event_type";
+    AttributeNames["TARGET_ELEMENT"] = "target_element";
+    AttributeNames["TARGET_XPATH"] = "target_xpath";
+    AttributeNames["HTTP_URL"] = "http.url";
+})(AttributeNames || (AttributeNames = {}));
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -16418,93 +15815,9 @@ var AttributeNames$3;
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-/*
- * This file contains a copy of unstable semantic convention definitions
- * used by this package.
- * @see https://github.com/open-telemetry/opentelemetry-js/tree/main/semantic-conventions#unstable-semconv
- */
-/**
- * Deprecated, use one of `server.address`, `client.address` or `http.request.header.host` instead, depending on the usage.
- *
- * @example www.example.org
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by one of `server.address`, `client.address` or `http.request.header.host`, depending on the usage.
- */
-const ATTR_HTTP_HOST$1 = 'http.host';
-/**
- * Deprecated, use `http.request.method` instead.
- *
- * @example GET
- * @example POST
- * @example HEAD
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.request.method`.
- */
-const ATTR_HTTP_METHOD$1 = 'http.method';
-/**
- * The size of the request payload body in bytes. This is the number of bytes transferred excluding headers and is often, but not always, present as the [Content-Length](https://www.rfc-editor.org/rfc/rfc9110.html#field.content-length) header. For requests using transport encoding, this should be the compressed size.
- *
- * @example 3495
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- */
-const ATTR_HTTP_REQUEST_BODY_SIZE$1 = 'http.request.body.size';
-/**
- * Deprecated, use `http.request.body.size` instead.
- *
- * @example 5493
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.request.body.size`.
- */
-const ATTR_HTTP_REQUEST_CONTENT_LENGTH_UNCOMPRESSED$1 = 'http.request_content_length_uncompressed';
-/**
- * Deprecated, use `url.scheme` instead.
- *
- * @example http
- * @example https
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `url.scheme` instead.
- */
-const ATTR_HTTP_SCHEME$1 = 'http.scheme';
-/**
- * Deprecated, use `http.response.status_code` instead.
- *
- * @example 200
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.response.status_code`.
- */
-const ATTR_HTTP_STATUS_CODE$1 = 'http.status_code';
-/**
- * Deprecated, use `url.full` instead.
- *
- * @example https://www.foo.bar/search?q=OpenTelemetry#SemConv
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `url.full`.
- */
-const ATTR_HTTP_URL$2 = 'http.url';
-/**
- * Deprecated, use `user_agent.original` instead.
- *
- * @example CERN-LineMode/2.15 libwww/2.17b3
- * @example Mozilla/5.0 (iPhone; CPU iPhone OS 14_7_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.2 Mobile/15E148 Safari/604.1
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `user_agent.original`.
- */
-const ATTR_HTTP_USER_AGENT$2 = 'http.user_agent';
+// this is autogenerated file, see scripts/version-update.js
+const PACKAGE_VERSION = '0.53.0';
+const PACKAGE_NAME = '@opentelemetry/instrumentation-user-interaction';
 
 /*
  * Copyright The OpenTelemetry Authors
@@ -16521,2375 +15834,532 @@ const ATTR_HTTP_USER_AGENT$2 = 'http.user_agent';
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-// Much of the logic here overlaps with the same utils file in opentelemetry-instrumentation-xml-http-request
-// These may be unified in the future.
-const DIAG_LOGGER$1 = diag.createComponentLogger({
-    namespace: '@opentelemetry/opentelemetry-instrumentation-fetch/utils',
-});
-/**
- * Helper function to determine payload content length for fetch requests
- *
- * The fetch API is kinda messy: there are a couple of ways the body can be passed in.
- *
- * In all cases, the body param can be some variation of ReadableStream,
- * and ReadableStreams can only be read once! We want to avoid consuming the body here,
- * because that would mean that the body never gets sent with the actual fetch request.
- *
- * Either the first arg is a Request object, which can be cloned
- *   so we can clone that object and read the body of the clone
- *   without disturbing the original argument
- *   However, reading the body here can only be done async; the body() method returns a promise
- *   this means this entire function has to return a promise
- *
- * OR the first arg is a url/string
- *   in which case the second arg has type RequestInit
- *   RequestInit is NOT cloneable, but RequestInit.body is writable
- *   so we can chain it into ReadableStream.pipeThrough()
- *
- *   ReadableStream.pipeThrough() lets us process a stream and returns a new stream
- *   So we can measure the body length as it passes through the pie, but need to attach
- *   the new stream to the original request
- *   so that the browser still has access to the body.
- *
- * @param body
- * @returns promise that resolves to the content length of the body
- */
-function getFetchBodyLength(...args) {
-    if (args[0] instanceof URL || typeof args[0] === 'string') {
-        const requestInit = args[1];
-        if (!requestInit?.body) {
-            return Promise.resolve();
-        }
-        if (requestInit.body instanceof ReadableStream) {
-            const { body, length } = _getBodyNonDestructively(requestInit.body);
-            requestInit.body = body;
-            return length;
-        }
-        else {
-            return Promise.resolve(getXHRBodyLength$1(requestInit.body));
-        }
-    }
-    else {
-        const info = args[0];
-        if (!info?.body) {
-            return Promise.resolve();
-        }
-        return info
-            .clone()
-            .text()
-            .then(t => getByteLength$1(t));
-    }
-}
-function _getBodyNonDestructively(body) {
-    // can't read a ReadableStream without destroying it
-    // but we CAN pipe it through and return a new ReadableStream
-    // some (older) platforms don't expose the pipeThrough method and in that scenario, we're out of luck;
-    //   there's no way to read the stream without consuming it.
-    if (!body.pipeThrough) {
-        DIAG_LOGGER$1.warn('Platform has ReadableStream but not pipeThrough!');
-        return {
-            body,
-            length: Promise.resolve(undefined),
-        };
-    }
-    let length = 0;
-    let resolveLength;
-    const lengthPromise = new Promise(resolve => {
-        resolveLength = resolve;
-    });
-    const transform = new TransformStream({
-        start() { },
-        async transform(chunk, controller) {
-            const bytearray = (await chunk);
-            length += bytearray.byteLength;
-            controller.enqueue(chunk);
-        },
-        flush() {
-            resolveLength(length);
-        },
-    });
-    return {
-        body: body.pipeThrough(transform),
-        length: lengthPromise,
-    };
-}
-function isDocument$1(value) {
-    return typeof Document !== 'undefined' && value instanceof Document;
-}
-/**
- * Helper function to determine payload content length for XHR requests
- * @param body
- * @returns content length
- */
-function getXHRBodyLength$1(body) {
-    if (isDocument$1(body)) {
-        return new XMLSerializer().serializeToString(document).length;
-    }
-    // XMLHttpRequestBodyInit expands to the following:
-    if (typeof body === 'string') {
-        return getByteLength$1(body);
-    }
-    if (body instanceof Blob) {
-        return body.size;
-    }
-    if (body instanceof FormData) {
-        return getFormDataSize$1(body);
-    }
-    if (body instanceof URLSearchParams) {
-        return getByteLength$1(body.toString());
-    }
-    // ArrayBuffer | ArrayBufferView
-    if (body.byteLength !== undefined) {
-        return body.byteLength;
-    }
-    DIAG_LOGGER$1.warn('unknown body type');
-    return undefined;
-}
-const TEXT_ENCODER$1 = new TextEncoder();
-function getByteLength$1(s) {
-    return TEXT_ENCODER$1.encode(s).byteLength;
-}
-function getFormDataSize$1(formData) {
-    let size = 0;
-    for (const [key, value] of formData.entries()) {
-        size += key.length;
-        if (value instanceof Blob) {
-            size += value.size;
-        }
-        else {
-            size += value.length;
-        }
-    }
-    return size;
+/// <reference types="zone.js" />
+const ZONE_CONTEXT_KEY = 'OT_ZONE_CONTEXT';
+const EVENT_NAVIGATION_NAME = 'Navigation:';
+const DEFAULT_EVENT_NAMES = ['click'];
+function defaultShouldPreventSpanCreation() {
+    return false;
 }
 /**
- * Normalize an HTTP request method string per `http.request.method` spec
- * https://github.com/open-telemetry/semantic-conventions/blob/main/docs/http/http-spans.md#http-client-span
- */
-function normalizeHttpRequestMethod$1(method) {
-    const knownMethods = getKnownMethods$1();
-    const methUpper = method.toUpperCase();
-    if (methUpper in knownMethods) {
-        return methUpper;
-    }
-    else {
-        return '_OTHER';
-    }
-}
-const DEFAULT_KNOWN_METHODS$1 = {
-    CONNECT: true,
-    DELETE: true,
-    GET: true,
-    HEAD: true,
-    OPTIONS: true,
-    PATCH: true,
-    POST: true,
-    PUT: true,
-    TRACE: true,
-};
-let knownMethods$1;
-function getKnownMethods$1() {
-    if (knownMethods$1 === undefined) {
-        {
-            knownMethods$1 = DEFAULT_KNOWN_METHODS$1;
-        }
-    }
-    return knownMethods$1;
-}
-const HTTP_PORT_FROM_PROTOCOL$1 = {
-    'https:': '443',
-    'http:': '80',
-};
-function serverPortFromUrl$1(url) {
-    const serverPort = Number(url.port || HTTP_PORT_FROM_PROTOCOL$1[url.protocol]);
-    // Guard with `if (serverPort)` because `Number('') === 0`.
-    if (serverPort && !isNaN(serverPort)) {
-        return serverPort;
-    }
-    else {
-        return undefined;
-    }
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// this is autogenerated file, see scripts/version-update.js
-const VERSION$1 = '0.208.0';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
+ * This class represents a UserInteraction plugin for auto instrumentation.
+ * If zone.js is available then it patches the zone otherwise it patches
+ * addEventListener of HTMLElement
  */
-// how long to wait for observer to collect information about resources
-// this is needed as event "load" is called before observer
-// hard to say how long it should really wait, seems like 300ms is
-// safe enough
-const OBSERVER_WAIT_TIME_MS$1 = 300;
-const isNode = typeof process === 'object' && process.release?.name === 'node';
-/**
- * This class represents a fetch plugin for auto instrumentation
- */
-class FetchInstrumentation extends InstrumentationBase {
-    component = 'fetch';
-    version = VERSION$1;
-    moduleName = this.component;
-    _usedResources = new WeakSet();
-    _tasksCount = 0;
-    _semconvStability;
+class UserInteractionInstrumentation extends InstrumentationBase {
+    version = PACKAGE_VERSION;
+    moduleName = 'user-interaction';
+    _spansData = new WeakMap();
+    // for addEventListener/removeEventListener state
+    _wrappedListeners = new WeakMap();
+    // for event bubbling
+    _eventsSpanMap = new WeakMap();
+    _eventNames;
+    _shouldPreventSpanCreation;
     constructor(config = {}) {
-        super('@opentelemetry/instrumentation-fetch', VERSION$1, config);
-        this._semconvStability = semconvStabilityFromStr('http', config?.semconvStabilityOptIn);
+        super(PACKAGE_NAME, PACKAGE_VERSION, config);
+        this._eventNames = new Set(config?.eventNames ?? DEFAULT_EVENT_NAMES);
+        this._shouldPreventSpanCreation =
+            typeof config?.shouldPreventSpanCreation === 'function'
+                ? config.shouldPreventSpanCreation
+                : defaultShouldPreventSpanCreation;
     }
     init() { }
     /**
-     * Add cors pre flight child span
-     * @param span
-     * @param corsPreFlightRequest
-     */
-    _addChildSpan(span, corsPreFlightRequest) {
-        const childSpan = this.tracer.startSpan('CORS Preflight', {
-            startTime: corsPreFlightRequest[PerformanceTimingNames.FETCH_START],
-        }, trace.setSpan(context.active(), span));
-        const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-        addSpanNetworkEvents(childSpan, corsPreFlightRequest, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
-        childSpan.end(corsPreFlightRequest[PerformanceTimingNames.RESPONSE_END]);
-    }
-    /**
-     * Adds more attributes to span just before ending it
+     * This will check if last task was timeout and will save the time to
+     * fix the user interaction when nothing happens
+     * This timeout comes from xhr plugin which is needed to collect information
+     * about last xhr main request from observer
+     * @param task
      * @param span
-     * @param response
      */
-    _addFinalSpanAttributes(span, response) {
-        const parsedUrl = parseUrl(response.url);
-        if (this._semconvStability & SemconvStability.OLD) {
-            span.setAttribute(ATTR_HTTP_STATUS_CODE$1, response.status);
-            if (response.statusText != null) {
-                span.setAttribute(AttributeNames$3.HTTP_STATUS_TEXT, response.statusText);
-            }
-            span.setAttribute(ATTR_HTTP_HOST$1, parsedUrl.host);
-            span.setAttribute(ATTR_HTTP_SCHEME$1, parsedUrl.protocol.replace(':', ''));
-            if (typeof navigator !== 'undefined') {
-                span.setAttribute(ATTR_HTTP_USER_AGENT$2, navigator.userAgent);
+    _checkForTimeout(task, span) {
+        const spanData = this._spansData.get(span);
+        if (spanData) {
+            if (task.source === 'setTimeout') {
+                spanData.hrTimeLastTimeout = hrTime();
             }
-        }
-        if (this._semconvStability & SemconvStability.STABLE) {
-            span.setAttribute(ATTR_HTTP_RESPONSE_STATUS_CODE, response.status);
-            // TODO: Set server.{address,port} at span creation for sampling decisions
-            // (a "SHOULD" requirement in semconv).
-            span.setAttribute(ATTR_SERVER_ADDRESS, parsedUrl.hostname);
-            const serverPort = serverPortFromUrl$1(parsedUrl);
-            if (serverPort) {
-                span.setAttribute(ATTR_SERVER_PORT, serverPort);
+            else if (task.source !== 'Promise.then' &&
+                task.source !== 'setTimeout') {
+                spanData.hrTimeLastTimeout = undefined;
             }
         }
     }
     /**
-     * Add headers
-     * @param options
-     * @param spanUrl
+     * Controls whether or not to create a span, based on the event type.
+     */
+    _allowEventName(eventName) {
+        return this._eventNames.has(eventName);
+    }
+    /**
+     * Creates a new span
+     * @param element
+     * @param eventName
+     * @param parentSpan
      */
-    _addHeaders(options, spanUrl) {
-        if (!shouldPropagateTraceHeaders(spanUrl, this.getConfig().propagateTraceHeaderCorsUrls)) {
-            const headers = {};
-            propagation.inject(context.active(), headers);
-            if (Object.keys(headers).length > 0) {
-                this._diag.debug('headers inject skipped due to CORS policy');
-            }
-            return;
+    _createSpan(element, eventName, parentSpan) {
+        if (!(element instanceof HTMLElement)) {
+            return undefined;
         }
-        if (options instanceof Request) {
-            propagation.inject(context.active(), options.headers, {
-                set: (h, k, v) => h.set(k, typeof v === 'string' ? v : String(v)),
-            });
+        if (!element.getAttribute) {
+            return undefined;
         }
-        else if (options.headers instanceof Headers) {
-            propagation.inject(context.active(), options.headers, {
-                set: (h, k, v) => h.set(k, typeof v === 'string' ? v : String(v)),
-            });
+        if (element.hasAttribute('disabled')) {
+            return undefined;
         }
-        else if (options.headers instanceof Map) {
-            propagation.inject(context.active(), options.headers, {
-                set: (h, k, v) => h.set(k, typeof v === 'string' ? v : String(v)),
+        if (!this._allowEventName(eventName)) {
+            return undefined;
+        }
+        const xpath = getElementXPath(element, true);
+        try {
+            const span = this.tracer.startSpan(eventName, {
+                attributes: {
+                    [AttributeNames.EVENT_TYPE]: eventName,
+                    [AttributeNames.TARGET_ELEMENT]: element.tagName,
+                    [AttributeNames.TARGET_XPATH]: xpath,
+                    [AttributeNames.HTTP_URL]: window.location.href,
+                },
+            }, parentSpan
+                ? trace.setSpan(context.active(), parentSpan)
+                : undefined);
+            if (this._shouldPreventSpanCreation(eventName, element, span) === true) {
+                return undefined;
+            }
+            this._spansData.set(span, {
+                taskCount: 0,
             });
+            return span;
         }
-        else {
-            const headers = {};
-            propagation.inject(context.active(), headers);
-            options.headers = Object.assign({}, headers, options.headers || {});
+        catch (e) {
+            this._diag.error('failed to start create new user interaction span', e);
         }
+        return undefined;
     }
     /**
-     * Clears the resource timings and all resources assigned with spans
-     *     when {@link FetchPluginConfig.clearTimingResources} is
-     *     set to true (default false)
-     * @private
+     * Decrement number of tasks that left in zone,
+     * This is needed to be able to end span when no more tasks left
+     * @param span
      */
-    _clearResources() {
-        if (this._tasksCount === 0 && this.getConfig().clearTimingResources) {
-            performance.clearResourceTimings();
-            this._usedResources = new WeakSet();
-        }
-    }
-    /**
-     * Creates a new span
-     * @param url
-     * @param options
+    _decrementTask(span) {
+        const spanData = this._spansData.get(span);
+        if (spanData) {
+            spanData.taskCount--;
+            if (spanData.taskCount === 0) {
+                this._tryToEndSpan(span, spanData.hrTimeLastTimeout);
+            }
+        }
+    }
+    /**
+     * Return the current span
+     * @param zone
+     * @private
      */
-    _createSpan(url, options = {}) {
-        if (isUrlIgnored(url, this.getConfig().ignoreUrls)) {
-            this._diag.debug('ignoring span as url matches ignored url');
-            return;
+    _getCurrentSpan(zone) {
+        const context = zone.get(ZONE_CONTEXT_KEY);
+        if (context) {
+            return trace.getSpan(context);
         }
-        let name = '';
-        const attributes = {};
-        if (this._semconvStability & SemconvStability.OLD) {
-            const method = (options.method || 'GET').toUpperCase();
-            name = `HTTP ${method}`;
-            attributes[AttributeNames$3.COMPONENT] = this.moduleName;
-            attributes[ATTR_HTTP_METHOD$1] = method;
-            attributes[ATTR_HTTP_URL$2] = url;
-        }
-        if (this._semconvStability & SemconvStability.STABLE) {
-            const origMethod = options.method;
-            const normMethod = normalizeHttpRequestMethod$1(options.method || 'GET');
-            if (!name) {
-                // The "old" span name wins if emitting both old and stable semconv
-                // ('http/dup').
-                name = normMethod;
-            }
-            attributes[ATTR_HTTP_REQUEST_METHOD] = normMethod;
-            if (normMethod !== origMethod) {
-                attributes[ATTR_HTTP_REQUEST_METHOD_ORIGINAL] = origMethod;
-            }
-            attributes[ATTR_URL_FULL] = url;
-        }
-        return this.tracer.startSpan(name, {
-            kind: SpanKind.CLIENT,
-            attributes,
-        });
+        return context;
     }
     /**
-     * Finds appropriate resource and add network events to the span
+     * Increment number of tasks that are run within the same zone.
+     *     This is needed to be able to end span when no more tasks left
      * @param span
-     * @param resourcesObserver
-     * @param endTime
      */
-    _findResourceAndAddNetworkEvents(span, resourcesObserver, endTime) {
-        let resources = resourcesObserver.entries;
-        if (!resources.length) {
-            if (!performance.getEntriesByType) {
-                return;
-            }
-            // fallback - either Observer is not available or it took longer
-            // then OBSERVER_WAIT_TIME_MS and observer didn't collect enough
-            // information
-            resources = performance.getEntriesByType('resource');
-        }
-        const resource = getResource(resourcesObserver.spanUrl, resourcesObserver.startTime, endTime, resources, this._usedResources, 'fetch');
-        if (resource.mainRequest) {
-            const mainRequest = resource.mainRequest;
-            this._markResourceAsUsed(mainRequest);
-            const corsPreFlightRequest = resource.corsPreFlightRequest;
-            if (corsPreFlightRequest) {
-                this._addChildSpan(span, corsPreFlightRequest);
-                this._markResourceAsUsed(corsPreFlightRequest);
-            }
-            const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-            addSpanNetworkEvents(span, mainRequest, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
+    _incrementTask(span) {
+        const spanData = this._spansData.get(span);
+        if (spanData) {
+            spanData.taskCount++;
         }
     }
     /**
-     * Marks certain [resource]{@link PerformanceResourceTiming} when information
-     * from this is used to add events to span.
-     * This is done to avoid reusing the same resource again for next span
-     * @param resource
+     * Returns true iff we should use the patched callback; false if it's already been patched
      */
-    _markResourceAsUsed(resource) {
-        this._usedResources.add(resource);
+    addPatchedListener(on, type, listener, wrappedListener) {
+        let listener2Type = this._wrappedListeners.get(listener);
+        if (!listener2Type) {
+            listener2Type = new Map();
+            this._wrappedListeners.set(listener, listener2Type);
+        }
+        let element2patched = listener2Type.get(type);
+        if (!element2patched) {
+            element2patched = new Map();
+            listener2Type.set(type, element2patched);
+        }
+        if (element2patched.has(on)) {
+            return false;
+        }
+        element2patched.set(on, wrappedListener);
+        return true;
     }
     /**
-     * Finish span, add attributes, network events etc.
-     * @param span
-     * @param spanData
-     * @param response
+     * Returns the patched version of the callback (or undefined)
      */
-    _endSpan(span, spanData, response) {
-        const endTime = millisToHrTime(Date.now());
-        const performanceEndTime = hrTime();
-        this._addFinalSpanAttributes(span, response);
-        if (this._semconvStability & SemconvStability.STABLE) {
-            // https://github.com/open-telemetry/semantic-conventions/blob/main/docs/http/http-spans.md#status
-            if (response.status >= 400) {
-                span.setStatus({ code: SpanStatusCode.ERROR });
-                span.setAttribute(ATTR_ERROR_TYPE, String(response.status));
+    removePatchedListener(on, type, listener) {
+        const listener2Type = this._wrappedListeners.get(listener);
+        if (!listener2Type) {
+            return undefined;
+        }
+        const element2patched = listener2Type.get(type);
+        if (!element2patched) {
+            return undefined;
+        }
+        const patched = element2patched.get(on);
+        if (patched) {
+            element2patched.delete(on);
+            if (element2patched.size === 0) {
+                listener2Type.delete(type);
+                if (listener2Type.size === 0) {
+                    this._wrappedListeners.delete(listener);
+                }
             }
         }
-        setTimeout(() => {
-            spanData.observer?.disconnect();
-            this._findResourceAndAddNetworkEvents(span, spanData, performanceEndTime);
-            this._tasksCount--;
-            this._clearResources();
-            span.end(endTime);
-        }, OBSERVER_WAIT_TIME_MS$1);
+        return patched;
+    }
+    // utility method to deal with the Function|EventListener nature of addEventListener
+    _invokeListener(listener, target, args) {
+        if (typeof listener === 'function') {
+            return listener.apply(target, args);
+        }
+        else {
+            return listener.handleEvent(args[0]);
+        }
     }
     /**
-     * Patches the constructor of fetch
+     * This patches the addEventListener of HTMLElement to be able to
+     * auto instrument the click events
+     * This is done when zone is not available
      */
-    _patchConstructor() {
-        return original => {
-            const plugin = this;
-            return function patchConstructor(...args) {
-                const self = this;
-                const url = parseUrl(args[0] instanceof Request ? args[0].url : String(args[0])).href;
-                const options = args[0] instanceof Request ? args[0] : args[1] || {};
-                const createdSpan = plugin._createSpan(url, options);
-                if (!createdSpan) {
-                    return original.apply(this, args);
-                }
-                const spanData = plugin._prepareSpanData(url);
-                if (plugin.getConfig().measureRequestSize) {
-                    getFetchBodyLength(...args)
-                        .then(bodyLength => {
-                        if (!bodyLength)
-                            return;
-                        if (plugin._semconvStability & SemconvStability.OLD) {
-                            createdSpan.setAttribute(ATTR_HTTP_REQUEST_CONTENT_LENGTH_UNCOMPRESSED$1, bodyLength);
-                        }
-                        if (plugin._semconvStability & SemconvStability.STABLE) {
-                            createdSpan.setAttribute(ATTR_HTTP_REQUEST_BODY_SIZE$1, bodyLength);
-                        }
-                    })
-                        .catch(error => {
-                        plugin._diag.warn('getFetchBodyLength', error);
-                    });
-                }
-                function endSpanOnError(span, error) {
-                    plugin._applyAttributesAfterFetch(span, options, error);
-                    plugin._endSpan(span, spanData, {
-                        status: error.status || 0,
-                        statusText: error.message,
-                        url,
-                    });
+    _patchAddEventListener() {
+        const plugin = this;
+        return (original) => {
+            return function addEventListenerPatched(type, listener, useCapture) {
+                // Forward calls with listener = null
+                if (!listener) {
+                    return original.call(this, type, listener, useCapture);
                 }
-                function endSpanOnSuccess(span, response) {
-                    plugin._applyAttributesAfterFetch(span, options, response);
-                    if (response.status >= 200 && response.status < 400) {
-                        plugin._endSpan(span, spanData, response);
+                // filter out null (typeof null === 'object')
+                const once = useCapture && typeof useCapture === 'object' && useCapture.once;
+                const patchedListener = function (...args) {
+                    let parentSpan;
+                    const event = args[0];
+                    const target = event?.target;
+                    if (event) {
+                        parentSpan = plugin._eventsSpanMap.get(event);
                     }
-                    else {
-                        plugin._endSpan(span, spanData, {
-                            status: response.status,
-                            statusText: response.statusText,
-                            url,
-                        });
+                    if (once) {
+                        plugin.removePatchedListener(this, type, listener);
                     }
-                }
-                function withCancelPropagation(body, readerClone) {
-                    if (!body)
-                        return null;
-                    const reader = body.getReader();
-                    return new ReadableStream({
-                        async pull(controller) {
-                            try {
-                                const { value, done } = await reader.read();
-                                if (done) {
-                                    reader.releaseLock();
-                                    controller.close();
-                                }
-                                else {
-                                    controller.enqueue(value);
-                                }
-                            }
-                            catch (err) {
-                                controller.error(err);
-                                reader.cancel(err).catch(_ => { });
-                                try {
-                                    reader.releaseLock();
-                                }
-                                catch {
-                                    // Spec reference:
-                                    // https://streams.spec.whatwg.org/#default-reader-release-lock
-                                    //
-                                    // releaseLock() only throws if called on an invalid reader
-                                    // (i.e. reader.[[stream]] is undefined, meaning the lock is already released
-                                    // or the reader was never associated). In normal use this cannot happen.
-                                    // This catch is defensive only.
-                                }
-                            }
-                        },
-                        cancel(reason) {
-                            readerClone.cancel(reason).catch(_ => { });
-                            return reader.cancel(reason);
-                        },
-                    });
-                }
-                function onSuccess(span, resolve, response) {
-                    let proxiedResponse = null;
-                    try {
-                        // TODO: Switch to a consumer-driven model and drop `resClone`.
-                        // Keeping eager consumption here to preserve current behavior and avoid breaking existing tests.
-                        // Context: discussion in PR #5894 → https://github.com/open-telemetry/opentelemetry-js/pull/5894
-                        const resClone = response.clone();
-                        const body = resClone.body;
-                        if (body) {
-                            const reader = body.getReader();
-                            const isNullBodyStatus = 
-                            // 101 responses and protocol upgrading is handled internally by the browser
-                            response.status === 204 ||
-                                response.status === 205 ||
-                                response.status === 304;
-                            const wrappedBody = isNullBodyStatus
-                                ? null
-                                : withCancelPropagation(response.body, reader);
-                            proxiedResponse = new Response(wrappedBody, {
-                                status: response.status,
-                                statusText: response.statusText,
-                                headers: response.headers,
-                            });
-                            const read = () => {
-                                reader.read().then(({ done }) => {
-                                    if (done) {
-                                        endSpanOnSuccess(span, response);
-                                    }
-                                    else {
-                                        read();
-                                    }
-                                }, error => {
-                                    endSpanOnError(span, error);
-                                });
-                            };
-                            read();
-                        }
-                        else {
-                            // some older browsers don't have .body implemented
-                            endSpanOnSuccess(span, response);
+                    const span = plugin._createSpan(target, type, parentSpan);
+                    if (span) {
+                        if (event) {
+                            plugin._eventsSpanMap.set(event, span);
                         }
+                        return context.with(trace.setSpan(context.active(), span), () => {
+                            const result = plugin._invokeListener(listener, this, args);
+                            // no zone so end span immediately
+                            span.end();
+                            return result;
+                        });
                     }
-                    finally {
-                        resolve(proxiedResponse ?? response);
-                    }
-                }
-                function onError(span, reject, error) {
-                    try {
-                        endSpanOnError(span, error);
-                    }
-                    finally {
-                        reject(error);
+                    else {
+                        return plugin._invokeListener(listener, this, args);
                     }
+                };
+                if (plugin.addPatchedListener(this, type, listener, patchedListener)) {
+                    return original.call(this, type, patchedListener, useCapture);
                 }
-                return new Promise((resolve, reject) => {
-                    return context.with(trace.setSpan(context.active(), createdSpan), () => {
-                        plugin._addHeaders(options, url);
-                        plugin._callRequestHook(createdSpan, options);
-                        plugin._tasksCount++;
-                        return original
-                            .apply(self, options instanceof Request ? [options] : [url, options])
-                            .then(onSuccess.bind(self, createdSpan, resolve), onError.bind(self, createdSpan, reject));
-                    });
-                });
             };
         };
     }
-    _applyAttributesAfterFetch(span, request, result) {
-        const applyCustomAttributesOnSpan = this.getConfig().applyCustomAttributesOnSpan;
-        if (applyCustomAttributesOnSpan) {
-            safeExecuteInTheMiddle(() => applyCustomAttributesOnSpan(span, request, result), error => {
-                if (!error) {
-                    return;
+    /**
+     * This patches the removeEventListener of HTMLElement to handle the fact that
+     * we patched the original callbacks
+     * This is done when zone is not available
+     */
+    _patchRemoveEventListener() {
+        const plugin = this;
+        return (original) => {
+            return function removeEventListenerPatched(type, listener, useCapture) {
+                const wrappedListener = plugin.removePatchedListener(this, type, listener);
+                if (wrappedListener) {
+                    return original.call(this, type, wrappedListener, useCapture);
                 }
-                this._diag.error('applyCustomAttributesOnSpan', error);
-            });
-        }
-    }
-    _callRequestHook(span, request) {
-        const requestHook = this.getConfig().requestHook;
-        if (requestHook) {
-            safeExecuteInTheMiddle(() => requestHook(span, request), error => {
-                if (!error) {
-                    return;
+                else {
+                    return original.call(this, type, listener, useCapture);
                 }
-                this._diag.error('requestHook', error);
-            });
-        }
+            };
+        };
+    }
+    /**
+     * Most browser provide event listener api via EventTarget in prototype chain.
+     * Exception to this is IE 11 which has it on the prototypes closest to EventTarget:
+     *
+     * * - has addEventListener in IE
+     * ** - has addEventListener in all other browsers
+     * ! - missing in IE
+     *
+     * HTMLElement -> Element -> Node * -> EventTarget **! -> Object
+     * Document -> Node * -> EventTarget **! -> Object
+     * Window * -> WindowProperties ! -> EventTarget **! -> Object
+     */
+    _getPatchableEventTargets() {
+        return window.EventTarget
+            ? [EventTarget.prototype]
+            : [Node.prototype, Window.prototype];
+    }
+    /**
+     * Patches the history api
+     */
+    _patchHistoryApi() {
+        this._unpatchHistoryApi();
+        this._wrap(history, 'replaceState', this._patchHistoryMethod());
+        this._wrap(history, 'pushState', this._patchHistoryMethod());
+        this._wrap(history, 'back', this._patchHistoryMethod());
+        this._wrap(history, 'forward', this._patchHistoryMethod());
+        this._wrap(history, 'go', this._patchHistoryMethod());
     }
     /**
-     * Prepares a span data - needed later for matching appropriate network
-     *     resources
-     * @param spanUrl
+     * Patches the certain history api method
      */
-    _prepareSpanData(spanUrl) {
-        const startTime = hrTime();
-        const entries = [];
-        if (typeof PerformanceObserver !== 'function') {
-            return { entries, startTime, spanUrl };
-        }
-        const observer = new PerformanceObserver(list => {
-            const perfObsEntries = list.getEntries();
-            perfObsEntries.forEach(entry => {
-                if (entry.initiatorType === 'fetch' && entry.name === spanUrl) {
-                    entries.push(entry);
+    _patchHistoryMethod() {
+        const plugin = this;
+        return (original) => {
+            return function patchHistoryMethod(...args) {
+                const url = `${location.pathname}${location.hash}${location.search}`;
+                const result = original.apply(this, args);
+                const urlAfter = `${location.pathname}${location.hash}${location.search}`;
+                if (url !== urlAfter) {
+                    plugin._updateInteractionName(urlAfter);
                 }
-            });
-        });
-        observer.observe({
-            entryTypes: ['resource'],
-        });
-        return { entries, observer, startTime, spanUrl };
+                return result;
+            };
+        };
     }
     /**
-     * implements enable function
+     * unpatch the history api methods
      */
-    enable() {
-        if (isNode) {
-            // Node.js v18+ *does* have a global `fetch()`, but this package does not
-            // support instrumenting it.
-            this._diag.warn("this instrumentation is intended for web usage only, it does not instrument Node.js's fetch()");
-            return;
-        }
-        if (isWrapped(fetch)) {
-            this._unwrap(_globalThis$1, 'fetch');
-            this._diag.debug('removing previous patch for constructor');
-        }
-        this._wrap(_globalThis$1, 'fetch', this._patchConstructor());
+    _unpatchHistoryApi() {
+        if (isWrapped(history.replaceState))
+            this._unwrap(history, 'replaceState');
+        if (isWrapped(history.pushState))
+            this._unwrap(history, 'pushState');
+        if (isWrapped(history.back))
+            this._unwrap(history, 'back');
+        if (isWrapped(history.forward))
+            this._unwrap(history, 'forward');
+        if (isWrapped(history.go))
+            this._unwrap(history, 'go');
     }
     /**
-     * implements unpatch function
+     * Updates interaction span name
+     * @param url
      */
-    disable() {
-        if (isNode) {
-            return;
+    _updateInteractionName(url) {
+        const span = trace.getSpan(context.active());
+        if (span && typeof span.updateName === 'function') {
+            span.updateName(`${EVENT_NAVIGATION_NAME} ${url}`);
         }
-        this._unwrap(_globalThis$1, 'fetch');
-        this._usedResources = new WeakSet();
-    }
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/*
- * This file contains a copy of unstable semantic convention definitions
- * used by this package.
- * @see https://github.com/open-telemetry/opentelemetry-js/tree/main/semantic-conventions#unstable-semconv
- */
-/**
- * Deprecated, use one of `server.address`, `client.address` or `http.request.header.host` instead, depending on the usage.
- *
- * @example www.example.org
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by one of `server.address`, `client.address` or `http.request.header.host`, depending on the usage.
- */
-const ATTR_HTTP_HOST = 'http.host';
-/**
- * Deprecated, use `http.request.method` instead.
- *
- * @example GET
- * @example POST
- * @example HEAD
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.request.method`.
- */
-const ATTR_HTTP_METHOD = 'http.method';
-/**
- * The size of the request payload body in bytes. This is the number of bytes transferred excluding headers and is often, but not always, present as the [Content-Length](https://www.rfc-editor.org/rfc/rfc9110.html#field.content-length) header. For requests using transport encoding, this should be the compressed size.
- *
- * @example 3495
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- */
-const ATTR_HTTP_REQUEST_BODY_SIZE = 'http.request.body.size';
-/**
- * Deprecated, use `http.request.body.size` instead.
- *
- * @example 5493
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.request.body.size`.
- */
-const ATTR_HTTP_REQUEST_CONTENT_LENGTH_UNCOMPRESSED = 'http.request_content_length_uncompressed';
-/**
- * Deprecated, use `url.scheme` instead.
- *
- * @example http
- * @example https
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `url.scheme` instead.
- */
-const ATTR_HTTP_SCHEME = 'http.scheme';
-/**
- * Deprecated, use `http.response.status_code` instead.
- *
- * @example 200
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.response.status_code`.
- */
-const ATTR_HTTP_STATUS_CODE = 'http.status_code';
-/**
- * Deprecated, use `url.full` instead.
- *
- * @example https://www.foo.bar/search?q=OpenTelemetry#SemConv
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `url.full`.
- */
-const ATTR_HTTP_URL$1 = 'http.url';
-/**
- * Deprecated, use `user_agent.original` instead.
- *
- * @example CERN-LineMode/2.15 libwww/2.17b3
- * @example Mozilla/5.0 (iPhone; CPU iPhone OS 14_7_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.2 Mobile/15E148 Safari/604.1
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `user_agent.original`.
- */
-const ATTR_HTTP_USER_AGENT$1 = 'http.user_agent';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var EventNames$1;
-(function (EventNames) {
-    EventNames["METHOD_OPEN"] = "open";
-    EventNames["METHOD_SEND"] = "send";
-    EventNames["EVENT_ABORT"] = "abort";
-    EventNames["EVENT_ERROR"] = "error";
-    EventNames["EVENT_LOAD"] = "loaded";
-    EventNames["EVENT_TIMEOUT"] = "timeout";
-})(EventNames$1 || (EventNames$1 = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// Much of the logic here overlaps with the same utils file in opentelemetry-instrumentation-fetch
-// These may be unified in the future.
-const DIAG_LOGGER = diag.createComponentLogger({
-    namespace: '@opentelemetry/opentelemetry-instrumentation-xml-http-request/utils',
-});
-function isDocument(value) {
-    return typeof Document !== 'undefined' && value instanceof Document;
-}
-/**
- * Helper function to determine payload content length for XHR requests
- * @param body
- * @returns content length
- */
-function getXHRBodyLength(body) {
-    if (isDocument(body)) {
-        return new XMLSerializer().serializeToString(document).length;
-    }
-    // XMLHttpRequestBodyInit expands to the following:
-    if (typeof body === 'string') {
-        return getByteLength(body);
-    }
-    if (body instanceof Blob) {
-        return body.size;
-    }
-    if (body instanceof FormData) {
-        return getFormDataSize(body);
-    }
-    if (body instanceof URLSearchParams) {
-        return getByteLength(body.toString());
-    }
-    // ArrayBuffer | ArrayBufferView
-    if (body.byteLength !== undefined) {
-        return body.byteLength;
-    }
-    DIAG_LOGGER.warn('unknown body type');
-    return undefined;
-}
-const TEXT_ENCODER = new TextEncoder();
-function getByteLength(s) {
-    return TEXT_ENCODER.encode(s).byteLength;
-}
-function getFormDataSize(formData) {
-    let size = 0;
-    for (const [key, value] of formData.entries()) {
-        size += key.length;
-        if (value instanceof Blob) {
-            size += value.size;
-        }
-        else {
-            size += value.length;
-        }
-    }
-    return size;
-}
-/**
- * Normalize an HTTP request method string per `http.request.method` spec
- * https://github.com/open-telemetry/semantic-conventions/blob/main/docs/http/http-spans.md#http-client-span
- */
-function normalizeHttpRequestMethod(method) {
-    const knownMethods = getKnownMethods();
-    const methUpper = method.toUpperCase();
-    if (methUpper in knownMethods) {
-        return methUpper;
-    }
-    else {
-        return '_OTHER';
-    }
-}
-const DEFAULT_KNOWN_METHODS = {
-    CONNECT: true,
-    DELETE: true,
-    GET: true,
-    HEAD: true,
-    OPTIONS: true,
-    PATCH: true,
-    POST: true,
-    PUT: true,
-    TRACE: true,
-};
-let knownMethods;
-function getKnownMethods() {
-    if (knownMethods === undefined) {
-        {
-            knownMethods = DEFAULT_KNOWN_METHODS;
-        }
-    }
-    return knownMethods;
-}
-const HTTP_PORT_FROM_PROTOCOL = {
-    'https:': '443',
-    'http:': '80',
-};
-function serverPortFromUrl(url) {
-    const serverPort = Number(url.port || HTTP_PORT_FROM_PROTOCOL[url.protocol]);
-    // Guard with `if (serverPort)` because `Number('') === 0`.
-    if (serverPort && !isNaN(serverPort)) {
-        return serverPort;
-    }
-    else {
-        return undefined;
-    }
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// this is autogenerated file, see scripts/version-update.js
-const VERSION = '0.208.0';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * https://github.com/open-telemetry/opentelemetry-specification/blob/master/specification/trace/semantic_conventions/http.md
- */
-var AttributeNames$2;
-(function (AttributeNames) {
-    AttributeNames["HTTP_STATUS_TEXT"] = "http.status_text";
-})(AttributeNames$2 || (AttributeNames$2 = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// how long to wait for observer to collect information about resources
-// this is needed as event "load" is called before observer
-// hard to say how long it should really wait, seems like 300ms is
-// safe enough
-const OBSERVER_WAIT_TIME_MS = 300;
-/**
- * This class represents a XMLHttpRequest plugin for auto instrumentation
- */
-class XMLHttpRequestInstrumentation extends InstrumentationBase {
-    component = 'xml-http-request';
-    version = VERSION;
-    moduleName = this.component;
-    _tasksCount = 0;
-    _xhrMem = new WeakMap();
-    _usedResources = new WeakSet();
-    _semconvStability;
-    constructor(config = {}) {
-        super('@opentelemetry/instrumentation-xml-http-request', VERSION, config);
-        this._semconvStability = semconvStabilityFromStr('http', config?.semconvStabilityOptIn);
-    }
-    init() { }
-    /**
-     * Adds custom headers to XMLHttpRequest
-     * @param xhr
-     * @param spanUrl
-     * @private
-     */
-    _addHeaders(xhr, spanUrl) {
-        const url = parseUrl(spanUrl).href;
-        if (!shouldPropagateTraceHeaders(url, this.getConfig().propagateTraceHeaderCorsUrls)) {
-            const headers = {};
-            propagation.inject(context.active(), headers);
-            if (Object.keys(headers).length > 0) {
-                this._diag.debug('headers inject skipped due to CORS policy');
-            }
-            return;
-        }
-        const headers = {};
-        propagation.inject(context.active(), headers);
-        Object.keys(headers).forEach(key => {
-            xhr.setRequestHeader(key, String(headers[key]));
-        });
-    }
-    /**
-     * Add cors pre flight child span
-     * @param span
-     * @param corsPreFlightRequest
-     * @private
-     */
-    _addChildSpan(span, corsPreFlightRequest) {
-        context.with(trace.setSpan(context.active(), span), () => {
-            const childSpan = this.tracer.startSpan('CORS Preflight', {
-                startTime: corsPreFlightRequest[PerformanceTimingNames.FETCH_START],
-            });
-            const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-            addSpanNetworkEvents(childSpan, corsPreFlightRequest, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
-            childSpan.end(corsPreFlightRequest[PerformanceTimingNames.RESPONSE_END]);
-        });
-    }
-    /**
-     * Add attributes when span is going to end
-     * @param span
-     * @param xhr
-     * @param spanUrl
-     * @private
-     */
-    _addFinalSpanAttributes(span, xhrMem, spanUrl) {
-        if (this._semconvStability & SemconvStability.OLD) {
-            if (xhrMem.status !== undefined) {
-                span.setAttribute(ATTR_HTTP_STATUS_CODE, xhrMem.status);
-            }
-            if (xhrMem.statusText !== undefined) {
-                span.setAttribute(AttributeNames$2.HTTP_STATUS_TEXT, xhrMem.statusText);
-            }
-            if (typeof spanUrl === 'string') {
-                const parsedUrl = parseUrl(spanUrl);
-                span.setAttribute(ATTR_HTTP_HOST, parsedUrl.host);
-                span.setAttribute(ATTR_HTTP_SCHEME, parsedUrl.protocol.replace(':', ''));
-            }
-            // @TODO do we want to collect this or it will be collected earlier once only or
-            //    maybe when parent span is not available ?
-            span.setAttribute(ATTR_HTTP_USER_AGENT$1, navigator.userAgent);
-        }
-        if (this._semconvStability & SemconvStability.STABLE) {
-            if (xhrMem.status) {
-                // Intentionally exclude status=0, because XHR uses 0 for before a
-                // response is received and semconv says to only add the attribute if
-                // received a response.
-                span.setAttribute(ATTR_HTTP_RESPONSE_STATUS_CODE, xhrMem.status);
-            }
-        }
-    }
-    _applyAttributesAfterXHR(span, xhr) {
-        const applyCustomAttributesOnSpan = this.getConfig().applyCustomAttributesOnSpan;
-        if (typeof applyCustomAttributesOnSpan === 'function') {
-            safeExecuteInTheMiddle(() => applyCustomAttributesOnSpan(span, xhr), error => {
-                if (!error) {
-                    return;
-                }
-                this._diag.error('applyCustomAttributesOnSpan', error);
-            });
-        }
-    }
-    /**
-     * will collect information about all resources created
-     * between "send" and "end" with additional waiting for main resource
-     * @param xhr
-     * @param spanUrl
-     * @private
-     */
-    _addResourceObserver(xhr, spanUrl) {
-        const xhrMem = this._xhrMem.get(xhr);
-        if (!xhrMem ||
-            typeof PerformanceObserver !== 'function' ||
-            typeof PerformanceResourceTiming !== 'function') {
-            return;
-        }
-        xhrMem.createdResources = {
-            observer: new PerformanceObserver(list => {
-                const entries = list.getEntries();
-                const parsedUrl = parseUrl(spanUrl);
-                entries.forEach(entry => {
-                    if (entry.initiatorType === 'xmlhttprequest' &&
-                        entry.name === parsedUrl.href) {
-                        if (xhrMem.createdResources) {
-                            xhrMem.createdResources.entries.push(entry);
-                        }
-                    }
-                });
-            }),
-            entries: [],
-        };
-        xhrMem.createdResources.observer.observe({
-            entryTypes: ['resource'],
-        });
-    }
-    /**
-     * Clears the resource timings and all resources assigned with spans
-     *     when {@link XMLHttpRequestInstrumentationConfig.clearTimingResources} is
-     *     set to true (default false)
-     * @private
-     */
-    _clearResources() {
-        if (this._tasksCount === 0 && this.getConfig().clearTimingResources) {
-            otperformance.clearResourceTimings();
-            this._xhrMem = new WeakMap();
-            this._usedResources = new WeakSet();
-        }
-    }
-    /**
-     * Finds appropriate resource and add network events to the span
-     * @param span
-     */
-    _findResourceAndAddNetworkEvents(xhrMem, span, spanUrl, startTime, endTime) {
-        if (!spanUrl || !startTime || !endTime || !xhrMem.createdResources) {
-            return;
-        }
-        let resources = xhrMem.createdResources.entries;
-        if (!resources || !resources.length) {
-            // fallback - either Observer is not available or it took longer
-            // then OBSERVER_WAIT_TIME_MS and observer didn't collect enough
-            // information
-            // ts thinks this is the perf_hooks module, but it is the browser performance api
-            resources = otperformance.getEntriesByType('resource');
-        }
-        const resource = getResource(parseUrl(spanUrl).href, startTime, endTime, resources, this._usedResources);
-        if (resource.mainRequest) {
-            const mainRequest = resource.mainRequest;
-            this._markResourceAsUsed(mainRequest);
-            const corsPreFlightRequest = resource.corsPreFlightRequest;
-            if (corsPreFlightRequest) {
-                this._addChildSpan(span, corsPreFlightRequest);
-                this._markResourceAsUsed(corsPreFlightRequest);
-            }
-            const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-            addSpanNetworkEvents(span, mainRequest, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
-        }
-    }
-    /**
-     * Removes the previous information about span.
-     * This might happened when the same xhr is used again.
-     * @param xhr
-     * @private
-     */
-    _cleanPreviousSpanInformation(xhr) {
-        const xhrMem = this._xhrMem.get(xhr);
-        if (xhrMem) {
-            const callbackToRemoveEvents = xhrMem.callbackToRemoveEvents;
-            if (callbackToRemoveEvents) {
-                callbackToRemoveEvents();
-            }
-            this._xhrMem.delete(xhr);
-        }
-    }
-    /**
-     * Creates a new span when method "open" is called
-     * @param xhr
-     * @param url
-     * @param method
-     * @private
-     */
-    _createSpan(xhr, url, method) {
-        if (isUrlIgnored(url, this.getConfig().ignoreUrls)) {
-            this._diag.debug('ignoring span as url matches ignored url');
-            return;
-        }
-        let name = '';
-        const parsedUrl = parseUrl(url);
-        const attributes = {};
-        if (this._semconvStability & SemconvStability.OLD) {
-            name = method.toUpperCase();
-            attributes[ATTR_HTTP_METHOD] = method;
-            attributes[ATTR_HTTP_URL$1] = parsedUrl.toString();
-        }
-        if (this._semconvStability & SemconvStability.STABLE) {
-            const origMethod = method;
-            const normMethod = normalizeHttpRequestMethod(method);
-            if (!name) {
-                // The "old" span name wins if emitting both old and stable semconv
-                // ('http/dup').
-                name = normMethod;
-            }
-            attributes[ATTR_HTTP_REQUEST_METHOD] = normMethod;
-            if (normMethod !== origMethod) {
-                attributes[ATTR_HTTP_REQUEST_METHOD_ORIGINAL] = origMethod;
-            }
-            attributes[ATTR_URL_FULL] = parsedUrl.toString();
-            attributes[ATTR_SERVER_ADDRESS] = parsedUrl.hostname;
-            const serverPort = serverPortFromUrl(parsedUrl);
-            if (serverPort) {
-                attributes[ATTR_SERVER_PORT] = serverPort;
-            }
-        }
-        const currentSpan = this.tracer.startSpan(name, {
-            kind: SpanKind.CLIENT,
-            attributes,
-        });
-        currentSpan.addEvent(EventNames$1.METHOD_OPEN);
-        this._cleanPreviousSpanInformation(xhr);
-        this._xhrMem.set(xhr, {
-            span: currentSpan,
-            spanUrl: url,
-        });
-        return currentSpan;
-    }
-    /**
-     * Marks certain [resource]{@link PerformanceResourceTiming} when information
-     * from this is used to add events to span.
-     * This is done to avoid reusing the same resource again for next span
-     * @param resource
-     * @private
-     */
-    _markResourceAsUsed(resource) {
-        this._usedResources.add(resource);
     }
     /**
-     * Patches the method open
-     * @private
+     * Patches zone cancel task - this is done to be able to correctly
+     * decrement the number of remaining tasks
      */
-    _patchOpen() {
+    _patchZoneCancelTask() {
+        const plugin = this;
         return (original) => {
-            const plugin = this;
-            return function patchOpen(...args) {
-                const method = args[0];
-                const url = args[1];
-                plugin._createSpan(this, url, method);
-                return original.apply(this, args);
-            };
-        };
-    }
-    /**
-     * Patches the method send
-     * @private
-     */
-    _patchSend() {
-        const plugin = this;
-        function endSpanTimeout(eventName, xhrMem, performanceEndTime, endTime) {
-            const callbackToRemoveEvents = xhrMem.callbackToRemoveEvents;
-            if (typeof callbackToRemoveEvents === 'function') {
-                callbackToRemoveEvents();
-            }
-            const { span, spanUrl, sendStartTime } = xhrMem;
-            if (span) {
-                plugin._findResourceAndAddNetworkEvents(xhrMem, span, spanUrl, sendStartTime, performanceEndTime);
-                span.addEvent(eventName, endTime);
-                plugin._addFinalSpanAttributes(span, xhrMem, spanUrl);
-                span.end(endTime);
-                plugin._tasksCount--;
-            }
-            plugin._clearResources();
-        }
-        function endSpan(eventName, xhr, isError, errorType) {
-            const xhrMem = plugin._xhrMem.get(xhr);
-            if (!xhrMem) {
-                return;
-            }
-            xhrMem.status = xhr.status;
-            xhrMem.statusText = xhr.statusText;
-            plugin._xhrMem.delete(xhr);
-            if (xhrMem.span) {
-                const span = xhrMem.span;
-                plugin._applyAttributesAfterXHR(span, xhr);
-                if (plugin._semconvStability & SemconvStability.STABLE) {
-                    if (isError) {
-                        if (errorType) {
-                            span.setStatus({
-                                code: SpanStatusCode.ERROR,
-                                message: errorType,
-                            });
-                            span.setAttribute(ATTR_ERROR_TYPE, errorType);
-                        }
-                    }
-                    else if (xhrMem.status && xhrMem.status >= 400) {
-                        span.setStatus({ code: SpanStatusCode.ERROR });
-                        span.setAttribute(ATTR_ERROR_TYPE, String(xhrMem.status));
-                    }
-                }
-            }
-            const performanceEndTime = hrTime();
-            const endTime = Date.now();
-            // the timeout is needed as observer doesn't have yet information
-            // when event "load" is called. Also the time may differ depends on
-            // browser and speed of computer
-            setTimeout(() => {
-                endSpanTimeout(eventName, xhrMem, performanceEndTime, endTime);
-            }, OBSERVER_WAIT_TIME_MS);
-        }
-        function onError() {
-            endSpan(EventNames$1.EVENT_ERROR, this, true, 'error');
-        }
-        function onAbort() {
-            endSpan(EventNames$1.EVENT_ABORT, this, false);
-        }
-        function onTimeout() {
-            endSpan(EventNames$1.EVENT_TIMEOUT, this, true, 'timeout');
-        }
-        function onLoad() {
-            if (this.status < 299) {
-                endSpan(EventNames$1.EVENT_LOAD, this, false);
-            }
-            else {
-                endSpan(EventNames$1.EVENT_ERROR, this, false);
-            }
-        }
-        function unregister(xhr) {
-            xhr.removeEventListener('abort', onAbort);
-            xhr.removeEventListener('error', onError);
-            xhr.removeEventListener('load', onLoad);
-            xhr.removeEventListener('timeout', onTimeout);
-            const xhrMem = plugin._xhrMem.get(xhr);
-            if (xhrMem) {
-                xhrMem.callbackToRemoveEvents = undefined;
-            }
-        }
-        return (original) => {
-            return function patchSend(...args) {
-                const xhrMem = plugin._xhrMem.get(this);
-                if (!xhrMem) {
-                    return original.apply(this, args);
-                }
-                const currentSpan = xhrMem.span;
-                const spanUrl = xhrMem.spanUrl;
-                if (currentSpan && spanUrl) {
-                    if (plugin.getConfig().measureRequestSize && args?.[0]) {
-                        const body = args[0];
-                        const bodyLength = getXHRBodyLength(body);
-                        if (bodyLength !== undefined) {
-                            if (plugin._semconvStability & SemconvStability.OLD) {
-                                currentSpan.setAttribute(ATTR_HTTP_REQUEST_CONTENT_LENGTH_UNCOMPRESSED, bodyLength);
-                            }
-                            if (plugin._semconvStability & SemconvStability.STABLE) {
-                                currentSpan.setAttribute(ATTR_HTTP_REQUEST_BODY_SIZE, bodyLength);
-                            }
-                        }
-                    }
-                    context.with(trace.setSpan(context.active(), currentSpan), () => {
-                        plugin._tasksCount++;
-                        xhrMem.sendStartTime = hrTime();
-                        currentSpan.addEvent(EventNames$1.METHOD_SEND);
-                        this.addEventListener('abort', onAbort);
-                        this.addEventListener('error', onError);
-                        this.addEventListener('load', onLoad);
-                        this.addEventListener('timeout', onTimeout);
-                        xhrMem.callbackToRemoveEvents = () => {
-                            unregister(this);
-                            if (xhrMem.createdResources) {
-                                xhrMem.createdResources.observer.disconnect();
-                            }
-                        };
-                        plugin._addHeaders(this, spanUrl);
-                        plugin._addResourceObserver(this, spanUrl);
-                    });
-                }
-                return original.apply(this, args);
-            };
-        };
-    }
-    /**
-     * implements enable function
-     */
-    enable() {
-        this._diag.debug('applying patch to', this.moduleName, this.version);
-        if (isWrapped(XMLHttpRequest.prototype.open)) {
-            this._unwrap(XMLHttpRequest.prototype, 'open');
-            this._diag.debug('removing previous patch from method open');
-        }
-        if (isWrapped(XMLHttpRequest.prototype.send)) {
-            this._unwrap(XMLHttpRequest.prototype, 'send');
-            this._diag.debug('removing previous patch from method send');
-        }
-        this._wrap(XMLHttpRequest.prototype, 'open', this._patchOpen());
-        this._wrap(XMLHttpRequest.prototype, 'send', this._patchSend());
-    }
-    /**
-     * implements disable function
-     */
-    disable() {
-        this._diag.debug('removing patch from', this.moduleName, this.version);
-        this._unwrap(XMLHttpRequest.prototype, 'open');
-        this._unwrap(XMLHttpRequest.prototype, 'send');
-        this._tasksCount = 0;
-        this._xhrMem = new WeakMap();
-        this._usedResources = new WeakSet();
-    }
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var AttributeNames$1;
-(function (AttributeNames) {
-    AttributeNames["EVENT_TYPE"] = "event_type";
-    AttributeNames["TARGET_ELEMENT"] = "target_element";
-    AttributeNames["TARGET_XPATH"] = "target_xpath";
-    AttributeNames["HTTP_URL"] = "http.url";
-})(AttributeNames$1 || (AttributeNames$1 = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// this is autogenerated file, see scripts/version-update.js
-const PACKAGE_VERSION$1 = '0.53.0';
-const PACKAGE_NAME$1 = '@opentelemetry/instrumentation-user-interaction';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/// <reference types="zone.js" />
-const ZONE_CONTEXT_KEY = 'OT_ZONE_CONTEXT';
-const EVENT_NAVIGATION_NAME = 'Navigation:';
-const DEFAULT_EVENT_NAMES = ['click'];
-function defaultShouldPreventSpanCreation() {
-    return false;
-}
-/**
- * This class represents a UserInteraction plugin for auto instrumentation.
- * If zone.js is available then it patches the zone otherwise it patches
- * addEventListener of HTMLElement
- */
-class UserInteractionInstrumentation extends InstrumentationBase {
-    version = PACKAGE_VERSION$1;
-    moduleName = 'user-interaction';
-    _spansData = new WeakMap();
-    // for addEventListener/removeEventListener state
-    _wrappedListeners = new WeakMap();
-    // for event bubbling
-    _eventsSpanMap = new WeakMap();
-    _eventNames;
-    _shouldPreventSpanCreation;
-    constructor(config = {}) {
-        super(PACKAGE_NAME$1, PACKAGE_VERSION$1, config);
-        this._eventNames = new Set(config?.eventNames ?? DEFAULT_EVENT_NAMES);
-        this._shouldPreventSpanCreation =
-            typeof config?.shouldPreventSpanCreation === 'function'
-                ? config.shouldPreventSpanCreation
-                : defaultShouldPreventSpanCreation;
-    }
-    init() { }
-    /**
-     * This will check if last task was timeout and will save the time to
-     * fix the user interaction when nothing happens
-     * This timeout comes from xhr plugin which is needed to collect information
-     * about last xhr main request from observer
-     * @param task
-     * @param span
-     */
-    _checkForTimeout(task, span) {
-        const spanData = this._spansData.get(span);
-        if (spanData) {
-            if (task.source === 'setTimeout') {
-                spanData.hrTimeLastTimeout = hrTime();
-            }
-            else if (task.source !== 'Promise.then' &&
-                task.source !== 'setTimeout') {
-                spanData.hrTimeLastTimeout = undefined;
-            }
-        }
-    }
-    /**
-     * Controls whether or not to create a span, based on the event type.
-     */
-    _allowEventName(eventName) {
-        return this._eventNames.has(eventName);
-    }
-    /**
-     * Creates a new span
-     * @param element
-     * @param eventName
-     * @param parentSpan
-     */
-    _createSpan(element, eventName, parentSpan) {
-        if (!(element instanceof HTMLElement)) {
-            return undefined;
-        }
-        if (!element.getAttribute) {
-            return undefined;
-        }
-        if (element.hasAttribute('disabled')) {
-            return undefined;
-        }
-        if (!this._allowEventName(eventName)) {
-            return undefined;
-        }
-        const xpath = getElementXPath(element, true);
-        try {
-            const span = this.tracer.startSpan(eventName, {
-                attributes: {
-                    [AttributeNames$1.EVENT_TYPE]: eventName,
-                    [AttributeNames$1.TARGET_ELEMENT]: element.tagName,
-                    [AttributeNames$1.TARGET_XPATH]: xpath,
-                    [AttributeNames$1.HTTP_URL]: window.location.href,
-                },
-            }, parentSpan
-                ? trace.setSpan(context.active(), parentSpan)
-                : undefined);
-            if (this._shouldPreventSpanCreation(eventName, element, span) === true) {
-                return undefined;
-            }
-            this._spansData.set(span, {
-                taskCount: 0,
-            });
-            return span;
-        }
-        catch (e) {
-            this._diag.error('failed to start create new user interaction span', e);
-        }
-        return undefined;
-    }
-    /**
-     * Decrement number of tasks that left in zone,
-     * This is needed to be able to end span when no more tasks left
-     * @param span
-     */
-    _decrementTask(span) {
-        const spanData = this._spansData.get(span);
-        if (spanData) {
-            spanData.taskCount--;
-            if (spanData.taskCount === 0) {
-                this._tryToEndSpan(span, spanData.hrTimeLastTimeout);
-            }
-        }
-    }
-    /**
-     * Return the current span
-     * @param zone
-     * @private
-     */
-    _getCurrentSpan(zone) {
-        const context = zone.get(ZONE_CONTEXT_KEY);
-        if (context) {
-            return trace.getSpan(context);
-        }
-        return context;
-    }
-    /**
-     * Increment number of tasks that are run within the same zone.
-     *     This is needed to be able to end span when no more tasks left
-     * @param span
-     */
-    _incrementTask(span) {
-        const spanData = this._spansData.get(span);
-        if (spanData) {
-            spanData.taskCount++;
-        }
-    }
-    /**
-     * Returns true iff we should use the patched callback; false if it's already been patched
-     */
-    addPatchedListener(on, type, listener, wrappedListener) {
-        let listener2Type = this._wrappedListeners.get(listener);
-        if (!listener2Type) {
-            listener2Type = new Map();
-            this._wrappedListeners.set(listener, listener2Type);
-        }
-        let element2patched = listener2Type.get(type);
-        if (!element2patched) {
-            element2patched = new Map();
-            listener2Type.set(type, element2patched);
-        }
-        if (element2patched.has(on)) {
-            return false;
-        }
-        element2patched.set(on, wrappedListener);
-        return true;
-    }
-    /**
-     * Returns the patched version of the callback (or undefined)
-     */
-    removePatchedListener(on, type, listener) {
-        const listener2Type = this._wrappedListeners.get(listener);
-        if (!listener2Type) {
-            return undefined;
-        }
-        const element2patched = listener2Type.get(type);
-        if (!element2patched) {
-            return undefined;
-        }
-        const patched = element2patched.get(on);
-        if (patched) {
-            element2patched.delete(on);
-            if (element2patched.size === 0) {
-                listener2Type.delete(type);
-                if (listener2Type.size === 0) {
-                    this._wrappedListeners.delete(listener);
-                }
-            }
-        }
-        return patched;
-    }
-    // utility method to deal with the Function|EventListener nature of addEventListener
-    _invokeListener(listener, target, args) {
-        if (typeof listener === 'function') {
-            return listener.apply(target, args);
-        }
-        else {
-            return listener.handleEvent(args[0]);
-        }
-    }
-    /**
-     * This patches the addEventListener of HTMLElement to be able to
-     * auto instrument the click events
-     * This is done when zone is not available
-     */
-    _patchAddEventListener() {
-        const plugin = this;
-        return (original) => {
-            return function addEventListenerPatched(type, listener, useCapture) {
-                // Forward calls with listener = null
-                if (!listener) {
-                    return original.call(this, type, listener, useCapture);
-                }
-                // filter out null (typeof null === 'object')
-                const once = useCapture && typeof useCapture === 'object' && useCapture.once;
-                const patchedListener = function (...args) {
-                    let parentSpan;
-                    const event = args[0];
-                    const target = event?.target;
-                    if (event) {
-                        parentSpan = plugin._eventsSpanMap.get(event);
-                    }
-                    if (once) {
-                        plugin.removePatchedListener(this, type, listener);
-                    }
-                    const span = plugin._createSpan(target, type, parentSpan);
-                    if (span) {
-                        if (event) {
-                            plugin._eventsSpanMap.set(event, span);
-                        }
-                        return context.with(trace.setSpan(context.active(), span), () => {
-                            const result = plugin._invokeListener(listener, this, args);
-                            // no zone so end span immediately
-                            span.end();
-                            return result;
-                        });
-                    }
-                    else {
-                        return plugin._invokeListener(listener, this, args);
-                    }
-                };
-                if (plugin.addPatchedListener(this, type, listener, patchedListener)) {
-                    return original.call(this, type, patchedListener, useCapture);
-                }
-            };
-        };
-    }
-    /**
-     * This patches the removeEventListener of HTMLElement to handle the fact that
-     * we patched the original callbacks
-     * This is done when zone is not available
-     */
-    _patchRemoveEventListener() {
-        const plugin = this;
-        return (original) => {
-            return function removeEventListenerPatched(type, listener, useCapture) {
-                const wrappedListener = plugin.removePatchedListener(this, type, listener);
-                if (wrappedListener) {
-                    return original.call(this, type, wrappedListener, useCapture);
-                }
-                else {
-                    return original.call(this, type, listener, useCapture);
-                }
-            };
-        };
-    }
-    /**
-     * Most browser provide event listener api via EventTarget in prototype chain.
-     * Exception to this is IE 11 which has it on the prototypes closest to EventTarget:
-     *
-     * * - has addEventListener in IE
-     * ** - has addEventListener in all other browsers
-     * ! - missing in IE
-     *
-     * HTMLElement -> Element -> Node * -> EventTarget **! -> Object
-     * Document -> Node * -> EventTarget **! -> Object
-     * Window * -> WindowProperties ! -> EventTarget **! -> Object
-     */
-    _getPatchableEventTargets() {
-        return window.EventTarget
-            ? [EventTarget.prototype]
-            : [Node.prototype, Window.prototype];
-    }
-    /**
-     * Patches the history api
-     */
-    _patchHistoryApi() {
-        this._unpatchHistoryApi();
-        this._wrap(history, 'replaceState', this._patchHistoryMethod());
-        this._wrap(history, 'pushState', this._patchHistoryMethod());
-        this._wrap(history, 'back', this._patchHistoryMethod());
-        this._wrap(history, 'forward', this._patchHistoryMethod());
-        this._wrap(history, 'go', this._patchHistoryMethod());
-    }
-    /**
-     * Patches the certain history api method
-     */
-    _patchHistoryMethod() {
-        const plugin = this;
-        return (original) => {
-            return function patchHistoryMethod(...args) {
-                const url = `${location.pathname}${location.hash}${location.search}`;
-                const result = original.apply(this, args);
-                const urlAfter = `${location.pathname}${location.hash}${location.search}`;
-                if (url !== urlAfter) {
-                    plugin._updateInteractionName(urlAfter);
-                }
-                return result;
-            };
-        };
-    }
-    /**
-     * unpatch the history api methods
-     */
-    _unpatchHistoryApi() {
-        if (isWrapped(history.replaceState))
-            this._unwrap(history, 'replaceState');
-        if (isWrapped(history.pushState))
-            this._unwrap(history, 'pushState');
-        if (isWrapped(history.back))
-            this._unwrap(history, 'back');
-        if (isWrapped(history.forward))
-            this._unwrap(history, 'forward');
-        if (isWrapped(history.go))
-            this._unwrap(history, 'go');
-    }
-    /**
-     * Updates interaction span name
-     * @param url
-     */
-    _updateInteractionName(url) {
-        const span = trace.getSpan(context.active());
-        if (span && typeof span.updateName === 'function') {
-            span.updateName(`${EVENT_NAVIGATION_NAME} ${url}`);
-        }
-    }
-    /**
-     * Patches zone cancel task - this is done to be able to correctly
-     * decrement the number of remaining tasks
-     */
-    _patchZoneCancelTask() {
-        const plugin = this;
-        return (original) => {
-            return function patchCancelTask(task) {
-                const currentZone = Zone.current;
-                const currentSpan = plugin._getCurrentSpan(currentZone);
-                if (currentSpan && plugin._shouldCountTask(task, currentZone)) {
-                    plugin._decrementTask(currentSpan);
-                }
-                return original.call(this, task);
-            };
-        };
-    }
-    /**
-     * Patches zone schedule task - this is done to be able to correctly
-     * increment the number of tasks running within current zone but also to
-     * save time in case of timeout running from xhr plugin when waiting for
-     * main request from PerformanceResourceTiming
-     */
-    _patchZoneScheduleTask() {
-        const plugin = this;
-        return (original) => {
-            return function patchScheduleTask(task) {
-                const currentZone = Zone.current;
-                const currentSpan = plugin._getCurrentSpan(currentZone);
-                if (currentSpan && plugin._shouldCountTask(task, currentZone)) {
-                    plugin._incrementTask(currentSpan);
-                    plugin._checkForTimeout(task, currentSpan);
-                }
-                return original.call(this, task);
-            };
-        };
-    }
-    /**
-     * Patches zone run task - this is done to be able to create a span when
-     * user interaction starts
-     * @private
-     */
-    _patchZoneRunTask() {
-        const plugin = this;
-        return (original) => {
-            return function patchRunTask(task, applyThis, applyArgs) {
-                const event = Array.isArray(applyArgs) && applyArgs[0] instanceof Event
-                    ? applyArgs[0]
-                    : undefined;
-                const target = event?.target;
-                let span;
-                const activeZone = this;
-                if (target) {
-                    span = plugin._createSpan(target, task.eventName);
-                    if (span) {
-                        plugin._incrementTask(span);
-                        return activeZone.run(() => {
-                            try {
-                                return context.with(trace.setSpan(context.active(), span), () => {
-                                    const currentZone = Zone.current;
-                                    task._zone = currentZone;
-                                    return original.call(currentZone, task, applyThis, applyArgs);
-                                });
-                            }
-                            finally {
-                                plugin._decrementTask(span);
-                            }
-                        });
-                    }
-                }
-                else {
-                    span = plugin._getCurrentSpan(activeZone);
-                }
-                try {
-                    return original.call(activeZone, task, applyThis, applyArgs);
-                }
-                finally {
-                    if (span && plugin._shouldCountTask(task, activeZone)) {
-                        plugin._decrementTask(span);
-                    }
-                }
-            };
-        };
-    }
-    /**
-     * Decides if task should be counted.
-     * @param task
-     * @param currentZone
-     * @private
-     */
-    _shouldCountTask(task, currentZone) {
-        if (task._zone) {
-            currentZone = task._zone;
-        }
-        if (!currentZone || !task.data || task.data.isPeriodic) {
-            return false;
-        }
-        const currentSpan = this._getCurrentSpan(currentZone);
-        if (!currentSpan) {
-            return false;
-        }
-        if (!this._spansData.get(currentSpan)) {
-            return false;
-        }
-        return task.type === 'macroTask' || task.type === 'microTask';
-    }
-    /**
-     * Will try to end span when such span still exists.
-     * @param span
-     * @param endTime
-     * @private
-     */
-    _tryToEndSpan(span, endTime) {
-        if (span) {
-            const spanData = this._spansData.get(span);
-            if (spanData) {
-                span.end(endTime);
-                this._spansData.delete(span);
-            }
-        }
-    }
-    /**
-     * implements enable function
-     */
-    enable() {
-        const ZoneWithPrototype = this._getZoneWithPrototype();
-        this._diag.debug('applying patch to', this.moduleName, this.version, 'zone:', !!ZoneWithPrototype);
-        if (ZoneWithPrototype) {
-            if (isWrapped(ZoneWithPrototype.prototype.runTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'runTask');
-                this._diag.debug('removing previous patch from method runTask');
-            }
-            if (isWrapped(ZoneWithPrototype.prototype.scheduleTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'scheduleTask');
-                this._diag.debug('removing previous patch from method scheduleTask');
-            }
-            if (isWrapped(ZoneWithPrototype.prototype.cancelTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'cancelTask');
-                this._diag.debug('removing previous patch from method cancelTask');
-            }
-            this._zonePatched = true;
-            this._wrap(ZoneWithPrototype.prototype, 'runTask', this._patchZoneRunTask());
-            this._wrap(ZoneWithPrototype.prototype, 'scheduleTask', this._patchZoneScheduleTask());
-            this._wrap(ZoneWithPrototype.prototype, 'cancelTask', this._patchZoneCancelTask());
-        }
-        else {
-            this._zonePatched = false;
-            const targets = this._getPatchableEventTargets();
-            targets.forEach(target => {
-                if (isWrapped(target.addEventListener)) {
-                    this._unwrap(target, 'addEventListener');
-                    this._diag.debug('removing previous patch from method addEventListener');
-                }
-                if (isWrapped(target.removeEventListener)) {
-                    this._unwrap(target, 'removeEventListener');
-                    this._diag.debug('removing previous patch from method removeEventListener');
-                }
-                this._wrap(target, 'addEventListener', this._patchAddEventListener());
-                this._wrap(target, 'removeEventListener', this._patchRemoveEventListener());
-            });
-        }
-        this._patchHistoryApi();
-    }
-    /**
-     * implements unpatch function
-     */
-    disable() {
-        const ZoneWithPrototype = this._getZoneWithPrototype();
-        this._diag.debug('removing patch from', this.moduleName, this.version, 'zone:', !!ZoneWithPrototype);
-        if (ZoneWithPrototype && this._zonePatched) {
-            if (isWrapped(ZoneWithPrototype.prototype.runTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'runTask');
-            }
-            if (isWrapped(ZoneWithPrototype.prototype.scheduleTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'scheduleTask');
-            }
-            if (isWrapped(ZoneWithPrototype.prototype.cancelTask)) {
-                this._unwrap(ZoneWithPrototype.prototype, 'cancelTask');
-            }
-        }
-        else {
-            const targets = this._getPatchableEventTargets();
-            targets.forEach(target => {
-                if (isWrapped(target.addEventListener)) {
-                    this._unwrap(target, 'addEventListener');
-                }
-                if (isWrapped(target.removeEventListener)) {
-                    this._unwrap(target, 'removeEventListener');
-                }
-            });
-        }
-        this._unpatchHistoryApi();
-    }
-    /**
-     * returns Zone
-     */
-    _getZoneWithPrototype() {
-        const _window = window;
-        return _window.Zone;
-    }
-}
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var AttributeNames;
-(function (AttributeNames) {
-    AttributeNames["DOCUMENT_LOAD"] = "documentLoad";
-    AttributeNames["DOCUMENT_FETCH"] = "documentFetch";
-    AttributeNames["RESOURCE_FETCH"] = "resourceFetch";
-})(AttributeNames || (AttributeNames = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-// this is autogenerated file, see scripts/version-update.js
-const PACKAGE_VERSION = '0.54.0';
-const PACKAGE_NAME = '@opentelemetry/instrumentation-document-load';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/*
- * This file contains a copy of unstable semantic convention definitions
- * used by this package.
- * @see https://github.com/open-telemetry/opentelemetry-js/tree/main/semantic-conventions#unstable-semconv
- */
-/**
- * Deprecated, use `http.response.header.content-length` instead.
- *
- * @example 3495
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `http.response.header.content-length`.
- */
-/**
- * Deprecated, use `url.full` instead.
- *
- * @example https://www.foo.bar/search?q=OpenTelemetry#SemConv
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `url.full`.
- */
-const ATTR_HTTP_URL = 'http.url';
-/**
- * Deprecated, use `user_agent.original` instead.
- *
- * @example CERN-LineMode/2.15 libwww/2.17b3
- * @example Mozilla/5.0 (iPhone; CPU iPhone OS 14_7_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.2 Mobile/15E148 Safari/604.1
- *
- * @experimental This attribute is experimental and is subject to breaking changes in minor releases of `@opentelemetry/semantic-conventions`.
- *
- * @deprecated Replaced by `user_agent.original`.
- */
-const ATTR_HTTP_USER_AGENT = 'http.user_agent';
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-var EventNames;
-(function (EventNames) {
-    EventNames["FIRST_PAINT"] = "firstPaint";
-    EventNames["FIRST_CONTENTFUL_PAINT"] = "firstContentfulPaint";
-})(EventNames || (EventNames = {}));
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-const getPerformanceNavigationEntries = () => {
-    const entries = {};
-    const performanceNavigationTiming = otperformance.getEntriesByType?.('navigation')[0];
-    if (performanceNavigationTiming) {
-        const keys = Object.values(PerformanceTimingNames);
-        keys.forEach((key) => {
-            if (hasKey(performanceNavigationTiming, key)) {
-                const value = performanceNavigationTiming[key];
-                if (typeof value === 'number') {
-                    entries[key] = value;
-                }
-            }
-        });
-    }
-    else {
-        // // fallback to previous version
-        const perf = otperformance;
-        const performanceTiming = perf.timing;
-        if (performanceTiming) {
-            const keys = Object.values(PerformanceTimingNames);
-            keys.forEach((key) => {
-                if (hasKey(performanceTiming, key)) {
-                    const value = performanceTiming[key];
-                    if (typeof value === 'number') {
-                        entries[key] = value;
-                    }
-                }
-            });
-        }
-    }
-    return entries;
-};
-const performancePaintNames = {
-    'first-paint': EventNames.FIRST_PAINT,
-    'first-contentful-paint': EventNames.FIRST_CONTENTFUL_PAINT,
-};
-const addSpanPerformancePaintEvents = (span) => {
-    const performancePaintTiming = otperformance.getEntriesByType?.('paint');
-    if (performancePaintTiming) {
-        performancePaintTiming.forEach(({ name, startTime }) => {
-            if (hasKey(performancePaintNames, name)) {
-                span.addEvent(performancePaintNames[name], startTime);
-            }
-        });
-    }
-};
-
-/*
- * Copyright The OpenTelemetry Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      https://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * This class represents a document load plugin
- */
-class DocumentLoadInstrumentation extends InstrumentationBase {
-    component = 'document-load';
-    version = '1';
-    moduleName = this.component;
-    _semconvStability;
-    constructor(config = {}) {
-        super(PACKAGE_NAME, PACKAGE_VERSION, config);
-        this._semconvStability = semconvStabilityFromStr('http', config?.semconvStabilityOptIn);
-    }
-    init() { }
-    /**
-     * callback to be executed when page is loaded
-     */
-    _onDocumentLoaded() {
-        // Timeout is needed as load event doesn't have yet the performance metrics for loadEnd.
-        // Support for event "loadend" is very limited and cannot be used
-        window.setTimeout(() => {
-            this._collectPerformance();
-        });
+            return function patchCancelTask(task) {
+                const currentZone = Zone.current;
+                const currentSpan = plugin._getCurrentSpan(currentZone);
+                if (currentSpan && plugin._shouldCountTask(task, currentZone)) {
+                    plugin._decrementTask(currentSpan);
+                }
+                return original.call(this, task);
+            };
+        };
     }
     /**
-     * Adds spans for all resources
-     * @param rootSpan
+     * Patches zone schedule task - this is done to be able to correctly
+     * increment the number of tasks running within current zone but also to
+     * save time in case of timeout running from xhr plugin when waiting for
+     * main request from PerformanceResourceTiming
      */
-    _addResourcesSpans(rootSpan) {
-        const resources = otperformance.getEntriesByType?.('resource');
-        if (resources) {
-            resources.forEach(resource => {
-                this._initResourceSpan(resource, rootSpan);
-            });
-        }
+    _patchZoneScheduleTask() {
+        const plugin = this;
+        return (original) => {
+            return function patchScheduleTask(task) {
+                const currentZone = Zone.current;
+                const currentSpan = plugin._getCurrentSpan(currentZone);
+                if (currentSpan && plugin._shouldCountTask(task, currentZone)) {
+                    plugin._incrementTask(currentSpan);
+                    plugin._checkForTimeout(task, currentSpan);
+                }
+                return original.call(this, task);
+            };
+        };
     }
     /**
-     * Collects information about performance and creates appropriate spans
+     * Patches zone run task - this is done to be able to create a span when
+     * user interaction starts
+     * @private
      */
-    _collectPerformance() {
-        const metaElement = Array.from(document.getElementsByTagName('meta')).find(e => e.getAttribute('name') === TRACE_PARENT_HEADER);
-        const entries = getPerformanceNavigationEntries();
-        const traceparent = (metaElement && metaElement.content) || '';
-        context.with(propagation.extract(ROOT_CONTEXT, { traceparent }), () => {
-            const rootSpan = this._startSpan(AttributeNames.DOCUMENT_LOAD, PerformanceTimingNames.FETCH_START, entries);
-            if (!rootSpan) {
-                return;
-            }
-            context.with(trace.setSpan(context.active(), rootSpan), () => {
-                const fetchSpan = this._startSpan(AttributeNames.DOCUMENT_FETCH, PerformanceTimingNames.FETCH_START, entries);
-                if (fetchSpan) {
-                    if (this._semconvStability & SemconvStability.OLD) {
-                        fetchSpan.setAttribute(ATTR_HTTP_URL, location.href);
+    _patchZoneRunTask() {
+        const plugin = this;
+        return (original) => {
+            return function patchRunTask(task, applyThis, applyArgs) {
+                const event = Array.isArray(applyArgs) && applyArgs[0] instanceof Event
+                    ? applyArgs[0]
+                    : undefined;
+                const target = event?.target;
+                let span;
+                const activeZone = this;
+                if (target) {
+                    span = plugin._createSpan(target, task.eventName);
+                    if (span) {
+                        plugin._incrementTask(span);
+                        return activeZone.run(() => {
+                            try {
+                                return context.with(trace.setSpan(context.active(), span), () => {
+                                    const currentZone = Zone.current;
+                                    task._zone = currentZone;
+                                    return original.call(currentZone, task, applyThis, applyArgs);
+                                });
+                            }
+                            finally {
+                                plugin._decrementTask(span);
+                            }
+                        });
                     }
-                    if (this._semconvStability & SemconvStability.STABLE) {
-                        fetchSpan.setAttribute(ATTR_URL_FULL, location.href);
+                }
+                else {
+                    span = plugin._getCurrentSpan(activeZone);
+                }
+                try {
+                    return original.call(activeZone, task, applyThis, applyArgs);
+                }
+                finally {
+                    if (span && plugin._shouldCountTask(task, activeZone)) {
+                        plugin._decrementTask(span);
                     }
-                    context.with(trace.setSpan(context.active(), fetchSpan), () => {
-                        const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-                        addSpanNetworkEvents(fetchSpan, entries, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
-                        this._addCustomAttributesOnSpan(fetchSpan, this.getConfig().applyCustomAttributesOnSpan?.documentFetch);
-                        this._endSpan(fetchSpan, PerformanceTimingNames.RESPONSE_END, entries);
-                    });
                 }
-            });
-            if (this._semconvStability & SemconvStability.OLD) {
-                rootSpan.setAttribute(ATTR_HTTP_URL, location.href);
-                rootSpan.setAttribute(ATTR_HTTP_USER_AGENT, navigator.userAgent);
-            }
-            if (this._semconvStability & SemconvStability.STABLE) {
-                rootSpan.setAttribute(ATTR_URL_FULL, location.href);
-                rootSpan.setAttribute(ATTR_USER_AGENT_ORIGINAL, navigator.userAgent);
-            }
-            this._addResourcesSpans(rootSpan);
-            if (!this.getConfig().ignoreNetworkEvents) {
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.FETCH_START, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.UNLOAD_EVENT_START, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.UNLOAD_EVENT_END, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.DOM_INTERACTIVE, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.DOM_CONTENT_LOADED_EVENT_START, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.DOM_CONTENT_LOADED_EVENT_END, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.DOM_COMPLETE, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.LOAD_EVENT_START, entries);
-                addSpanNetworkEvent(rootSpan, PerformanceTimingNames.LOAD_EVENT_END, entries);
-            }
-            if (!this.getConfig().ignorePerformancePaintEvents) {
-                addSpanPerformancePaintEvents(rootSpan);
-            }
-            this._addCustomAttributesOnSpan(rootSpan, this.getConfig().applyCustomAttributesOnSpan?.documentLoad);
-            this._endSpan(rootSpan, PerformanceTimingNames.LOAD_EVENT_END, entries);
-        });
+            };
+        };
     }
     /**
-     * Helper function for ending span
-     * @param span
-     * @param performanceName name of performance entry for time end
-     * @param entries
+     * Decides if task should be counted.
+     * @param task
+     * @param currentZone
+     * @private
      */
-    _endSpan(span, performanceName, entries) {
-        // span can be undefined when entries are missing the certain performance - the span will not be created
-        if (span) {
-            if (hasKey(entries, performanceName)) {
-                span.end(entries[performanceName]);
-            }
-            else {
-                // just end span
-                span.end();
-            }
+    _shouldCountTask(task, currentZone) {
+        if (task._zone) {
+            currentZone = task._zone;
+        }
+        if (!currentZone || !task.data || task.data.isPeriodic) {
+            return false;
+        }
+        const currentSpan = this._getCurrentSpan(currentZone);
+        if (!currentSpan) {
+            return false;
+        }
+        if (!this._spansData.get(currentSpan)) {
+            return false;
         }
+        return task.type === 'macroTask' || task.type === 'microTask';
     }
     /**
-     * Creates and ends a span with network information about resource added as timed events
-     * @param resource
-     * @param parentSpan
+     * Will try to end span when such span still exists.
+     * @param span
+     * @param endTime
+     * @private
      */
-    _initResourceSpan(resource, parentSpan) {
-        const span = this._startSpan(AttributeNames.RESOURCE_FETCH, PerformanceTimingNames.FETCH_START, resource, parentSpan);
+    _tryToEndSpan(span, endTime) {
         if (span) {
-            if (this._semconvStability & SemconvStability.OLD) {
-                span.setAttribute(ATTR_HTTP_URL, resource.name);
-            }
-            if (this._semconvStability & SemconvStability.STABLE) {
-                span.setAttribute(ATTR_URL_FULL, resource.name);
+            const spanData = this._spansData.get(span);
+            if (spanData) {
+                span.end(endTime);
+                this._spansData.delete(span);
             }
-            const skipOldSemconvContentLengthAttrs = !(this._semconvStability & SemconvStability.OLD);
-            addSpanNetworkEvents(span, resource, this.getConfig().ignoreNetworkEvents, undefined, skipOldSemconvContentLengthAttrs);
-            this._addCustomAttributesOnResourceSpan(span, resource, this.getConfig().applyCustomAttributesOnSpan?.resourceFetch);
-            this._endSpan(span, PerformanceTimingNames.RESPONSE_END, resource);
-        }
-    }
-    /**
-     * Helper function for starting a span
-     * @param spanName name of span
-     * @param performanceName name of performance entry for time start
-     * @param entries
-     * @param parentSpan
-     */
-    _startSpan(spanName, performanceName, entries, parentSpan) {
-        if (hasKey(entries, performanceName) &&
-            typeof entries[performanceName] === 'number') {
-            const span = this.tracer.startSpan(spanName, {
-                startTime: entries[performanceName],
-            }, parentSpan ? trace.setSpan(context.active(), parentSpan) : undefined);
-            return span;
         }
-        return undefined;
     }
     /**
-     * executes callback {_onDocumentLoaded} when the page is loaded
+     * implements enable function
      */
-    _waitForPageLoad() {
-        if (window.document.readyState === 'complete') {
-            this._onDocumentLoaded();
+    enable() {
+        const ZoneWithPrototype = this._getZoneWithPrototype();
+        this._diag.debug('applying patch to', this.moduleName, this.version, 'zone:', !!ZoneWithPrototype);
+        if (ZoneWithPrototype) {
+            if (isWrapped(ZoneWithPrototype.prototype.runTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'runTask');
+                this._diag.debug('removing previous patch from method runTask');
+            }
+            if (isWrapped(ZoneWithPrototype.prototype.scheduleTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'scheduleTask');
+                this._diag.debug('removing previous patch from method scheduleTask');
+            }
+            if (isWrapped(ZoneWithPrototype.prototype.cancelTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'cancelTask');
+                this._diag.debug('removing previous patch from method cancelTask');
+            }
+            this._zonePatched = true;
+            this._wrap(ZoneWithPrototype.prototype, 'runTask', this._patchZoneRunTask());
+            this._wrap(ZoneWithPrototype.prototype, 'scheduleTask', this._patchZoneScheduleTask());
+            this._wrap(ZoneWithPrototype.prototype, 'cancelTask', this._patchZoneCancelTask());
         }
         else {
-            this._onDocumentLoaded = this._onDocumentLoaded.bind(this);
-            window.addEventListener('load', this._onDocumentLoaded);
-        }
-    }
-    /**
-     * adds custom attributes to root span if configured
-     */
-    _addCustomAttributesOnSpan(span, applyCustomAttributesOnSpan) {
-        if (applyCustomAttributesOnSpan) {
-            safeExecuteInTheMiddle(() => applyCustomAttributesOnSpan(span), error => {
-                if (!error) {
-                    return;
+            this._zonePatched = false;
+            const targets = this._getPatchableEventTargets();
+            targets.forEach(target => {
+                if (isWrapped(target.addEventListener)) {
+                    this._unwrap(target, 'addEventListener');
+                    this._diag.debug('removing previous patch from method addEventListener');
+                }
+                if (isWrapped(target.removeEventListener)) {
+                    this._unwrap(target, 'removeEventListener');
+                    this._diag.debug('removing previous patch from method removeEventListener');
                 }
-                this._diag.error('addCustomAttributesOnSpan', error);
+                this._wrap(target, 'addEventListener', this._patchAddEventListener());
+                this._wrap(target, 'removeEventListener', this._patchRemoveEventListener());
             });
         }
+        this._patchHistoryApi();
     }
     /**
-     * adds custom attributes to span if configured
+     * implements unpatch function
      */
-    _addCustomAttributesOnResourceSpan(span, resource, applyCustomAttributesOnSpan) {
-        if (applyCustomAttributesOnSpan) {
-            safeExecuteInTheMiddle(() => applyCustomAttributesOnSpan(span, resource), error => {
-                if (!error) {
-                    return;
+    disable() {
+        const ZoneWithPrototype = this._getZoneWithPrototype();
+        this._diag.debug('removing patch from', this.moduleName, this.version, 'zone:', !!ZoneWithPrototype);
+        if (ZoneWithPrototype && this._zonePatched) {
+            if (isWrapped(ZoneWithPrototype.prototype.runTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'runTask');
+            }
+            if (isWrapped(ZoneWithPrototype.prototype.scheduleTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'scheduleTask');
+            }
+            if (isWrapped(ZoneWithPrototype.prototype.cancelTask)) {
+                this._unwrap(ZoneWithPrototype.prototype, 'cancelTask');
+            }
+        }
+        else {
+            const targets = this._getPatchableEventTargets();
+            targets.forEach(target => {
+                if (isWrapped(target.addEventListener)) {
+                    this._unwrap(target, 'addEventListener');
+                }
+                if (isWrapped(target.removeEventListener)) {
+                    this._unwrap(target, 'removeEventListener');
                 }
-                this._diag.error('addCustomAttributesOnResourceSpan', error);
             });
         }
+        this._unpatchHistoryApi();
     }
     /**
-     * implements enable function
-     */
-    enable() {
-        // remove previously attached load to avoid adding the same event twice
-        // in case of multiple enable calling.
-        window.removeEventListener('load', this._onDocumentLoaded);
-        this._waitForPageLoad();
-    }
-    /**
-     * implements disable function
+     * returns Zone
      */
-    disable() {
-        window.removeEventListener('load', this._onDocumentLoaded);
+    _getZoneWithPrototype() {
+        const _window = window;
+        return _window.Zone;
     }
 }
 
@@ -19949,6 +17419,65 @@ var UAParser = /*@__PURE__*/getDefaultExportFromCjs(uaParserExports);
 // Semantic convention attribute names
 const ATTR_SERVICE_NAME = 'service.name';
 const ATTR_SERVICE_VERSION = 'service.version';
+// Token de autenticación para OpenTelemetry Collector
+const AUTH_TOKEN = 'eAzROSTiqNd3i+M9Jw6q5Tld0jarZc617sJB//pvb5c=';
+// Instalar interceptores globalmente UNA SOLA VEZ antes de cualquier inicialización
+let interceptorsInstalled = false;
+function installAuthInterceptors() {
+    if (interceptorsInstalled) {
+        return;
+    }
+    interceptorsInstalled = true;
+    // Guardar referencia al XHR original ANTES de que OpenTelemetry lo toque
+    const RealXHR = window.XMLHttpRequest;
+    if (!RealXHR) {
+        console.error('[TracingService] XMLHttpRequest not available');
+        return;
+    }
+    // Crear wrapper que agrega el header
+    window.XMLHttpRequest = function () {
+        const xhr = new RealXHR();
+        const originalOpen = xhr.open;
+        const originalSend = xhr.send;
+        let isCollectorRequest = false;
+        xhr.open = function (method, url, ...args) {
+            const urlString = typeof url === 'string' ? url : url.toString();
+            isCollectorRequest = urlString.includes('collector.jaak.ai');
+            return originalOpen.apply(this, [method, url, ...args]);
+        };
+        xhr.send = function (...args) {
+            if (isCollectorRequest) {
+                this.setRequestHeader('Authorization', `Bearer ${AUTH_TOKEN}`);
+            }
+            return originalSend.apply(this, args);
+        };
+        return xhr;
+    };
+    // Copiar propiedades del constructor original
+    for (const prop in RealXHR) {
+        if (RealXHR.hasOwnProperty(prop)) {
+            window.XMLHttpRequest[prop] = RealXHR[prop];
+        }
+    }
+    // También interceptar fetch por si el SDK lo usa en lugar de XHR
+    const originalFetch = window.fetch;
+    window.fetch = function (input, init) {
+        const url = typeof input === 'string' ? input : input instanceof URL ? input.href : input.url;
+        if (url.includes('collector.jaak.ai')) {
+            const headers = new Headers(init?.headers || {});
+            headers.set('Authorization', `Bearer ${AUTH_TOKEN}`);
+            init = {
+                ...init,
+                headers: headers,
+            };
+        }
+        return originalFetch.call(this, input, init);
+    };
+    // Deshabilitar sendBeacon globalmente porque no soporta headers personalizados
+    navigator.sendBeacon = function () {
+        return false; // Retornar false fuerza al SDK a usar XHR/Fetch como fallback
+    };
+}
 class TracingService {
     provider = null;
     tracer = null;
@@ -19960,7 +17489,6 @@ class TracingService {
     customerId;
     tenantId;
     environment;
-    propagateTraceHeaderCorsUrls;
     enableAutoInstrumentation;
     spanProcessor = null;
     parser;
@@ -19975,19 +17503,43 @@ class TracingService {
         this.customerId = config.customerId;
         this.tenantId = config.tenantId;
         this.environment = config.environment || 'production';
-        this.propagateTraceHeaderCorsUrls = config.propagateTraceHeaderCorsUrls || [];
         this.enableAutoInstrumentation = config.enableAutoInstrumentation ?? false; // Default to false
         this.parser = new UAParser();
     }
     initialize() {
         try {
+            // Instalar interceptores de autenticación ANTES de crear el exporter
+            installAuthInterceptors();
             // Create OTLP exporter
-            const exporter = new OTLPTraceExporter({
+            const baseExporter = new OTLPTraceExporter({
                 url: this.collectorUrl,
                 headers: {
                     'Content-Type': 'application/json',
+                    'Authorization': `Bearer ${AUTH_TOKEN}`,
                 },
+                // @ts-ignore - useSendBeacon no está en los tipos pero es soportada
+                useSendBeacon: false,
             });
+            // Wrap exporter to log export attempts
+            const exporter = {
+                export: (spans, resultCallback) => {
+                    if (this.debug) {
+                        console.log('[TracingService] 📤 Exporting', spans.length, 'spans to collector');
+                    }
+                    baseExporter.export(spans, (result) => {
+                        if (result.code !== 0) {
+                            console.error('[TracingService] ❌ Export failed:', result);
+                        }
+                        resultCallback(result);
+                    });
+                },
+                shutdown: async () => {
+                    return baseExporter.shutdown();
+                },
+                forceFlush: async () => {
+                    return baseExporter.forceFlush();
+                },
+            };
             // Create batch span processor for each exporter
             this.spanProcessor = new BatchSpanProcessor(exporter, {
                 maxQueueSize: 100,
@@ -19995,24 +17547,10 @@ class TracingService {
                 scheduledDelayMillis: 5000,
                 exportTimeoutMillis: 30000,
             });
-            // Create resource attributes
-            const resourceAttributes = {
-                [ATTR_SERVICE_NAME]: this.serviceName,
-                [ATTR_SERVICE_VERSION]: this.serviceVersion,
-                'deployment.environment': this.environment,
-            };
-            if (this.customerId) {
-                resourceAttributes['customer.id'] = this.customerId;
-            }
-            if (this.tenantId) {
-                resourceAttributes['tenant.id'] = this.tenantId;
-            }
-            // Create tracer provider with resource
+            // Create tracer provider with span processor in constructor
             this.provider = new WebTracerProvider({
-            // Resource will be added via span attributes since Resource class is not available
+                spanProcessors: [this.spanProcessor],
             });
-            // Add span processor
-            this.provider.addSpanProcessor?.(this.spanProcessor);
             // Configure context manager (Zone.js for async context propagation)
             const contextManager = new ZoneContextManager();
             // Configure propagators (W3C Trace Context + B3 for compatibility)
@@ -20026,19 +17564,7 @@ class TracingService {
             this.tracer = trace.getTracer(this.serviceName, this.serviceVersion);
             // Initialize auto-instrumentation if enabled
             if (this.enableAutoInstrumentation) {
-                this.initializeAutoInstrumentation(resourceAttributes);
-            }
-            if (this.debug) {
-                console.log('[TracingService] Initialized successfully', {
-                    collectorUrl: this.collectorUrl,
-                    serviceName: this.serviceName,
-                    serviceVersion: this.serviceVersion,
-                    environment: this.environment,
-                    customerId: this.customerId,
-                    tenantId: this.tenantId,
-                    autoInstrumentation: this.enableAutoInstrumentation,
-                    propagateUrls: this.propagateTraceHeaderCorsUrls,
-                });
+                this.initializeAutoInstrumentation();
             }
         }
         catch (error) {
@@ -20046,37 +17572,15 @@ class TracingService {
             // Don't throw - telemetry should fail silently in production
         }
     }
-    initializeAutoInstrumentation(resourceAttributes) {
+    initializeAutoInstrumentation() {
         try {
-            // Auto-instrumentation is disabled by default to reduce noise
-            // Enable via config.enableAutoInstrumentation = true if needed
+            // NOTE: XHR and Fetch instrumentation are disabled because we manually intercept
+            // them to add authentication headers. Enabling them causes conflicts.
+            // NOTE: DocumentLoadInstrumentation is disabled because it captures events that
+            // occurred before the component initialized, and cannot use custom trace IDs.
+            // Only enable user interaction instrumentation
             registerInstrumentations({
                 instrumentations: [
-                    // Fetch API instrumentation
-                    new FetchInstrumentation({
-                        propagateTraceHeaderCorsUrls: this.propagateTraceHeaderCorsUrls,
-                        clearTimingResources: true,
-                        applyCustomAttributesOnSpan: (span, _request, response) => {
-                            // Add resource attributes to each span
-                            Object.entries(resourceAttributes).forEach(([key, value]) => {
-                                span.setAttribute(key, value);
-                            });
-                            // Add custom attributes
-                            if (response && 'status' in response) {
-                                span.setAttribute('http.response.status_code', response.status);
-                            }
-                        },
-                    }),
-                    // XMLHttpRequest instrumentation
-                    new XMLHttpRequestInstrumentation({
-                        propagateTraceHeaderCorsUrls: this.propagateTraceHeaderCorsUrls,
-                        applyCustomAttributesOnSpan: (span) => {
-                            // Add resource attributes to each span
-                            Object.entries(resourceAttributes).forEach(([key, value]) => {
-                                span.setAttribute(key, value);
-                            });
-                        },
-                    }),
                     // User interaction instrumentation (clicks, etc.)
                     new UserInteractionInstrumentation({
                         eventNames: ['click', 'submit'],
@@ -20085,13 +17589,8 @@ class TracingService {
                             return element.tagName === 'BUTTON' || element.tagName === 'A' || element.tagName === 'FORM';
                         },
                     }),
-                    // Document load instrumentation
-                    new DocumentLoadInstrumentation(),
                 ],
             });
-            if (this.debug) {
-                console.log('[TracingService] Auto-instrumentation enabled');
-            }
         }
         catch (error) {
             console.error('[TracingService] Failed to initialize auto-instrumentation:', error);
@@ -20182,19 +17681,24 @@ class TracingService {
     }
     startSpan(name, attributes) {
         if (!this.tracer) {
-            // Return a no-op span if tracer is not initialized
+            console.warn('[TracingService] Tracer not initialized, returning no-op span');
             return trace.getTracer('noop').startSpan('noop');
         }
         try {
             let currentContext = context.active();
-            // If we have a session trace ID, create a span context with it
-            if (this.sessionTraceId) {
-                const spanContext = {
+            // If we have a session trace ID and there's no active span, create a root span context
+            if (this.sessionTraceId && !trace.getSpan(currentContext)) {
+                // Create a valid span context for the custom trace ID
+                const remoteSpanContext = {
                     traceId: this.sessionTraceId,
                     spanId: this.generateSpanId(),
-                    traceFlags: 0x01, // Sampled
+                    traceFlags: TraceFlags.SAMPLED,
+                    isRemote: true,
                 };
-                currentContext = trace.setSpanContext(currentContext, spanContext);
+                // Create a non-recording span with the custom trace context
+                const remoteSpan = trace.wrapSpanContext(remoteSpanContext);
+                // Set this span in the context so child spans inherit the trace ID
+                currentContext = trace.setSpan(currentContext, remoteSpan);
             }
             // Get device info
             const deviceInfo = this.getDeviceInfo();
@@ -20251,20 +17755,15 @@ class TracingService {
         }
     }
     endSpan(span) {
-        if (!span)
+        if (!span) {
+            console.warn('[TracingService] endSpan called with null/undefined span');
             return;
+        }
         try {
             span.end();
-            if (this.debug) {
-                const spanContext = span.spanContext();
-                console.log('[TracingService] Ended span', {
-                    traceId: spanContext.traceId,
-                    spanId: spanContext.spanId,
-                });
-            }
         }
         catch (error) {
-            console.error('[TracingService] Failed to end span:', error);
+            console.error('[TracingService] ❌ Failed to end span:', error);
         }
     }
     addSpanEvent(span, name, attributes) {
@@ -20289,9 +17788,6 @@ class TracingService {
                 code: SpanStatusCode.ERROR,
                 message: error.message,
             });
-            if (this.debug) {
-                console.log('[TracingService] Recorded exception:', error);
-            }
         }
         catch (err) {
             console.error('[TracingService] Failed to record exception:', err);
@@ -20328,6 +17824,26 @@ class TracingService {
             this.endSpan(span);
         }
     }
+    async traceAsync(name, fn, attributes) {
+        return this.trace(name, fn, attributes);
+    }
+    /**
+     * Flush all pending spans to the collector
+     * Call this when capture/process is complete to send all traces
+     */
+    async flush() {
+        try {
+            if (!this.spanProcessor) {
+                console.warn('[TracingService] No span processor available to flush');
+                return;
+            }
+            await this.spanProcessor.forceFlush();
+        }
+        catch (error) {
+            console.error('[TracingService] ❌ Failed to flush spans:', error);
+            throw error;
+        }
+    }
     async cleanup() {
         try {
             if (this.spanProcessor) {
@@ -20337,9 +17853,6 @@ class TracingService {
             if (this.provider) {
                 await this.provider.shutdown();
             }
-            if (this.debug) {
-                console.log('[TracingService] Cleaned up successfully');
-            }
         }
         catch (error) {
             console.error('[TracingService] Failed to cleanup:', error);
@@ -20976,8 +18489,8 @@ class LicenseValidationService {
     static ENVIRONMENT_URLS = {
         dev: 'https://api.dev.jaak.ai',
         qa: 'https://api.qa.jaak.ai',
-        staging: 'https://api-staging.jaak.ai',
-        prod: 'https://api.jaak.ai',
+        sandbox: 'https://api.sandbox.jaak.ai',
+        prod: 'https://services.api.jaak.ai',
     };
     constructor(environment = 'prod') {
         this.baseUrl = LicenseValidationService.ENVIRONMENT_URLS[environment];
@@ -21076,7 +18589,7 @@ class LicenseValidationService {
     }
 }
 
-const myComponentCss = ":host{display:block;width:100%;height:100%;font-family:system-ui, -apple-system, sans-serif;color:#1a1a1a}.detector-container{display:flex;flex-direction:column;align-items:center;width:100%;height:100%}h1{font-size:24px;font-weight:500;color:#333;margin:0 0 24px 0}.video-container{position:relative;width:100%;height:100%;background:#333;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden}video,.detection-overlay{position:absolute;width:100%;height:100%;border-radius:8px}video.mirror,.detection-overlay.mirror{transform:rotateY(180deg)}.detection-overlay{z-index:1;pointer-events:none}video{z-index:0}.detection-box{transition:opacity 0.2s ease}.status{margin-top:16px;font-size:12px;color:#666}.overlay-mask{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;display:block;pointer-events:none}.card-outline{position:absolute;top:var(--mask-center-y, 50%);left:var(--mask-center-x, 50%);transform:translate(-50%, -50%);width:var(--mask-width, 88%);height:var(--mask-height, 55%);border:none;border-radius:4px;background:transparent;opacity:0.8}.side{position:absolute;background:#999;transition:background-color 0.3s ease;border-radius:1px}.side-top.aligned{border-left-color:#28a745;border-top-color:#28a745}.side-right.aligned{border-right-color:#28a745;border-top-color:#28a745}.side-bottom.aligned{border-left-color:#28a745;border-bottom-color:#28a745}.side-left.aligned{border-right-color:#28a745;border-bottom-color:#28a745}.side-top{top:-3px;left:-3px;width:30px;height:30px;border-left:6px solid #ffffff;border-top:6px solid #ffffff;background:transparent}.side-right{top:-3px;right:-3px;width:30px;height:30px;border-right:6px solid #ffffff;border-top:6px solid #ffffff;background:transparent}.side-bottom{bottom:-3px;left:-3px;width:30px;height:30px;border-left:6px solid #ffffff;border-bottom:6px solid #ffffff;background:transparent}.side-left{bottom:-3px;right:-3px;width:30px;height:30px;border-right:6px solid #ffffff;border-bottom:6px solid #ffffff;background:transparent}.guide-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);color:#ffffff;font-size:12px;font-weight:500;text-align:center;white-space:normal;padding:13px;max-width:300px;z-index:20;height:fit-content;width:fit-content;animation:slideInFromTopCentered 0.3s ease-out}.quality-indicator{position:absolute;top:20px;right:20px;display:flex;align-items:center;gap:8px;background:rgba(0, 0, 0, 0.8);padding:8px 12px;border-radius:20px;z-index:25;transition:all 0.3s ease}.quality-indicator.warning{background:rgba(255, 152, 0, 0.9)}.quality-indicator.good{background:rgba(76, 175, 80, 0.9)}.quality-score{color:#fff;font-size:12px;font-weight:600;min-width:30px;text-align:center}.quality-status{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:bold;color:#fff;transition:all 0.3s ease}.quality-status.ready{background:#4CAF50}.quality-status.not-ready{background:#f44336}.card-outline.quality-warning{animation:qualityWarning 1s ease-in-out infinite alternate}@keyframes qualityWarning{0%{box-shadow:0 0 0 3px rgba(255, 152, 0, 0.6)}100%{box-shadow:0 0 0 6px rgba(255, 152, 0, 0.3)}}.capture-animation{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;opacity:0;z-index:30;pointer-events:none;animation:captureFlash 0.6s ease-out}@keyframes captureFlash{0%{opacity:0}15%{opacity:0.8}30%{opacity:0}45%{opacity:0.4}60%{opacity:0}100%{opacity:0}}.card-outline.capturing{animation:pulseGreen 0.6s ease-out}@keyframes pulseGreen{0%{border-color:#28a745;box-shadow:0 0 0 4px rgba(40, 167, 69, 0)}50%{border-color:#28a745;box-shadow:0 0 0 8px rgba(40, 167, 69, 0.6)}100%{border-color:#28a745;box-shadow:0 0 0 4px rgba(40, 167, 69, 0)}}.flip-animation{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:35;pointer-events:none;opacity:0;animation:showFlipInstruction 3s ease-in-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.id-card-icon{width:80px;height:50px;background:linear-gradient(135deg, #6c757d 0%, #495057 100%);border-radius:8px;position:relative;animation:flipCard 2s ease-in-out infinite;box-shadow:0 4px 12px rgba(0, 0, 0, 0.3)}.id-card-icon::before{content:'';position:absolute;top:8px;left:8px;width:16px;height:12px;background:rgba(255, 255, 255, 0.9);border-radius:2px}.id-card-icon::after{content:'';position:absolute;top:25px;left:8px;width:64px;height:3px;background:rgba(255, 255, 255, 0.7);border-radius:1px;box-shadow:0 6px 0 rgba(255, 255, 255, 0.7), 0 12px 0 rgba(255, 255, 255, 0.7)}.flip-text{margin-top:12px;color:#fff;font-size:14px;font-weight:600;text-align:center;background:rgba(128, 128, 128, 0.8);padding:12px 20px;border-radius:20px;max-width:300px}@keyframes showFlipInstruction{0%{opacity:0;transform:translate(-50%, -50%) scale(0.8)}15%{opacity:1;transform:translate(-50%, -50%) scale(1)}85%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -50%) scale(0.8)}}@keyframes flipCard{0%{transform:rotateY(0deg)}50%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}.success-animation{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:35;pointer-events:none;opacity:0;animation:showSuccessMessage 3s ease-in-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.check-icon{width:80px;height:80px;background:linear-gradient(135deg, #6c757d 0%, #495057 100%);border-radius:50%;position:relative;animation:bounceSuccess 0.6s ease-out;box-shadow:0 4px 16px rgba(108, 117, 125, 0.4);display:flex;align-items:center;justify-content:center}.check-icon::before{content:'';position:absolute;width:20px;height:35px;border:4px solid #fff;border-top:none;border-left:none;transform:rotate(45deg);}.success-text{margin-top:16px;color:#fff;font-size:14px;font-weight:600;text-align:center;background:rgba(128, 128, 128, 0.8);padding:12px 20px;border-radius:20px;max-width:300px;animation:fadeInUp 0.5s ease-out 0.4s both}@keyframes showSuccessMessage{0%{opacity:0;transform:translate(-50%, -50%) scale(0.5)}15%{opacity:1;transform:translate(-50%, -50%) scale(1)}85%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -50%) scale(0.9)}}@keyframes bounceSuccess{0%{transform:scale(0)}50%{transform:scale(1.1)}100%{transform:scale(1)}}@keyframes drawCheck{0%{width:0;height:0}50%{width:20px;height:0}100%{width:20px;height:35px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}.skip-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:300px}.back-capture-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:320px}.back-capture-buttons{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.capture-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.capture-button:hover{background:#f8f9fa}.capture-button:active{background:#e9ecef;transform:translateY(1px)}.capture-button:disabled,.capture-button.primary-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}@media (max-width: 480px){.back-capture-section{bottom:16px;max-width:300px}.back-capture-buttons{flex-direction:column;gap:8px;width:100%}.capture-button,.back-capture-buttons .skip-button{width:100%;max-width:200px;padding:10px 20px;font-size:13px}.capture-button:disabled,.capture-button.primary-button:disabled,.skip-button:disabled{opacity:0.7 !important;cursor:not-allowed !important}}.skip-explanation{background:rgba(0, 0, 0, 0.5);color:#ffffff;padding:10px 16px;border-radius:8px;font-size:14px;font-weight:500;text-align:center;margin-bottom:12px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);backdrop-filter:blur(12px);border:1px solid rgba(255, 255, 255, 0.1);animation:fadeIn 0.3s ease-in-out}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.guide-text.performance-warning-text{animation:gentlePulse 2s ease-in-out infinite;background:rgba(255, 107, 107, 0.3);border:1px solid rgba(255, 107, 107, 0.5)}@keyframes gentlePulse{0%,100%{transform:translate(-50%, -50%) scale(1);background:rgba(255, 107, 107, 0.3)}50%{transform:translate(-50%, -50%) scale(1.02);background:rgba(255, 107, 107, 0.4)}}.skip-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.skip-button:hover{background:#f8f9fa}.skip-button:active{background:#e9ecef;transform:translateY(1px)}.skip-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}.camera-controls{position:absolute;top:16px;right:16px;z-index:25;display:flex;gap:8px;pointer-events:auto;animation:slideInFromTop 0.3s ease-out}.camera-selector-button{height:32px;padding:0 10px;border:none;border-radius:8px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(12px);color:#ffffff;font-size:12px;font-weight:500;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255, 255, 255, 0.1);white-space:nowrap;min-width:fit-content}.camera-selector-button:hover{background:rgba(0, 0, 0, 0.8);border-color:rgba(255, 255, 255, 0.2);transform:translateY(-1px)}.camera-selector-button:active{transform:translateY(0);background:rgba(0, 0, 0, 0.9)}.camera-selector-button:disabled,.camera-selector-button.loading{opacity:0.7;cursor:not-allowed;pointer-events:none}.camera-selector-button:disabled:hover,.camera-selector-button.loading:hover{transform:none;background:rgba(0, 0, 0, 0.6);border-color:rgba(255, 255, 255, 0.1)}.button-spinner{width:16px;height:16px;border:2px solid rgba(0, 0, 0, 0.2);border-top:2px solid #333333;border-radius:50%;animation:spin 1s linear infinite;display:inline-block;margin-right:8px;vertical-align:middle}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.camera-selector-dropdown{position:absolute;top:56px;right:16px;z-index:30;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;min-width:260px;max-width:300px;border:1px solid rgba(255, 255, 255, 0.1);overflow:hidden;pointer-events:auto;animation:slideInFromTop 0.3s ease-out}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-8px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideInFromTopCentered{0%{opacity:0;transform:translate(-50%, -50%) translateY(-8px) scale(0.95)}100%{opacity:1;transform:translate(-50%, -50%) translateY(0) scale(1)}}.camera-selector-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid rgba(255, 255, 255, 0.1)}.camera-selector-header span{font-weight:500;color:#ffffff;font-size:13px;opacity:0.9}.close-selector{width:20px;height:20px;border:none;background:none;color:rgba(255, 255, 255, 0.7);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all 0.2s ease}.close-selector:hover{background:rgba(255, 255, 255, 0.1);color:#ffffff}.camera-list{padding:4px 0;max-height:240px;overflow-y:auto}.camera-option{width:100%;padding:8px 12px;border:none;background:none;text-align:left;cursor:pointer;transition:all 0.2s ease;display:flex;justify-content:flex-start;align-items:center;gap:8px;color:rgba(255, 255, 255, 0.9)}.camera-option:hover{background:rgba(255, 255, 255, 0.08)}.camera-option.selected{background:rgba(255, 255, 255, 0.12);color:#ffffff}.camera-label{font-size:13px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:0;font-weight:400;display:flex;align-items:center;gap:6px}.camera-label .autofocus-icon{font-size:12px;color:#ffffff !important;opacity:0.8;flex-shrink:0}.selected-indicator{font-size:14px;color:#ffffff;opacity:0.9;flex-shrink:0}.device-info{padding:6px 12px;border-top:1px solid rgba(255, 255, 255, 0.1);background:rgba(255, 255, 255, 0.05)}.device-info small{color:rgba(255, 255, 255, 0.6);font-size:11px;text-transform:capitalize;font-weight:400}@media (max-width: 480px){.camera-controls{top:12px;right:12px;gap:6px}.camera-selector-button{height:36px;padding:0 12px;font-size:11px;border-radius:6px}.camera-selector-dropdown{right:12px;top:48px;min-width:240px;max-width:calc(100vw - 24px)}.camera-selector-header{padding:6px 10px}.camera-option{padding:6px 10px}.device-info{padding:4px 10px}}.watermark{position:absolute;bottom:12px;right:12px;z-index:15;pointer-events:none;opacity:0.7}.watermark img{height:24px;width:auto;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}.component-status{position:absolute;top:16px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);display:flex;align-items:center;gap:6px;padding:6px 10px;z-index:40;height:32px;width:fit-content;animation:slideInFromTop 0.3s ease-out}.status-spinner{width:16px;height:16px;border:1px solid rgba(255, 255, 255, 0.3);border-top:1px solid #ffffff;border-radius:50%;animation:statusSpin 1s linear infinite;flex-shrink:0}.status-content{display:flex;flex-direction:column;gap:1px}.status-message{color:#ffffff;font-size:12px;font-weight:500;margin:0}.status-description{color:rgba(255, 255, 255, 0.7);font-size:10px;line-height:1.2;margin:0}@keyframes statusSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (max-width: 480px){.component-status{top:12px;left:12px;padding:4px 8px;gap:4px;height:28px;border-radius:8px}.status-spinner{width:14px;height:14px}.status-message{font-size:11px}.status-description{font-size:9px}.guide-text{font-size:11px;padding:4px 8px;border-radius:8px}}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.85);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:30;border-radius:8px}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255, 255, 255, 0.15);border-top:3px solid #28a745;border-radius:50%;animation:spin 1s ease-in-out infinite;margin-bottom:16px}.loading-text{color:#ffffff;font-size:14px;font-weight:500;text-align:center;opacity:0.9;margin-bottom:4px}.loading-description{color:rgba(255, 255, 255, 0.7);font-size:12px;text-align:center;opacity:0.8}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.performance-monitor{position:absolute;top:70px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);z-index:35;width:fit-content;animation:slideInFromTop 0.3s ease-out;transition:all 0.3s ease}@keyframes slideInFromLeft{0%{opacity:0;transform:translateX(-20px) scale(0.95)}100%{opacity:1;transform:translateX(0) scale(1)}}.performance-expanded{padding:6px 10px}.metrics-row{display:flex;gap:8px;margin-bottom:4px}.metrics-row:last-child{margin-bottom:0}.metric-compact{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:50px}.metric-label{font-size:9px;color:rgba(255, 255, 255, 0.6);font-weight:500;text-transform:uppercase;letter-spacing:0.3px}.metric-value{font-size:10px;font-weight:600;font-family:'Monaco', 'Menlo', 'Consolas', monospace;padding:2px 4px;border-radius:3px;text-align:center;white-space:nowrap}.metric-value.good{color:#4ade80;background:rgba(74, 222, 128, 0.1);border:1px solid rgba(74, 222, 128, 0.2)}.metric-value.warning{color:#fbbf24;background:rgba(251, 191, 36, 0.1);border:1px solid rgba(251, 191, 36, 0.2)}.metric-value.danger{color:#f87171;background:rgba(248, 113, 113, 0.1);border:1px solid rgba(248, 113, 113, 0.2)}@media (max-width: 480px){.performance-monitor{top:60px;left:12px;width:fit-content}.performance-expanded{padding:4px 8px}.metrics-row{gap:6px;margin-bottom:3px}.metric-compact{min-width:45px;gap:1px}.metric-label{font-size:8px}.metric-value{font-size:9px;padding:1px 3px}}.quality-monitor{position:absolute;top:200px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);z-index:35;width:fit-content;animation:slideInFromLeft 0.3s ease-out;transition:all 0.3s ease}.quality-text{padding:6px 10px;font-size:11px;color:white;font-family:'Monaco', 'Menlo', 'Consolas', monospace;line-height:1.4}.quality-fail{color:#ff9999}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.7}}.metric-value.danger{animation:pulse 2s infinite}@media (max-width: 480px){.quality-monitor{top:160px;left:12px}.quality-text{padding:4px 8px;font-size:10px}}.manual-capture-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:300px}.manual-capture-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.manual-capture-button:hover{background:#f8f9fa}.manual-capture-button:active{background:#e9ecef;transform:translateY(1px)}.manual-capture-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}@media (max-width: 480px){.manual-capture-section{bottom:16px;max-width:280px}.manual-capture-button{padding:10px 20px;font-size:13px}.manual-capture-button:disabled{opacity:0.7 !important;cursor:not-allowed !important}}.license-error-container{display:flex;align-items:center;justify-content:center;padding:40px 20px;height:100%;width:100%;background:#f5f7fa;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif}.license-error-card{background:#ffffff;border-radius:8px;box-shadow:0 2px 12px rgba(0, 0, 0, 0.1);max-width:480px;width:100%;padding:48px 32px;text-align:center}.license-error-icon{color:#dc3545;margin-bottom:24px}.license-error-title{color:#2c3e50;font-size:24px;font-weight:600;margin:0 0 16px 0}.license-error-message{color:#495057;font-size:16px;line-height:1.6;margin:0 0 24px 0}.license-error-help{color:#6c757d;font-size:14px;margin:0 0 32px 0}.license-error-help a{color:#007bff;text-decoration:none;font-weight:500}.license-error-help a:hover{text-decoration:underline}.license-error-footer{color:#adb5bd;font-size:12px;font-weight:500;padding-top:24px;border-top:1px solid #e9ecef}@media (max-width: 640px){.license-error-card{padding:32px 24px}.license-error-title{font-size:20px}.license-error-message{font-size:14px}}";
+const myComponentCss = ":host{display:block;width:100%;height:100%;font-family:system-ui, -apple-system, sans-serif;color:#1a1a1a}.detector-container{display:flex;flex-direction:column;align-items:center;width:100%;height:100%}h1{font-size:24px;font-weight:500;color:#333;margin:0 0 24px 0}.video-container{position:relative;width:100%;height:100%;background-color:#000;border:none;border-radius:8px;overflow:hidden}video,.detection-overlay{position:absolute;width:100%;height:100%;border-radius:8px}video.mirror,.detection-overlay.mirror{transform:rotateY(180deg)}.detection-overlay{z-index:1;pointer-events:none}video{z-index:0}video::-webkit-media-controls{display:none !important}video::-webkit-media-controls-panel{display:none !important}video::-webkit-media-controls-play-button{display:none !important}video::-webkit-media-controls-start-playback-button{display:none !important}video::-webkit-media-controls-enclosure{display:none !important}.detection-box{transition:opacity 0.2s ease}.status{margin-top:16px;font-size:12px;color:#666}.overlay-mask{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;display:block;pointer-events:none}.card-outline{position:absolute;top:var(--mask-center-y, 50%);left:var(--mask-center-x, 50%);transform:translate(-50%, -50%);width:var(--mask-width, 88%);height:var(--mask-height, 55%);border:none;border-radius:4px;background:transparent;opacity:0.8}.side{position:absolute;background:#999;transition:background-color 0.3s ease;border-radius:1px}.side-top.aligned{border-left-color:#28a745;border-top-color:#28a745}.side-right.aligned{border-right-color:#28a745;border-top-color:#28a745}.side-bottom.aligned{border-left-color:#28a745;border-bottom-color:#28a745}.side-left.aligned{border-right-color:#28a745;border-bottom-color:#28a745}.side-top{top:-3px;left:-3px;width:30px;height:30px;border-left:6px solid #ffffff;border-top:6px solid #ffffff;background:transparent}.side-right{top:-3px;right:-3px;width:30px;height:30px;border-right:6px solid #ffffff;border-top:6px solid #ffffff;background:transparent}.side-bottom{bottom:-3px;left:-3px;width:30px;height:30px;border-left:6px solid #ffffff;border-bottom:6px solid #ffffff;background:transparent}.side-left{bottom:-3px;right:-3px;width:30px;height:30px;border-right:6px solid #ffffff;border-bottom:6px solid #ffffff;background:transparent}.guide-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);color:#ffffff;font-size:12px;font-weight:500;text-align:center;white-space:normal;padding:13px;max-width:300px;z-index:20;height:fit-content;width:fit-content;animation:slideInFromTopCentered 0.3s ease-out}.quality-indicator{position:absolute;top:20px;right:20px;display:flex;align-items:center;gap:8px;background:rgba(0, 0, 0, 0.8);padding:8px 12px;border-radius:20px;z-index:25;transition:all 0.3s ease}.quality-indicator.warning{background:rgba(255, 152, 0, 0.9)}.quality-indicator.good{background:rgba(76, 175, 80, 0.9)}.quality-score{color:#fff;font-size:12px;font-weight:600;min-width:30px;text-align:center}.quality-status{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:bold;color:#fff;transition:all 0.3s ease}.quality-status.ready{background:#4CAF50}.quality-status.not-ready{background:#f44336}.card-outline.quality-warning{animation:qualityWarning 1s ease-in-out infinite alternate}@keyframes qualityWarning{0%{box-shadow:0 0 0 3px rgba(255, 152, 0, 0.6)}100%{box-shadow:0 0 0 6px rgba(255, 152, 0, 0.3)}}.capture-animation{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;opacity:0;z-index:30;pointer-events:none;animation:captureFlash 0.6s ease-out}@keyframes captureFlash{0%{opacity:0}15%{opacity:0.8}30%{opacity:0}45%{opacity:0.4}60%{opacity:0}100%{opacity:0}}.card-outline.capturing{animation:pulseGreen 0.6s ease-out}@keyframes pulseGreen{0%{border-color:#28a745;box-shadow:0 0 0 4px rgba(40, 167, 69, 0)}50%{border-color:#28a745;box-shadow:0 0 0 8px rgba(40, 167, 69, 0.6)}100%{border-color:#28a745;box-shadow:0 0 0 4px rgba(40, 167, 69, 0)}}.flip-animation{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:35;pointer-events:none;opacity:0;animation:showFlipInstruction 3s ease-in-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.id-card-icon{width:80px;height:50px;background:linear-gradient(135deg, #6c757d 0%, #495057 100%);border-radius:8px;position:relative;animation:flipCard 2s ease-in-out infinite;box-shadow:0 4px 12px rgba(0, 0, 0, 0.3)}.id-card-icon::before{content:'';position:absolute;top:8px;left:8px;width:16px;height:12px;background:rgba(255, 255, 255, 0.9);border-radius:2px}.id-card-icon::after{content:'';position:absolute;top:25px;left:8px;width:64px;height:3px;background:rgba(255, 255, 255, 0.7);border-radius:1px;box-shadow:0 6px 0 rgba(255, 255, 255, 0.7), 0 12px 0 rgba(255, 255, 255, 0.7)}.flip-text{margin-top:12px;color:#fff;font-size:14px;font-weight:600;text-align:center;background:rgba(128, 128, 128, 0.8);padding:12px 20px;border-radius:20px;max-width:300px}@keyframes showFlipInstruction{0%{opacity:0;transform:translate(-50%, -50%) scale(0.8)}15%{opacity:1;transform:translate(-50%, -50%) scale(1)}85%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -50%) scale(0.8)}}@keyframes flipCard{0%{transform:rotateY(0deg)}50%{transform:rotateY(180deg)}100%{transform:rotateY(360deg)}}.success-animation{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:35;pointer-events:none;opacity:0;animation:showSuccessMessage 3s ease-in-out;display:flex;flex-direction:column;align-items:center;justify-content:center}.check-icon{width:80px;height:80px;background:linear-gradient(135deg, #6c757d 0%, #495057 100%);border-radius:50%;position:relative;animation:bounceSuccess 0.6s ease-out;box-shadow:0 4px 16px rgba(108, 117, 125, 0.4);display:flex;align-items:center;justify-content:center}.check-icon::before{content:'';position:absolute;width:20px;height:35px;border:4px solid #fff;border-top:none;border-left:none;transform:rotate(45deg);}.success-text{margin-top:16px;color:#fff;font-size:14px;font-weight:600;text-align:center;background:rgba(128, 128, 128, 0.8);padding:12px 20px;border-radius:20px;max-width:300px;animation:fadeInUp 0.5s ease-out 0.4s both}@keyframes showSuccessMessage{0%{opacity:0;transform:translate(-50%, -50%) scale(0.5)}15%{opacity:1;transform:translate(-50%, -50%) scale(1)}85%{opacity:1;transform:translate(-50%, -50%) scale(1)}100%{opacity:0;transform:translate(-50%, -50%) scale(0.9)}}@keyframes bounceSuccess{0%{transform:scale(0)}50%{transform:scale(1.1)}100%{transform:scale(1)}}@keyframes drawCheck{0%{width:0;height:0}50%{width:20px;height:0}100%{width:20px;height:35px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}100%{opacity:1;transform:translateY(0)}}.skip-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:300px}.back-capture-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:320px}.back-capture-buttons{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}.capture-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.capture-button:hover{background:#f8f9fa}.capture-button:active{background:#e9ecef;transform:translateY(1px)}.capture-button:disabled,.capture-button.primary-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}@media (max-width: 480px){.back-capture-section{bottom:16px;max-width:300px}.back-capture-buttons{flex-direction:column;gap:8px;width:100%}.capture-button,.back-capture-buttons .skip-button{width:100%;max-width:200px;padding:10px 20px;font-size:13px}.capture-button:disabled,.capture-button.primary-button:disabled,.skip-button:disabled{opacity:0.7 !important;cursor:not-allowed !important}}.skip-explanation{background:rgba(0, 0, 0, 0.5);color:#ffffff;padding:10px 16px;border-radius:8px;font-size:14px;font-weight:500;text-align:center;margin-bottom:12px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.2);backdrop-filter:blur(12px);border:1px solid rgba(255, 255, 255, 0.1);animation:fadeIn 0.3s ease-in-out}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.guide-text.performance-warning-text{animation:gentlePulse 2s ease-in-out infinite;background:rgba(255, 107, 107, 0.3);border:1px solid rgba(255, 107, 107, 0.5)}@keyframes gentlePulse{0%,100%{transform:translate(-50%, -50%) scale(1);background:rgba(255, 107, 107, 0.3)}50%{transform:translate(-50%, -50%) scale(1.02);background:rgba(255, 107, 107, 0.4)}}.skip-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.skip-button:hover{background:#f8f9fa}.skip-button:active{background:#e9ecef;transform:translateY(1px)}.skip-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}.camera-controls{position:absolute;top:16px;right:16px;z-index:25;display:flex;gap:8px;pointer-events:auto;animation:slideInFromTop 0.3s ease-out}.camera-selector-button{height:32px;padding:0 10px;border:none;border-radius:8px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(12px);color:#ffffff;font-size:12px;font-weight:500;cursor:pointer;transition:all 0.2s ease;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255, 255, 255, 0.1);white-space:nowrap;min-width:fit-content}.camera-selector-button:hover{background:rgba(0, 0, 0, 0.8);border-color:rgba(255, 255, 255, 0.2);transform:translateY(-1px)}.camera-selector-button:active{transform:translateY(0);background:rgba(0, 0, 0, 0.9)}.camera-selector-button:disabled,.camera-selector-button.loading{opacity:0.7;cursor:not-allowed;pointer-events:none}.camera-selector-button:disabled:hover,.camera-selector-button.loading:hover{transform:none;background:rgba(0, 0, 0, 0.6);border-color:rgba(255, 255, 255, 0.1)}.button-spinner{width:16px;height:16px;border:2px solid rgba(0, 0, 0, 0.2);border-top:2px solid #333333;border-radius:50%;animation:spin 1s linear infinite;display:inline-block;margin-right:8px;vertical-align:middle}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.camera-selector-dropdown{position:absolute;top:56px;right:16px;z-index:30;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;min-width:260px;max-width:300px;border:1px solid rgba(255, 255, 255, 0.1);overflow:hidden;pointer-events:auto;animation:slideInFromTop 0.3s ease-out}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-8px) scale(0.95)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideInFromTopCentered{0%{opacity:0;transform:translate(-50%, -50%) translateY(-8px) scale(0.95)}100%{opacity:1;transform:translate(-50%, -50%) translateY(0) scale(1)}}.camera-selector-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid rgba(255, 255, 255, 0.1)}.camera-selector-header span{font-weight:500;color:#ffffff;font-size:13px;opacity:0.9}.close-selector{width:20px;height:20px;border:none;background:none;color:rgba(255, 255, 255, 0.7);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all 0.2s ease}.close-selector:hover{background:rgba(255, 255, 255, 0.1);color:#ffffff}.camera-list{padding:4px 0;max-height:240px;overflow-y:auto}.camera-option{width:100%;padding:8px 12px;border:none;background:none;text-align:left;cursor:pointer;transition:all 0.2s ease;display:flex;justify-content:flex-start;align-items:center;gap:8px;color:rgba(255, 255, 255, 0.9)}.camera-option:hover{background:rgba(255, 255, 255, 0.08)}.camera-option.selected{background:rgba(255, 255, 255, 0.12);color:#ffffff}.camera-label{font-size:13px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:0;font-weight:400;display:flex;align-items:center;gap:6px}.camera-label .autofocus-icon{font-size:12px;color:#ffffff !important;opacity:0.8;flex-shrink:0}.selected-indicator{font-size:14px;color:#ffffff;opacity:0.9;flex-shrink:0}.device-info{padding:6px 12px;border-top:1px solid rgba(255, 255, 255, 0.1);background:rgba(255, 255, 255, 0.05)}.device-info small{color:rgba(255, 255, 255, 0.6);font-size:11px;text-transform:capitalize;font-weight:400}@media (max-width: 480px){.camera-controls{top:12px;right:12px;gap:6px}.camera-selector-button{height:36px;padding:0 12px;font-size:11px;border-radius:6px}.camera-selector-dropdown{right:12px;top:48px;min-width:240px;max-width:calc(100vw - 24px)}.camera-selector-header{padding:6px 10px}.camera-option{padding:6px 10px}.device-info{padding:4px 10px}}.watermark{position:absolute;bottom:12px;right:12px;z-index:15;pointer-events:none;opacity:0.7}.watermark img{height:24px;width:auto;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}.component-status{position:absolute;top:16px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);display:flex;align-items:center;gap:6px;padding:6px 10px;z-index:40;height:32px;width:fit-content;animation:slideInFromTop 0.3s ease-out}.status-spinner{width:16px;height:16px;border:1px solid rgba(255, 255, 255, 0.3);border-top:1px solid #ffffff;border-radius:50%;animation:statusSpin 1s linear infinite;flex-shrink:0}.status-content{display:flex;flex-direction:column;gap:1px}.status-message{color:#ffffff;font-size:12px;font-weight:500;margin:0}.status-description{color:rgba(255, 255, 255, 0.7);font-size:10px;line-height:1.2;margin:0}@keyframes statusSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@media (max-width: 480px){.component-status{top:12px;left:12px;padding:4px 8px;gap:4px;height:28px;border-radius:8px}.status-spinner{width:14px;height:14px}.status-message{font-size:11px}.status-description{font-size:9px}.guide-text{font-size:11px;padding:4px 8px;border-radius:8px}}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.85);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:30;border-radius:8px}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255, 255, 255, 0.15);border-top:3px solid #28a745;border-radius:50%;animation:spin 1s ease-in-out infinite;margin-bottom:16px}.loading-text{color:#ffffff;font-size:14px;font-weight:500;text-align:center;opacity:0.9;margin-bottom:4px}.loading-description{color:rgba(255, 255, 255, 0.7);font-size:12px;text-align:center;opacity:0.8}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.performance-monitor{position:absolute;top:70px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);z-index:35;width:fit-content;animation:slideInFromTop 0.3s ease-out;transition:all 0.3s ease}@keyframes slideInFromLeft{0%{opacity:0;transform:translateX(-20px) scale(0.95)}100%{opacity:1;transform:translateX(0) scale(1)}}.performance-expanded{padding:6px 10px}.metrics-row{display:flex;gap:8px;margin-bottom:4px}.metrics-row:last-child{margin-bottom:0}.metric-compact{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:50px}.metric-label{font-size:9px;color:rgba(255, 255, 255, 0.6);font-weight:500;text-transform:uppercase;letter-spacing:0.3px}.metric-value{font-size:10px;font-weight:600;font-family:'Monaco', 'Menlo', 'Consolas', monospace;padding:2px 4px;border-radius:3px;text-align:center;white-space:nowrap}.metric-value.good{color:#4ade80;background:rgba(74, 222, 128, 0.1);border:1px solid rgba(74, 222, 128, 0.2)}.metric-value.warning{color:#fbbf24;background:rgba(251, 191, 36, 0.1);border:1px solid rgba(251, 191, 36, 0.2)}.metric-value.danger{color:#f87171;background:rgba(248, 113, 113, 0.1);border:1px solid rgba(248, 113, 113, 0.2)}@media (max-width: 480px){.performance-monitor{top:60px;left:12px;width:fit-content}.performance-expanded{padding:4px 8px}.metrics-row{gap:6px;margin-bottom:3px}.metric-compact{min-width:45px;gap:1px}.metric-label{font-size:8px}.metric-value{font-size:9px;padding:1px 3px}}.quality-monitor{position:absolute;top:200px;left:16px;background:rgba(0, 0, 0, 0.25);backdrop-filter:blur(20px);border-radius:12px;border:1px solid rgba(255, 255, 255, 0.1);z-index:35;width:fit-content;animation:slideInFromLeft 0.3s ease-out;transition:all 0.3s ease}.quality-text{padding:6px 10px;font-size:11px;color:white;font-family:'Monaco', 'Menlo', 'Consolas', monospace;line-height:1.4}.quality-fail{color:#ff9999}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.7}}.metric-value.danger{animation:pulse 2s infinite}@media (max-width: 480px){.quality-monitor{top:160px;left:12px}.quality-text{padding:4px 8px;font-size:10px}}.manual-capture-section{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);z-index:25;display:flex;flex-direction:column;align-items:center;width:100%;max-width:300px}.manual-capture-button{pointer-events:auto;background:#fff;color:#333;border:none;border-radius:25px;padding:12px 24px;font-size:14px;font-weight:600;cursor:pointer;transition:all 0.3s ease}.manual-capture-button:hover{background:#f8f9fa}.manual-capture-button:active{background:#e9ecef;transform:translateY(1px)}.manual-capture-button:disabled{cursor:not-allowed !important;transform:none !important;opacity:0.7 !important;transition:none !important}@media (max-width: 480px){.manual-capture-section{bottom:16px;max-width:280px}.manual-capture-button{padding:10px 20px;font-size:13px}.manual-capture-button:disabled{opacity:0.7 !important;cursor:not-allowed !important}}.license-error-container{display:flex;align-items:center;justify-content:center;padding:40px 20px;height:100%;width:100%;background:#f5f7fa;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif}.license-error-card{background:#ffffff;border-radius:8px;box-shadow:0 2px 12px rgba(0, 0, 0, 0.1);max-width:480px;width:100%;padding:48px 32px;text-align:center}.license-error-icon{color:#dc3545;margin-bottom:24px}.license-error-title{color:#2c3e50;font-size:24px;font-weight:600;margin:0 0 16px 0}.license-error-message{color:#495057;font-size:16px;line-height:1.6;margin:0 0 24px 0}.license-error-help{color:#6c757d;font-size:14px;margin:0 0 32px 0}.license-error-help a{color:#007bff;text-decoration:none;font-weight:500}.license-error-help a:hover{text-decoration:underline}.license-error-footer{color:#adb5bd;font-size:12px;font-weight:500;padding-top:24px;border-top:1px solid #e9ecef}@media (max-width: 640px){.license-error-card{padding:32px 24px}.license-error-title{font-size:20px}.license-error-message{font-size:14px}}";
 
 const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H {
     constructor() {
@@ -21198,6 +18711,7 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
     MAX_FAILURES = 30;
     lastInferenceTime = 0;
     MIN_INFERENCE_INTERVAL = 50;
+    MOBILE_MIN_INFERENCE_INTERVAL = 100; // Higher interval for mobile to prevent slow motion
     performanceHistory = [];
     PERFORMANCE_HISTORY_SIZE = 10;
     // Sistema simplificado de monitoreo de rendimiento
@@ -21271,6 +18785,10 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
         this.detectionService = this.serviceContainer.getDetectionService();
         this.tracingService = this.serviceContainer.getTracingService();
         this.metricsService = this.serviceContainer.getMetricsService();
+        // Set the custom trace ID if provided via prop
+        if (this.tracingService && this.traceId) {
+            this.tracingService.setSessionTraceId(this.traceId);
+        }
         // Record component initialization
         if (this.tracingService) {
             const span = this.tracingService.startSpan('component.initialize', {
@@ -22058,9 +19576,14 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
                 return;
             }
             this.frameSkipCounter = 0;
-            // Throttle inference
+            // Throttle inference - use higher interval for mobile devices to prevent slow motion effect
             const currentTime = Date.now();
-            if (currentTime - this.lastInferenceTime < this.MIN_INFERENCE_INTERVAL) {
+            const isMobileDevice = this.cameraInfoWithAutofocus.deviceType === 'mobile' ||
+                /Android|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+            const isTablet = this.cameraInfoWithAutofocus.deviceType === 'tablet' ||
+                (/iPad|Android/i.test(navigator.userAgent) && window.innerWidth >= 768);
+            const minInterval = (isMobileDevice && !isTablet) ? this.MOBILE_MIN_INFERENCE_INTERVAL : this.MIN_INFERENCE_INTERVAL;
+            if (currentTime - this.lastInferenceTime < minInterval) {
                 if (captureState.step !== 'completed') {
                     this.animationId = requestAnimationFrame(() => this.detectFrame());
                 }
@@ -22213,7 +19736,7 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
             isCapturing: false
         };
         const cameraInfo = this.cameraInfoWithAutofocus;
-        return (h("div", { key: '69b36b10f1a790caa352acd5e149fe012ddebd3d', class: "detector-container" }, !this.licenseValid && this.licenseError && (h("div", { key: 'b96d8b52f6bb366b1d6239922a95b100befa5735', class: "license-error-container" }, h("div", { key: '58fb20b1acae97631c35730ed395acf9fa583df2', class: "license-error-card" }, h("svg", { key: 'f2726621e000bad3c62b1106778bb50e32ece973', class: "license-error-icon", width: "64", height: "64", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '18a51f219cdc93f717867f61502c55b35d250532', d: "M12 22C12 22 20 18 20 12V5L12 2L4 5V12C4 18 12 22 12 22Z", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '0f157178a69c10590dd55f55c2223fdef31c2569', d: "M12 8V12", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }), h("circle", { key: '0352746bef8e2e5a6be0c3868406005aae574a71', cx: "12", cy: "16", r: "0.5", fill: "currentColor", stroke: "currentColor", "stroke-width": "1" })), h("h2", { key: 'c63de740aa94503f1cf5e1cd1b366b11bc3253b3', class: "license-error-title" }, "Licencia Requerida"), h("p", { key: 'e36cefd08b510fc38f326de557ffc16425a0b324', class: "license-error-message" }, this.licenseError), h("p", { key: 'c77c6545b5186f7fb77a414120d3f6f5ba4a45f0', class: "license-error-help" }, "Contacte a soporte: ", h("a", { key: 'bef70b41a7ec454bed38c4162ce3cafc02c81071', href: "mailto:support@jaak.ai" }, "support@jaak.ai")), h("div", { key: '7fd679252453474021494c8dac3ec44da60b40eb', class: "license-error-footer" }, "JAAK Stamps")))), this.licenseValid && (h("div", { key: '369edcb3d7fcaa18059ae89f340f5e65bd0f0785', class: "video-container" }, h("video", { key: '88a67cf2451ebd53cb4fa709d34d11c7fa98cfc9', ref: el => this.videoRef = el, autoplay: true, muted: true, playsinline: true, class: this.shouldMirrorVideo ? 'mirror' : '', style: { display: captureState.isVideoActive ? 'block' : 'none' } }), h("div", { key: 'd309664c7a9e64f33dd45e0925f27768483b6795', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index) => (h("div", { key: index, class: "detection-box", style: {
+        return (h("div", { key: 'df70f4fa13b2997a19312125c8b236651cb2b81e', class: "detector-container" }, !this.licenseValid && this.licenseError && (h("div", { key: 'c4f7b51515843177bc3063dd7cf9383e3a4c6c73', class: "license-error-container" }, h("div", { key: 'a4a7e95a23690f9f59c971dd2af9bd096ae13ef0', class: "license-error-card" }, h("svg", { key: '6489a82c60fc9c1a7d89c2b3a537c04c1766cbd4', class: "license-error-icon", width: "64", height: "64", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'b90b16b0ee155c8baeee321237470de7b6fa1ff5', d: "M12 22C12 22 20 18 20 12V5L12 2L4 5V12C4 18 12 22 12 22Z", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'c90ec519befb073208dbc5e30e1237dda7f0a18f', d: "M12 8V12", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round" }), h("circle", { key: 'b926e97a83e19c7ca9b66472fedd53b12d22b7d8', cx: "12", cy: "16", r: "0.5", fill: "currentColor", stroke: "currentColor", "stroke-width": "1" })), h("h2", { key: '1f1fce48179331b0150e0c55a6d5efcd0bf95762', class: "license-error-title" }, "Licencia Requerida"), h("p", { key: '1f28787cea92c5160664bd8e445fb514ac55eff4', class: "license-error-message" }, this.licenseError), h("p", { key: '552aecf92fd34fbdd802fc80cdba46596edb115b', class: "license-error-help" }, "Contacte a soporte: ", h("a", { key: '8c44e1e33fbd22a2319acd6c6b27766bec4355f0', href: "mailto:support@jaak.ai" }, "support@jaak.ai")), h("div", { key: 'c2e139fdedcb8e8922f37e915caa7ae3a1b09cb9', class: "license-error-footer" }, "JAAK Stamps")))), this.licenseValid && (h("div", { key: 'c7876bbe35cd28b52433aab6e97de4a0282e25d5', class: "video-container" }, h("video", { key: 'a5fa99c086eb3730ceee7750ece0842539defa3d', ref: el => this.videoRef = el, autoplay: true, muted: true, playsinline: true, class: this.shouldMirrorVideo ? 'mirror' : '', style: { display: captureState.isVideoActive ? 'block' : 'none' } }), h("div", { key: '2c7923dfa706f65cfc3fe71a6ec626cb2ccce7d4', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index) => (h("div", { key: index, class: "detection-box", style: {
                 position: 'absolute',
                 left: `${box.x}px`,
                 top: `${box.y}px`,
@@ -22222,9 +19745,9 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
                 border: '2px solid #32406C',
                 pointerEvents: 'none',
                 boxSizing: 'border-box'
-            } })))), this.isMaskReady && (h("div", { key: 'fbfc808e22ec640ddd9e34d52fab476d7a9becc1', class: "overlay-mask" }, h("div", { key: '40846a04d852bbcc2ac6c4a0ca356adae1c67765', class: "card-outline" }, h("div", { key: '452fe1786b67d0f9194e5d03ad2aaee08868a5fd', class: "side side-top" }), h("div", { key: 'a462c388ea55cd022b9616571f0012bd5eb380d4', class: "side side-right" }), h("div", { key: 'bfa2232443e23f2e72f009c62f7a866b9ff1b084', class: "side side-bottom" }), h("div", { key: '581746eca6fde6340d78e8ab48d6e21d17e7dfd3', class: "side side-left" })), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '8e57ac550ea3718322ba954682f93239acbabc78', class: `guide-text ${this.showPerformanceMessage ? 'performance-warning-text' : ''}` }, this.getGuideText(captureState.step))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '81cfab68789796d901afadc895d28f398e8c15cf', class: "back-capture-section" }, h("div", { key: 'd80455bd916c2d7ac47eb0ce3c62b0e5efbe4dff', class: "back-capture-buttons" }, (!this.useDocumentDetector || this.performanceDegradedMode || this.showManualCaptureButton) && (h("button", { key: 'c6d427cb32ecfb1ff40150d39f1d8ad7565f7156', class: "capture-button primary-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-back' && (h("span", { key: 'cb57aec75ff91f2887fa258bd79b8efb98614d13', class: "button-spinner" })), "Capturar Reverso")), h("button", { key: 'c76f356a34fcbc790ebe2d900ed61cc4a6a02e28', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'skip-back' && (h("span", { key: 'd8fe69623902a5f41587f630552ef28a352733c6', class: "button-spinner" })), this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
+            } })))), this.isMaskReady && (h("div", { key: '3e1f77d89a00e4ad1519875cacd5c541c9b16f91', class: "overlay-mask" }, h("div", { key: '3c717afa809ef2fa102fdaab3418915602516d39', class: "card-outline" }, h("div", { key: 'd3dcd1a85290f3fb2216b1182dce9a4b62cc59c6', class: "side side-top" }), h("div", { key: '4280c1e0f0900ec69b905a6226c1afe9a0a993ad', class: "side side-right" }), h("div", { key: '9b88c21f5eb28d74872409335cd6ca83a284bd9b', class: "side side-bottom" }), h("div", { key: '46b4ef3fca60fcf807da8f574a43cba7f148165b', class: "side side-left" })), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '2222975293bebfd04fa2d4ac4878bce48fd35880', class: `guide-text ${this.showPerformanceMessage ? 'performance-warning-text' : ''}` }, this.getGuideText(captureState.step))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '836fbeadb849cb9df66e03ef0cb791dd0e179df8', class: "back-capture-section" }, h("div", { key: 'f0e8119b79f30ffd40ae206783a83869196757ac', class: "back-capture-buttons" }, (!this.useDocumentDetector || this.performanceDegradedMode || this.showManualCaptureButton) && (h("button", { key: 'e245e800e2378989bfa011524cca66026ace52d9', class: "capture-button primary-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-back' && (h("span", { key: 'd98a692f9ff883d05e24122b54c4e36f5f96e82f', class: "button-spinner" })), "Capturar Reverso")), h("button", { key: 'c32b7784e2bbb89947219f0d458d0a4d62b5352a', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'skip-back' && (h("span", { key: 'bb935e91f07c4c1052576c52aa2a82a726877217', class: "button-spinner" })), this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
             ? `Saltar reverso (${this.backDocumentTimerRemaining}s)`
-            : 'Saltar reverso')))), captureState.isVideoActive && (h("div", { key: '08f4037c20b4dfed59553a7f29474940f5f3eb49', class: "camera-controls" }, h("button", { key: 'e873835d5d6587b19eb5e61e0073e4992fe115b6', class: `camera-selector-button ${this.isSwitchingCamera ? 'loading' : ''}`, onClick: () => this.toggleCameraSelector(), type: "button", title: "Seleccionar c\u00E1mara", disabled: this.isSwitchingCamera }, this.isSwitchingCamera ? (h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (h("div", { key: '8fca7e29f868570bb99dd2d09ca7da807656dad0', class: "camera-selector-dropdown" }, h("div", { key: 'abfac31042d3b362c094a297429e0272dabb2511', class: "camera-selector-header" }, h("span", { key: 'ffcd0e3c262aa86c431617568c1070548d88f38a' }, "Seleccionar C\u00E1mara"), h("button", { key: '8351be02ccbfa818cab352a37a29d2cd5bfd53ef', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), h("div", { key: 'b42d7a5855ec2f76bc105f7b03369b3d4c950762', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`, camera.hasAutofocus && (h("span", { class: "autofocus-icon", title: "Autofoco disponible" }, "\u29BF"))), cameraInfo.selectedCameraId === camera.id && (h("span", { class: "selected-indicator" }, "\u2713")))))), h("div", { key: 'cf3ca9fe1d626320ad2653a3db44cd86e998bcdf', class: "device-info" }, h("small", { key: '9b908dc6e759f1a5311b068dba10428ebd22cdc3' }, "Dispositivo: ", cameraInfo.deviceType)))), this.showManualCaptureButton && captureState.step === 'front' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '9aa48412eaac0b2adf19f1defb3bc835ab031d9f', class: "manual-capture-section" }, h("button", { key: '1828e293ae4e544b00d0dd17a86401ff0436de37', class: "manual-capture-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-front' && (h("span", { key: 'bbea1d654f80e537ff6616920fb6a2cb410e55f0', class: "button-spinner" })), "Capturar Frente"))))), captureState.isCapturing && (h("div", { key: '532f72395868ecf58bef350aed4da4e4fc0fa13c', class: "capture-animation" })), captureState.showFlipAnimation && (h("div", { key: '555cbc7504660b722f23389899956cf979a27e6c', class: "flip-animation" }, h("div", { key: 'e5de939b02cfb65697c70f265492f1f30f75c771', class: "id-card-icon" }), h("div", { key: '35867c2fbdf463d5b28f0bd3a58313d0d6f15e7b', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (h("div", { key: '4a96d077e993012ed333384219ba27d5a68787ea', class: "success-animation" }, h("div", { key: '836809412d0674a0061aadaaa7c712a22f8770da', class: "check-icon" }), h("div", { key: 'd541dbdfa548760b196dd09dc44c3d1a6af8093c', class: "success-text" }, "\u00A1Proceso completado!"))), h("div", { key: '89a9d99fbeedff1bbcf723ba13d551c3290150fe', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (h("div", { key: 'f100984baef7602ea40cea9bb74b4c84fd1f6ed9', class: "status-spinner" })), h("div", { key: 'ad4161c71f438174117e306e5084bfdff3d18dce', class: "status-content" }, h("div", { key: '26310245b58f331075dd344a6497e90631d5d78c', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (h("div", { key: 'f739148b45f7d43a3015cca3de8efc8b71d3d5e4', class: "status-description" }, this.currentStatus.description)))), this.debug && (h("div", { key: '0397b96391dff4f0662c913068a62c714df168bf', class: "performance-monitor" }, h("div", { key: 'da3c3638b3c048a425bf691b29755762ad40aa5c', class: "performance-expanded" }, h("div", { key: '467f5e2dc207cfd9fd31cef24d434452b3247c5f', class: "metrics-row" }, h("div", { key: 'e620d9017402317e09ec554bf933a4f5a5d0b0de', class: "metric-compact" }, h("span", { key: '8d21fa081bbf3ec7ad54f553b60b0a64ae41fb01', class: "metric-label" }, "FPS"), h("span", { key: '8e99113c7b93c128d7e390900a63f16c5b9483c0', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), h("div", { key: '67927ff90810b0c4d6717d520ad50142d5d6c0dd', class: "metric-compact" }, h("span", { key: '4810964d65c18248f01aff90dca36d732b80a05c', class: "metric-label" }, "MEM"), h("span", { key: 'e82ff493a2bc1d3baf60c1f638154e9208d0991f', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), h("div", { key: '6ef07b3f3dc4c3d991f4bbae34e902a9efc1a359', class: "metrics-row" }, h("div", { key: 'b5eed3b30cb99d4d088a05494cda2eff0ba393cc', class: "metric-compact" }, h("span", { key: '52749839a61316b90f424b0920f4c82c6683dd29', class: "metric-label" }, "INF"), h("span", { key: '8509cf19af19b6ac2efc7ab68ac46d9d053c5464', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), h("div", { key: '34a8540d0840056a525a7afc35ca956943b527af', class: "metric-compact" }, h("span", { key: 'bdc2d8cd180b92ee7b84c8372aba5c2f33289669', class: "metric-label" }, "FRAME"), h("span", { key: '481a0735a5b7258fecdc1bab65a4d4018cc0e7b9', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), h("div", { key: '7b5aa0a6fe97970f09db23103f7f0301fd98c4f8', class: "metrics-row" }, h("div", { key: '1c691159409e021176557904a1ceec05abc329e1', class: "metric-compact" }, h("span", { key: '5ab6c25d80548aa4e63c79ecf88d2386393ae707', class: "metric-label" }, "DET"), h("span", { key: '7641532633bc764d4dc209ba7e1827a2f3f59338', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), h("div", { key: 'feee52f464eeb965eeadfd944a65e94600591ed5', class: "metric-compact" }, h("span", { key: 'c7962650a7bf1bc86f8c733eb01d5eeb9e08d37e', class: "metric-label" }, "RATE"), h("span", { key: '337529444c8e7bacb47d686d0be33721a066eebe', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), h("div", { key: '49717c49e5316bfe10690733c5bf07eb0475a3e2', class: "watermark" }, h("img", { key: 'f86ff4364196627bb3f169e5ee1c14696126cd68', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" }))))));
+            : 'Saltar reverso')))), captureState.isVideoActive && (h("div", { key: '471a1292e9d093cce0a0d3fa7f96f3665de749fb', class: "camera-controls" }, h("button", { key: '406911235a06723310ff577c27e3858912e522c4', class: `camera-selector-button ${this.isSwitchingCamera ? 'loading' : ''}`, onClick: () => this.toggleCameraSelector(), type: "button", title: "Seleccionar c\u00E1mara", disabled: this.isSwitchingCamera }, this.isSwitchingCamera ? (h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (h("div", { key: 'b8fd729b78a3c5cb52b7f17d031bb12b894aaf41', class: "camera-selector-dropdown" }, h("div", { key: '2b9b451440d6b6be4103419694ff6a53c92e68ad', class: "camera-selector-header" }, h("span", { key: '2271f4694aa6c0b32ab23a02a7a8d6d4c1bd4144' }, "Seleccionar C\u00E1mara"), h("button", { key: 'ccfc02eb031da17a4907cd835642785bc2ef5e77', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), h("div", { key: '073d6e9e09cde8523e926850dfa73704b579c899', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`, camera.hasAutofocus && (h("span", { class: "autofocus-icon", title: "Autofoco disponible" }, "\u29BF"))), cameraInfo.selectedCameraId === camera.id && (h("span", { class: "selected-indicator" }, "\u2713")))))), h("div", { key: '8f914f855727a6ab02a2941fee91283bf3882df2', class: "device-info" }, h("small", { key: '295433a43a539034992f04a29355deed12082092' }, "Dispositivo: ", cameraInfo.deviceType)))), this.showManualCaptureButton && captureState.step === 'front' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: 'cc780583a636e7d4910851789710837c9e188d40', class: "manual-capture-section" }, h("button", { key: '40c5e212a3a4eab4d2edf44e29e6b4fe0e4c5e37', class: "manual-capture-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-front' && (h("span", { key: '1245a13523250b5959a1c303ca20662c2d6750c7', class: "button-spinner" })), "Capturar Frente"))))), captureState.isCapturing && (h("div", { key: '10a0a26b346ecf0945688f82292720871f8dc0b7', class: "capture-animation" })), captureState.showFlipAnimation && (h("div", { key: '68dc7effe82d2f043d778239e2aecb847d159818', class: "flip-animation" }, h("div", { key: '153e0c2229c39c5b9402b9610eaee586d98f84c1', class: "id-card-icon" }), h("div", { key: 'b60b249c43ac5f8417c15b8ce46f60d2cb3134d5', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (h("div", { key: 'fefa7bf80546a463a54a275e425241545ace5c77', class: "success-animation" }, h("div", { key: 'cda9d64b3b30cc636d976c2c644a927a8ebe341e', class: "check-icon" }), h("div", { key: 'fd00554df841cdb6e1a167b7e6cc4a6b9b60957a', class: "success-text" }, "\u00A1Proceso completado!"))), h("div", { key: 'cd5fa1fbfa5e3a4e362281553dde2c37601b1078', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (h("div", { key: 'cb0d76938d8ccab99632920ffc9d73a1fa7dec79', class: "status-spinner" })), h("div", { key: 'bcfdc2a24e12dc0bcc19ae0d647be5ce810994d5', class: "status-content" }, h("div", { key: 'a4b6dad22b40aed65a9c81e9581e61a9ca064e40', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (h("div", { key: '236084444d4d156b672f823349f95b462a8a9bba', class: "status-description" }, this.currentStatus.description)))), this.debug && (h("div", { key: '7423d6c8c7e37b7baffc27fc243536e2659475cc', class: "performance-monitor" }, h("div", { key: '892736f4be3d1cd563ec919c5a504ca8e0d55db0', class: "performance-expanded" }, h("div", { key: 'aa0464f739f838ac4c9e553c79f4c7815f7f65cf', class: "metrics-row" }, h("div", { key: '5dca0c5fe0f91ecfaa25c5775c18a99d53eb8f73', class: "metric-compact" }, h("span", { key: '8e498b185cdefb97286356b56e45dc7b514f667e', class: "metric-label" }, "FPS"), h("span", { key: '3a90611c84b338314ae1503aef6208c67d1282ff', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), h("div", { key: '568e492ef7dad971f1613132028999a81f38f457', class: "metric-compact" }, h("span", { key: '222fd2b522dd9f7172ad9adb442b10c1ce4c6455', class: "metric-label" }, "MEM"), h("span", { key: '8cbe2cf9fd7dd9e22e9a0df6f214165a09e03045', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), h("div", { key: 'e5d946afd1cc80a15a52c9ba1cb252e6e146e929', class: "metrics-row" }, h("div", { key: '65aaaa92e3ce7b5567560d94f98e16226ecf9fd5', class: "metric-compact" }, h("span", { key: '80c6ad0923e729912274a05fffca039e88aa5719', class: "metric-label" }, "INF"), h("span", { key: '4a87270ebdad3be718b86d1382b2a54092e53a16', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), h("div", { key: '41ddc923cdfab0012a2f5d3e19aee33dad6116fe', class: "metric-compact" }, h("span", { key: '84e9f4fb3d5bf60235d71d61dc1d6a8ad429293c', class: "metric-label" }, "FRAME"), h("span", { key: '88fd6964307399ac1547c7086f489af90a92a925', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), h("div", { key: '22409e8dfb349e66ac54c20c6043b414b7ddba34', class: "metrics-row" }, h("div", { key: 'bbe72cb477f4bc313e7978d98c217a4789765df1', class: "metric-compact" }, h("span", { key: '56df43d72df8d3549fa42b2bc32fa5491c3cdb41', class: "metric-label" }, "DET"), h("span", { key: '7ceedb73086eccaed0e25177d76218e9bae1262d', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), h("div", { key: '9407541b4f975b20843c19e7081d1c26bb3f4fd4', class: "metric-compact" }, h("span", { key: '511ffc66436ffe2f14300122213de11f50fbbc30', class: "metric-label" }, "RATE"), h("span", { key: '6a0c864b46314937043831be7646fbfa3d994c86', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), h("div", { key: '72f26e4248c87e428a10bbd7b67bd77a9a32f321', class: "watermark" }, h("img", { key: '32e3f23ca1ff81699dd2a4922f8f7d4aeaa3cc2b', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" }))))));
     }
     // Utility methods
     updateDetectionBoxes(boxes) {
@@ -22732,7 +20255,7 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
         catch (error) {
         }
     }
-    completeProcess(skippedBack = false) {
+    async completeProcess(skippedBack = false) {
         this.stateManager.updateCaptureState({
             step: 'completed',
             showSuccessAnimation: true
@@ -22747,6 +20270,15 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
             ...capturedImages,
             timestamp: new Date().toISOString()
         };
+        // Flush all traces to collector before emitting capture completed
+        if (this.tracingService) {
+            try {
+                await this.tracingService.flush();
+            }
+            catch (error) {
+                console.error('[my-component] Failed to flush traces:', error);
+            }
+        }
         this.captureCompleted.emit(finalImages);
         setTimeout(() => {
             this.stateManager.updateCaptureState({ showSuccessAnimation: false });
@@ -22938,28 +20470,35 @@ const JaakStamps$1 = /*@__PURE__*/ proxyCustomElement(class JaakStamps extends H
     }
     // Adaptive frame skipping based on performance
     getAdaptiveFrameSkip() {
+        // Check if running on mobile device for more aggressive frame skipping
+        const isMobileDevice = this.cameraInfoWithAutofocus.deviceType === 'mobile' ||
+            /Android|iPhone|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+        const isTablet = this.cameraInfoWithAutofocus.deviceType === 'tablet' ||
+            (/iPad|Android/i.test(navigator.userAgent) && window.innerWidth >= 768);
+        // Mobile-specific base frame skip (more aggressive to prevent slow motion effect)
+        const mobileBaseSkip = isMobileDevice && !isTablet ? 4 : this.BASE_FRAME_SKIP;
         // Base conditions for high frame skip
         if (this.consecutiveFailures > 20)
             return this.MAX_FRAME_SKIP;
         if (this.performanceMetrics.inferenceTime > 200)
-            return 6;
+            return Math.max(6, mobileBaseSkip);
         if (this.performanceMetrics.memoryUsage > 200)
-            return 5;
+            return Math.max(5, mobileBaseSkip);
         // Calculate average processing time
         if (this.performanceHistory.length > 0) {
             const avgProcessingTime = this.performanceHistory.reduce((a, b) => a + b, 0) / this.performanceHistory.length;
             if (avgProcessingTime > 100)
-                return 4;
+                return Math.max(4, mobileBaseSkip);
             if (avgProcessingTime > 80)
-                return 3;
+                return Math.max(3, mobileBaseSkip);
             if (avgProcessingTime > 60)
-                return this.BASE_FRAME_SKIP + 1;
+                return Math.max(this.BASE_FRAME_SKIP + 1, mobileBaseSkip);
         }
         // Low memory devices get higher frame skip
         if (this.performanceMetrics.memoryUsage > 150)
-            return 4;
-        // Performance is good, use base frame skip
-        return this.BASE_FRAME_SKIP;
+            return Math.max(4, mobileBaseSkip);
+        // Mobile devices use higher base frame skip for smoother video
+        return mobileBaseSkip;
     }
     // Método para resetear la máscara a color blanco
     resetMaskToWhite() {