@react-native/debugger-frontend 0.84.0-nightly-20251203-a5e6addc6 → 0.84.0-nightly-20251205-95cc1e767
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/BUILD_INFO +2 -2
- package/dist/third-party/front_end/Images/Images.js +1 -0
- package/dist/third-party/front_end/Images/react_native/whats-new-083.jpg +0 -0
- package/dist/third-party/front_end/core/i18n/locales/en-US.json +1 -1
- package/dist/third-party/front_end/panels/rn_welcome/rn_welcome.js +20 -10
- package/dist/third-party/front_end/panels/timeline/timeline.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import*as e from"../../core/host/host.js";import*as i from"../../core/i18n/i18n.js";import*as
|
|
1
|
+
import*as e from"../../core/host/host.js";import*as i from"../../core/i18n/i18n.js";import*as t from"../../core/root/root.js";import*as o from"../../core/sdk/sdk.js";import*as s from"../../ui/legacy/legacy.js";import{render as r,html as a}from"../../ui/lit/lit.js";var n={cssText:`.rn-welcome-panel{display:flex;flex-direction:column;flex-shrink:0;align-items:stretch;justify-content:center;padding:36px;background-color:var(--color-background);min-height:100%}@media (width >= 1000px){.rn-welcome-panel{flex-direction:row;align-items:center;justify-content:stretch;height:100%;padding:0}}.rn-welcome-hero{display:flex;flex-direction:column;flex-grow:1;flex-shrink:0;align-items:center;justify-content:center;padding:16px;text-align:center}@media (width >= 1000px){.rn-welcome-hero{margin-left:24px}}.rn-welcome-heading{display:flex;align-items:center;margin-bottom:16px}.rn-welcome-icon{width:30px;height:30px;border-radius:7px;margin-right:12px}.rn-welcome-title{font-size:20px;font-weight:normal;color:var(--color-text-primary)}.rn-welcome-title-accessory{margin-left:12px;padding:4px 8px;border-radius:6px;background-color:var(--sys-color-green-bright);font-size:12px;color:var(--sys-color-primary)}.rn-welcome-title-accessory-purple{background-color:var(--sys-color-purple-bright)}.rn-welcome-tagline{margin-bottom:24px;font-size:1rem;line-height:1.3;color:var(--color-text-secondary)}.rn-welcome-links{display:flex;align-items:center}.rn-welcome-links > .devtools-link{position:relative;margin:0 16px;font-size:14px}.rn-welcome-links > .devtools-link:not(:last-child)::after{content:"";position:absolute;right:-16px;height:16px;border-right:1px solid var(--sys-color-on-base-divider)}.rn-welcome-version{position:fixed;top:8px;right:8px;margin-top:24px;padding:4px 12px;border-radius:8px;background:var(--sys-color-surface2);color:var(--color-text-secondary);font-size:11px;z-index:10}.rn-welcome-docsfeed{display:flex;flex-direction:column;flex-shrink:0;align-items:stretch;max-width:700px;margin:0 auto;padding:24px}@media (width >= 1000px){.rn-welcome-docsfeed{flex-shrink:1;width:45%;max-height:100%;margin:0;padding:20px 24px;padding-right:80px;overflow:auto}}.rn-welcome-docsfeed-highlight{display:flex;justify-content:stretch;flex-direction:column;position:relative;overflow:hidden;margin:8px -16px;margin-top:16px;padding:4px 16px;border-radius:16px;flex-shrink:0;background:linear-gradient(135deg,color-mix(in srgb,var(--sys-color-blue-bright),transparent 92%) 0%,color-mix(in srgb,var(--sys-color-purple-bright),transparent 88%) 100%)}.rn-welcome-h2{flex-shrink:0;font-size:16px;font-weight:normal;color:var(--color-text-primary)}.rn-welcome-docsfeed-item{display:flex;flex-shrink:0;align-items:center;margin-bottom:8px;padding:8px;padding-right:16px;border:1px solid var(--sys-color-divider);border-radius:10px;background-color:var(--sys-color-base);text-align:left;font-size:14px;cursor:pointer}.rn-welcome-docsfeed-item:hover{background-color:var(--color-background-elevation-1)}.rn-welcome-docsfeed-item:focus{outline:solid var(--color-grid-focus-selected)}.rn-welcome-docsfeed-item p{margin:0;margin-bottom:4px;text-decoration:none}.rn-welcome-docsfeed-item :not(.devtools-link){color:var(--color-text-secondary)}.rn-welcome-image{flex-shrink:0;aspect-ratio:calc(16 / 9);height:70px;margin-right:16px;border-radius:6px;background-color:var(--sys-color-on-surface-subtle);background-position:center;background-size:cover}.rn-session-id-message{display:block;margin-top:64px;margin-bottom:8px}.rn-session-id{user-select:all;cursor:text}.code-block{background:var(--sys-color-surface2);padding:8px;border-radius:8px;color:var(--sys-color-on-surface);font-family:var(--monospace-font-family)}\n/*# sourceURL=${import.meta.resolve("./rnWelcome.css")} */\n`};const l={betaLabel:"Beta",techPreviewLabel:"Tech Preview",welcomeMessage:"Welcome to debugging in React Native",docsLabel:"Debugging docs",whatsNewLabel:"What's new",sessionIdMessage:"[FB-only] React Native DevTools session ID:",docsDebuggingBasics:"Debugging Basics",docsDebuggingBasicsDetail:"Overview of debugging tools in React Native",docsReactNativeDevTools:"React Native DevTools",docsReactDevToolsDetail:"Explore features available in React Native DevTools",docsNativeDebugging:"Native Debugging",docsNativeDebuggingDetail:"Find out more about native debugging tools",whatsNewHighlightTitle:"React Native 0.83 - Performance & Network debugging, improved desktop experience",whatsNewHighlightDetail:"Learn about the latest debugging features in 0.83"},c=i.i18n.registerUIStrings("panels/rn_welcome/RNWelcome.ts",l),d=i.i18n.getLocalizedString.bind(void 0,c);let g;class p extends s.Widget.VBox{options;#e;#i=!1;static instance(e){return g||(g=new p(e)),g}constructor(e){super(!0,!0),this.registerRequiredCSS(n),this.options=e,o.TargetManager.TargetManager.instance().observeModels(o.ReactNativeApplicationModel.ReactNativeApplicationModel,this)}wasShown(){super.wasShown(),this.render(),this.#i||s.InspectorView.InspectorView.instance().showDrawer({focus:!0,hasTargetDrawer:!1})}modelAdded(e){e.ensureEnabled(),e.addEventListener("MetadataUpdated",this.#t,this),this.#e=e.metadataCached?.reactNativeVersion,this.#i=e.metadataCached?.unstable_isProfilingBuild||!1}modelRemoved(e){e.removeEventListener("MetadataUpdated",this.#t,this)}#t(e){this.#e=e.data.reactNativeVersion,this.#i=e.data.unstable_isProfilingBuild||!1,this.isShowing()&&this.render()}#o(i){e.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab(i)}render(){const{debuggerBrandName:e,showBetaLabel:i=!1,showTechPreviewLabel:o=!1,showDocs:s=!1}=this.options,n=new URL("../../Images/react_native/welcomeIcon.png",import.meta.url).toString(),c=new URL("../../Images/react_native/whats-new-083.jpg",import.meta.url).toString(),g=new URL("../../Images/react_native/learn-debugging-basics.jpg",import.meta.url).toString(),p=new URL("../../Images/react_native/learn-react-native-devtools.jpg",import.meta.url).toString(),m=new URL("../../Images/react_native/learn-native-debugging.jpg",import.meta.url).toString(),h=t.Runtime.Runtime.queryParam("launchId");r(a`
|
|
2
2
|
<div class="rn-welcome-panel">
|
|
3
3
|
<header class="rn-welcome-hero">
|
|
4
4
|
<div class="rn-welcome-heading">
|
|
@@ -11,7 +11,7 @@ import*as e from"../../core/host/host.js";import*as i from"../../core/i18n/i18n.
|
|
|
11
11
|
${d(l.betaLabel)}
|
|
12
12
|
</div>
|
|
13
13
|
`:null}
|
|
14
|
-
${
|
|
14
|
+
${o?a`
|
|
15
15
|
<div class="rn-welcome-title-accessory rn-welcome-title-accessory-purple">
|
|
16
16
|
${d(l.techPreviewLabel)}
|
|
17
17
|
</div>
|
|
@@ -28,13 +28,13 @@ import*as e from"../../core/host/host.js";import*as i from"../../core/i18n/i18n.
|
|
|
28
28
|
${d(l.whatsNewLabel)}
|
|
29
29
|
</x-link>
|
|
30
30
|
</div>
|
|
31
|
-
${
|
|
31
|
+
${h?a`
|
|
32
32
|
<aside>
|
|
33
33
|
<div class="rn-session-id-message">
|
|
34
34
|
${d(l.sessionIdMessage)}
|
|
35
35
|
</div>
|
|
36
36
|
<div class="code-block rn-session-id">
|
|
37
|
-
${
|
|
37
|
+
${h}
|
|
38
38
|
</div>
|
|
39
39
|
</aside>
|
|
40
40
|
`:""}
|
|
@@ -44,23 +44,33 @@ import*as e from"../../core/host/host.js";import*as i from"../../core/i18n/i18n.
|
|
|
44
44
|
</header>
|
|
45
45
|
${s?a`
|
|
46
46
|
<section class="rn-welcome-docsfeed">
|
|
47
|
+
<div class="rn-welcome-docsfeed-highlight">
|
|
48
|
+
<h2 class="rn-welcome-h2">What's new</h2>
|
|
49
|
+
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#o.bind(this,"https://reactnative.dev/blog")} title=${d(l.docsDebuggingBasics)}>
|
|
50
|
+
<div class="rn-welcome-image" style="background-image: url('${c}')"></div>
|
|
51
|
+
<div>
|
|
52
|
+
<p class="devtools-link">${d(l.whatsNewHighlightTitle)}</p>
|
|
53
|
+
<p>${d(l.whatsNewHighlightDetail)}</p>
|
|
54
|
+
</div>
|
|
55
|
+
</button>
|
|
56
|
+
</div>
|
|
47
57
|
<h2 class="rn-welcome-h2">Learn</h2>
|
|
48
|
-
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#
|
|
49
|
-
<div class="rn-welcome-image" style="background-image: url('${
|
|
58
|
+
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#o.bind(this,"https://reactnative.dev/docs/debugging")} title=${d(l.docsDebuggingBasics)}>
|
|
59
|
+
<div class="rn-welcome-image" style="background-image: url('${g}')"></div>
|
|
50
60
|
<div>
|
|
51
61
|
<p class="devtools-link">${d(l.docsDebuggingBasics)}</p>
|
|
52
62
|
<p>${d(l.docsDebuggingBasicsDetail)}</p>
|
|
53
63
|
</div>
|
|
54
64
|
</button>
|
|
55
|
-
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#
|
|
56
|
-
<div class="rn-welcome-image" style="background-image: url('${
|
|
65
|
+
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#o.bind(this,"https://reactnative.dev/docs/react-native-devtools")} title=${d(l.docsReactNativeDevTools)}>
|
|
66
|
+
<div class="rn-welcome-image" style="background-image: url('${p}')"></div>
|
|
57
67
|
<div>
|
|
58
68
|
<p class="devtools-link">${d(l.docsReactNativeDevTools)}</p>
|
|
59
69
|
<p>${d(l.docsReactDevToolsDetail)}</p>
|
|
60
70
|
</div>
|
|
61
71
|
</button>
|
|
62
|
-
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#
|
|
63
|
-
<div class="rn-welcome-image" style="background-image: url('${
|
|
72
|
+
<button class="rn-welcome-docsfeed-item" type="button" role="link" @click=${this.#o.bind(this,"https://reactnative.dev/docs/debugging-native-code")} title=${d(l.docsNativeDebugging)}>
|
|
73
|
+
<div class="rn-welcome-image" style="background-image: url('${m}')"></div>
|
|
64
74
|
<div>
|
|
65
75
|
<p class="devtools-link">${d(l.docsNativeDebugging)}</p>
|
|
66
76
|
<p>${d(l.docsNativeDebuggingDetail)}</p>
|