@qilin-agent/experimental-inspector 0.0.0-stage → 3.1.6

package/lib/devtools/chunks/explain-fG84ckui.js

@@ -0,0 +1,747 @@
+import { bt as e, d as t, p as n, u as r, wt as i } from "./common-qd_KLeYO.js";
+import { p as a, r as o } from "./root-DbVQo07X.js";
+import { $i as s, Gf as c, Hf as l, Io as u, Na as d, No as f, Qi as p, Sa as ee, Wf as m, Xf as h, Zi as g, Zo as _, ep as v, ha as y, ii as te, jr as b, mf as x, ni as S, no as C, np as w, op as T, pf as E, qa as D } from "./legacy-C0IOfyhX.js";
+import "./common-C6gzvSKg.js";
+import { d as O, f as ne, l as k } from "./console-DEk3riFh.js";
+import { t as A } from "./marked-zGgfoDxO.js";
+import { t as j } from "./checkbox.css-Cwxn2mfx.js";
+import { t as M } from "./markdown_view-DN02v7_2.js";
+//#region \0dsh-devtools:css:/home/runner/work/QiLin/QiLin/node_modules/.pnpm/chrome-devtools-frontend@1.0.1638082/node_modules/chrome-devtools-frontend/front_end/panels/explain/components/consoleInsight.css.mjs
+var re = "/*\n * Copyright 2023 The Chromium Authors\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n@scope to (devtools-widget > *) {\n  * {\n    padding: 0;\n    margin: 0;\n    box-sizing: border-box;\n  }\n\n  :scope {\n    font-family: var(--default-font-family);\n    font-size: inherit;\n    display: block;\n  }\n\n  .wrapper {\n    background-color: var(--sys-color-cdt-base-container);\n    border-radius: 16px;\n    container-type: inline-size;\n    display: grid;\n    animation: expand var(--sys-motion-duration-medium2) var(--sys-motion-easing-emphasized) forwards;\n  }\n\n  .wrapper.closing {\n    animation: collapse var(--sys-motion-duration-medium2) var(--sys-motion-easing-emphasized) forwards;\n  }\n\n  @keyframes expand {\n    from {\n      grid-template-rows: 0fr;\n    }\n\n    to {\n      grid-template-rows: 1fr;\n    }\n  }\n\n  @keyframes collapse {\n    from {\n      grid-template-rows: 1fr;\n    }\n\n    to {\n      grid-template-rows: 0fr;\n      padding-top: 0;\n      padding-bottom: 0;\n    }\n  }\n\n  .animation-wrapper {\n    overflow: hidden;\n    padding: var(--sys-size-6) var(--sys-size-8);\n  }\n\n  .wrapper.top {\n    border-radius: 16px 16px 4px 4px;\n  }\n\n  .wrapper.bottom {\n    margin-top: 5px;\n    border-radius: 4px 4px 16px 16px;\n  }\n\n  header {\n    display: flex;\n    flex-direction: row;\n    gap: 6px;\n    color: var(--sys-color-on-surface);\n    font-size: 13px;\n    font-style: normal;\n    font-weight: 500;\n    margin-bottom: var(--sys-size-6);\n    align-items: center;\n  }\n\n  header:focus-visible {\n    outline: none;\n  }\n\n  header > .filler {\n    display: flex;\n    flex-direction: row;\n    gap: var(--sys-size-5);\n    align-items: center;\n    flex: 1;\n  }\n\n  .reminder-container {\n    border-radius: var(--sys-size-5);\n    background-color: var(--sys-color-surface4);\n    padding: var(--sys-size-8);\n    font-weight: var(--ref-typeface-weight-medium);\n\n    h3 {\n      font: inherit;\n    }\n  }\n\n  .reminder-items {\n    display: grid;\n    grid-template-columns: var(--sys-size-8) auto;\n    gap: var(--sys-size-5) var(--sys-size-6);\n    margin-top: var(--sys-size-6);\n    line-height: var(--sys-size-8);\n    font-weight: var(--ref-typeface-weight-regular);\n  }\n\n  main {\n    --override-markdown-view-message-color: var(--sys-color-on-surface);\n\n    color: var(--sys-color-on-surface);\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 20px;\n\n    p {\n      margin-block: 1em;\n    }\n\n    ul {\n      list-style-type: none;\n      list-style-position: inside;\n      padding-inline-start: 0.2em;\n\n      li {\n        display: list-item;\n        list-style-type: disc;\n        list-style-position: outside;\n        margin-inline-start: 1em;\n      }\n\n      li::marker {\n        font-size: 11px;\n        line-height: 1;\n      }\n    }\n\n    label {\n      display: inline-flex;\n      flex-direction: row;\n      gap: 0.5em;\n\n      input,\n      span {\n        vertical-align: middle;\n      }\n\n      input[type=\"checkbox\"] {\n        margin-top: 0.3em;\n      }\n    }\n  }\n\n  .opt-in-teaser {\n    display: flex;\n    gap: var(--sys-size-5);\n  }\n\n  devtools-markdown-view {\n    margin-bottom: 12px;\n  }\n\n  footer {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    color: var(--sys-color-on-surface);\n    font-style: normal;\n    font-weight: 400;\n    line-height: normal;\n    margin-top: 14px;\n    gap: 32px;\n  }\n\n  @container (max-width: 600px) {\n    footer {\n      gap: 8px;\n    }\n  }\n\n  footer > .filler {\n    flex: 1;\n  }\n\n  footer .rating {\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n  }\n\n  textarea {\n    height: 84px;\n    padding: 10px;\n    border-radius: 8px;\n    border: 1px solid var(--sys-color-neutral-outline);\n    width: 100%;\n    font-family: var(--default-font-family);\n    font-size: inherit;\n  }\n\n  .buttons {\n    display: flex;\n    gap: 5px;\n  }\n\n  @media (width <= 500px) {\n    .buttons {\n      flex-wrap: wrap;\n    }\n  }\n\n  main .buttons {\n    margin-top: 12px;\n  }\n\n  .disclaimer {\n    display: flex;\n    gap: 2px;\n    color: var(--sys-color-on-surface-subtle);\n    font-size: 11px;\n    align-items: flex-start;\n    flex-direction: column;\n  }\n\n  .link {\n    color: var(--sys-color-primary);\n    text-decoration-line: underline;\n\n    devtools-icon {\n      color: var(--sys-color-primary);\n      width: 14px;\n      height: 14px;\n    }\n  }\n\n  button.link {\n    border: none;\n    background: none;\n    cursor: pointer;\n    font: inherit;\n  }\n\n  .loader {\n    background:\n      linear-gradient(\n        130deg,\n        transparent 0%,\n        var(--sys-color-gradient-tertiary) 20%,\n        var(--sys-color-gradient-primary) 40%,\n        transparent 60%,\n        var(--sys-color-gradient-tertiary) 80%,\n        var(--sys-color-gradient-primary) 100%\n      );\n    background-position: 0% 0%;\n    background-size: 250% 250%;\n    animation: gradient 5s infinite linear;\n  }\n\n  @keyframes gradient {\n    0% { background-position: 0 0; }\n    100% { background-position: 100% 100%; }\n  }\n\n  summary {\n    font-size: 12px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 20px;\n  }\n\n  details {\n    overflow: hidden;\n    margin-top: 10px;\n  }\n\n  ::details-content {\n    height: 0;\n    transition:\n      height var(--sys-motion-duration-short4) var(--sys-motion-easing-emphasized),\n      content-visibility var(--sys-motion-duration-short4) var(--sys-motion-easing-emphasized) allow-discrete;\n  }\n\n  [open]::details-content {\n    height: auto;\n  }\n\n  details.references {\n    /* This transition is only added because there is no `transitionend` event in\n      JS for the `::details-content` transition. */\n    transition: margin-bottom var(--sys-motion-duration-short4) var(--sys-motion-easing-emphasized);\n  }\n\n  details.references[open] {\n    /* This transition does not affect the actual UI because of collapsing margins. */\n    margin-bottom: var(--sys-size-1);\n  }\n\n  h2 {\n    display: block;\n    font-size: var(--sys-size-7);\n    margin: 0;\n    font-weight: var(--ref-typeface-weight-medium);\n    line-height: var(--sys-size-9);\n  }\n\n  h2:focus-visible {\n    outline: none;\n  }\n\n  .info {\n    width: 20px;\n    height: 20px;\n  }\n\n  .badge {\n    background: linear-gradient(135deg, var(--sys-color-gradient-primary), var(--sys-color-gradient-tertiary));\n    border-radius: var(--sys-size-3);\n    height: var(--sys-size-9);\n\n    devtools-icon {\n      margin: var(--sys-size-2);\n    }\n  }\n\n  .header-icon-container {\n    background: linear-gradient(135deg, var(--sys-color-gradient-primary), var(--sys-color-gradient-tertiary));\n    border-radius: var(--sys-size-4);\n    height: 36px;\n    width: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n\n  .close-button {\n    align-self: flex-start;\n  }\n\n  .sources-list {\n    padding-left: var(--sys-size-6);\n    margin-bottom: var(--sys-size-6);\n    list-style: none;\n    counter-reset: sources;\n    display: grid;\n    grid-template-columns: var(--sys-size-9) auto;\n    list-style-position: inside;\n  }\n\n  .sources-list li {\n    display: contents;\n  }\n\n  .sources-list li::before {\n    counter-increment: sources;\n    content: \"[\" counter(sources) \"]\";\n    display: table-cell;\n  }\n\n  .sources-list devtools-link.highlighted {\n    animation: highlight-fadeout 2s;\n  }\n\n  @keyframes highlight-fadeout {\n    from {\n      background-color: var(--sys-color-yellow-container);\n    }\n\n    to {\n      background-color: transparent;\n    }\n  }\n\n  .references-list {\n    padding-left: var(--sys-size-8);\n  }\n\n  .references-list li {\n    padding-left: var(--sys-size-3);\n  }\n\n  details h3 {\n    font-size: 10px;\n    font-weight: var(--ref-typeface-weight-medium);\n    text-transform: uppercase;\n    color: var(--sys-color-on-surface-subtle);\n    padding-left: var(--sys-size-6);\n  }\n\n  .error-message {\n    font: var(--sys-typescale-body4-bold);\n  }\n\n  @scope (.insight-sources) {\n    :root {\n      padding: 0;\n      margin: 0;\n      box-sizing: border-box;\n      display: block;\n    }\n\n    ul {\n      color: var(--sys-color-primary);\n      font-size: 12px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 18px;\n      margin-top: 8px;\n      padding-left: var(--sys-size-6);\n    }\n\n    li {\n      list-style-type: none;\n    }\n\n    ul .link {\n      color: var(--sys-color-primary);\n      display: inline-flex !important; /* stylelint-disable-line declaration-no-important */\n      align-items: center;\n      gap: 4px;\n      text-decoration-line: underline;\n    }\n\n    devtools-icon {\n      height: 16px;\n      width: 16px;\n      margin-right: var(--sys-size-1);\n    }\n\n    devtools-icon[name=\"open-externally\"] {\n      color: var(--icon-link);\n    }\n\n    .source-disclaimer {\n      color: var(--sys-color-on-surface-subtle);\n    }\n  }\n}\n", N = {
+	consoleMessage: "Console message",
+	stackTrace: "Stacktrace",
+	networkRequest: "Network request",
+	relatedCode: "Related code",
+	generating: "Generating explanation…",
+	insight: "Explanation",
+	closeInsight: "Close explanation",
+	inputData: "Data used to understand this message",
+	goodResponse: "Good response",
+	badResponse: "Bad response",
+	report: "Report legal issue",
+	error: "DevTools has encountered an error",
+	errorBody: "Something went wrong. Try again.",
+	opensInNewTab: "(opens in a new tab)",
+	learnMore: "Learn more",
+	notLoggedIn: "This feature is only available when you sign into Chrome with your Google account.",
+	signIn: "Sign in",
+	offlineHeader: "DevTools can’t reach the internet",
+	offline: "Check your internet connection and try again.",
+	signInToUse: "Sign in to use this feature",
+	search: "Use search instead",
+	reloadRecommendation: "Reload the page to capture related network request data for this message in order to create a better insight.",
+	turnOnInSettings: "Turn on {PH1} to receive AI assistance for understanding and addressing console warnings and errors.",
+	settingsLink: "`Console insights` in Settings",
+	references: "Sources and related content",
+	relatedContent: "Related content",
+	timedOut: "Generating a response took too long. Please try again.",
+	notAvailableInIncognitoMode: "AI assistance is not available in Incognito mode or Guest mode"
+}, P = i("panels/explain/components/ConsoleInsight.ts", N), F = e.bind(void 0, P), ie = u.bind(void 0, P), { render: ae, html: I, Directives: L } = f, { widget: R } = te, z = class e extends Event {
+	static eventName = "closeinsight";
+	constructor() {
+		super(e.eventName, {
+			composed: !0,
+			bubbles: !0
+		});
+	}
+};
+function B(e) {
+	switch (e) {
+		case O.MESSAGE: return F(N.consoleMessage);
+		case O.STACKTRACE: return F(N.stackTrace);
+		case O.NETWORK_REQUEST: return F(N.networkRequest);
+		case O.RELATED_CODE: return F(N.relatedCode);
+	}
+}
+var V = "https://policies.google.com/terms", H = "https://policies.google.com/privacy", U = "https://support.google.com/legal/answer/13505487", W = "https://goo.gle/devtools-console-messages-ai", G = "https://support.google.com/legal/troubleshooter/1114905?hl=en#ts=1115658%2C13380504", K = "https://accounts.google.com", q = {
+	name: "citation",
+	level: "inline",
+	start(e) {
+		return e.match(/\[\^/)?.index;
+	},
+	tokenizer(e) {
+		let t = e.match(/^\[\^(\d+)\]/);
+		return t ? {
+			type: "citation",
+			raw: t[0],
+			linkText: Number(t[1])
+		} : !1;
+	},
+	renderer: () => ""
+};
+function J(e) {
+	return !!e.factualityMetadata?.facts.length;
+}
+var Y = (e) => e.stopPropagation();
+function oe(e) {
+	return I`<devtools-button
+    @click=${e}
+    class="search-button"
+    .variant=${s.OUTLINED}
+    .jslogContext=${"search"}
+  >
+    ${F(N.search)}
+  </devtools-button>`;
+}
+function se() {
+	return I`<devtools-link href=${W} class="link" jslogcontext="learn-more">
+    ${F(N.learnMore)}
+  </devtools-link>`;
+}
+function ce(e, t, n, r) {
+	return e.length ? I`
+    <ol class="sources-list">
+      ${e.map((e, i) => I`
+        <li>
+          <devtools-link
+            href=${e}
+            class=${L.classMap({
+		link: !0,
+		highlighted: i === t
+	})}
+            jslogcontext="references.console-insights"
+            ${L.ref((e) => {
+		r.citationLinks[i] = e;
+	})}
+            @animationend=${n}
+          >
+            ${e}
+          </devtools-link>
+        </li>
+      `)}
+    </ol>
+  ` : _;
+}
+function le(e, t) {
+	return e.length === 0 ? _ : I`
+    ${t.length ? I`<h3>${F(N.relatedContent)}</h3>` : _}
+    <ul class="references-list">
+      ${e.map((e) => I`
+        <li>
+          <devtools-link
+            href=${e}
+            class="link"
+            jslogcontext="references.console-insights"
+          >
+            ${e}
+          </devtools-link>
+        </li>
+      `)}
+    </ul>
+  `;
+}
+function ue() {
+	return I`
+    <div role="presentation" aria-label="Loading" class="loader" style="clip-path: url('#clipPath');">
+      <svg width="100%" height="64">
+        <clipPath id="clipPath">
+          <rect x="0" y="0" width="100%" height="16" rx="8"></rect>
+          <rect x="0" y="24" width="100%" height="16" rx="8"></rect>
+          <rect x="0" y="48" width="100%" height="16" rx="8"></rect>
+        </clipPath>
+      </svg>
+    </div>`;
+}
+function de(e, t) {
+	return I`
+    <div class="insight-sources">
+      <ul>
+        ${L.repeat(e, (e) => e.value, (e) => I`<li><devtools-link class="link" title="${B(e.type)} ${F(N.opensInNewTab)}" href="data:text/plain;charset=utf-8,${encodeURIComponent(e.value)}" .jslogContext=${"source-" + e.type}>
+            <devtools-icon name="open-externally"></devtools-icon>
+            ${B(e.type)}
+          </devtools-link></li>`)}
+        ${t ? I`<li class="source-disclaimer">
+          <devtools-icon name="warning"></devtools-icon>
+          ${F(N.reloadRecommendation)}</li>` : _}
+      </ul>
+    </div>`;
+}
+function fe(e, { renderer: t, disableAnimations: n, areReferenceDetailsOpen: r, highlightedCitationIndex: i, callbacks: a }, o) {
+	return I`
+        ${e.validMarkdown ? I`<devtools-markdown-view
+            .data=${{
+		tokens: e.tokens,
+		renderer: t,
+		animationEnabled: !n
+	}}>
+          </devtools-markdown-view>` : e.explanation}
+        ${e.timedOut ? I`<p class="error-message">${F(N.timedOut)}</p>` : _}
+        ${J(e.metadata) ? I`
+          <details
+            class="references"
+            ?open=${r}
+            jslog=${d("references").track({ click: !0 })}
+            @toggle=${a.onToggleReferenceDetails}
+            @transitionend=${a.onReferencesOpen}
+          >
+            <summary>${F(N.references)}</summary>
+            ${ce(e.directCitationUrls, i, a.onCitationAnimationEnd, o)}
+            ${le(e.relatedUrls, e.directCitationUrls)}
+          </details>
+        ` : _}
+        <details jslog=${d("sources").track({ click: !0 })}>
+          <summary>${F(N.inputData)}</summary>
+          ${de(e.sources, e.isPageReloadRecommended)}
+        </details>
+        <div class="buttons">
+          ${oe(a.onSearch)}
+        </div>`;
+}
+function X(e) {
+	return I`<div class="error">${e}</div>`;
+}
+function pe(e) {
+	return I`
+    <h3>Things to consider</h3>
+    <div class="reminder-items">
+      <div>
+        <devtools-icon name="google" class="medium">
+        </devtools-icon>
+      </div>
+      <div>The console message, associated stack trace, related source code, and the associated network headers are sent to Google to generate explanations. ${e ? "The content you submit and that is generated by this feature will not be used to improve Google’s AI models." : "This data may be seen by human reviewers to improve this feature. Avoid sharing sensitive or personal information."}
+      </div>
+      <div>
+        <devtools-icon name="policy" class="medium">
+        </devtools-icon>
+      </div>
+      <div>Use of this feature is subject to the <devtools-link
+          href=${V}
+          class="link"
+          jslogcontext="terms-of-service.console-insights">
+        Google Terms of Service
+        </devtools-link> and <devtools-link
+          href=${H}
+          class="link"
+          jslogcontext="privacy-policy.console-insights">
+        Google Privacy Policy
+        </devtools-link>
+      </div>
+      <div>
+        <devtools-icon name="warning" class="medium">
+        </devtools-icon>
+      </div>
+      <div>
+        <devtools-link
+          href=${U}
+          class="link"
+          jslogcontext="code-snippets-explainer.console-insights"
+        >Use generated code snippets with caution</devtools-link>
+      </div>
+    </div>`;
+}
+function me(e) {
+	let t = I`
+    <button
+      class="link" role="link"
+      jslog=${y("open-ai-settings").track({ click: !0 })}
+      @click=${e}
+    >${F(N.settingsLink)}</button>`;
+	return I`
+    <div class="badge">
+      <devtools-icon name="lightbulb-spark" class="medium">
+      </devtools-icon>
+    </div>
+    <div>
+      ${ie(N.turnOnInSettings, { PH1: t })} ${se()}
+    </div>`;
+}
+function he() {
+	return X(a.isOffTheRecord ? F(N.notAvailableInIncognitoMode) : F(N.notLoggedIn));
+}
+function Z(e, t) {
+	return I`<span>
+    AI tools may generate inaccurate info that doesn't represent Google's views. ${e ? "The content you submit and that is generated by this feature will not be used to improve Google’s AI models." : "Data sent to Google may be seen by human reviewers to improve this feature."} <button class="link" role="link" @click=${t}
+              jslog=${y("open-ai-settings").track({ click: !0 })}>
+      Open settings
+    </button> or <devtools-link href=${W}
+        class="link" jslogcontext="learn-more">
+      learn more
+    </devtools-link>
+  </span>`;
+}
+function Q(e, t) {
+	return I`
+    <div class="disclaimer">
+      ${Z(e, t)}
+    </div>`;
+}
+function ge(e) {
+	return a.isOffTheRecord ? _ : I`
+    <div class="filler"></div>
+    <div>
+      <devtools-button
+        @click=${e}
+        .variant=${s.PRIMARY}
+        .jslogContext=${"update-settings"}
+      >
+        ${F(N.signIn)}
+      </devtools-button>
+    </div>`;
+}
+function _e(e, t) {
+	return I`
+    <div class="filler"></div>
+    <div class="buttons">
+      <devtools-button
+        @click=${e}
+        .variant=${s.TONAL}
+        .jslogContext=${"settings"}
+        .title=${"Settings"}
+      >
+        Settings
+      </devtools-button>
+      <devtools-button
+        class='continue-button'
+        @click=${t}
+        .variant=${s.PRIMARY}
+        .jslogContext=${"continue"}
+        .title=${"continue"}
+      >
+        Continue
+      </devtools-button>
+    </div>`;
+}
+function ve(e, t, n) {
+	return I`
+  <div class="disclaimer">
+    ${Z(e, n.onDisclaimerSettingsLink)}
+  </div>
+  <div class="filler"></div>
+  <div class="rating">
+    <devtools-button
+      data-rating="true"
+      .iconName=${"thumb-up"}
+      .toggledIconName=${"thumb-up"}
+      .variant=${s.ICON_TOGGLE}
+      .size=${g.SMALL}
+      .toggleOnClick=${!1}
+      .toggleType=${p.PRIMARY}
+      .disabled=${t !== void 0}
+      .toggled=${t === !0}
+      .title=${F(N.goodResponse)}
+      .jslogContext=${"thumbs-up"}
+      @click=${() => n.onRating(!0)}
+    ></devtools-button>
+    <devtools-button
+      data-rating="false"
+      .iconName=${"thumb-down"}
+      .toggledIconName=${"thumb-down"}
+      .variant=${s.ICON_TOGGLE}
+      .size=${g.SMALL}
+      .toggleOnClick=${!1}
+      .toggleType=${p.PRIMARY}
+      .disabled=${t !== void 0}
+      .toggled=${t === !1}
+      .title=${F(N.badResponse)}
+      .jslogContext=${"thumbs-down"}
+      @click=${() => n.onRating(!1)}
+    ></devtools-button>
+    <devtools-button
+      .iconName=${"report"}
+      .variant=${s.ICON}
+      .size=${g.SMALL}
+      .title=${F(N.report)}
+      .jslogContext=${"report"}
+      @click=${n.onReport}
+    ></devtools-button>
+  </div>`;
+}
+function ye() {
+	return I`
+    <div class="header-icon-container">
+      <devtools-icon name="lightbulb-spark" class="large">
+      </devtools-icon>
+    </div>`;
+}
+function $({ headerText: e, showIcon: t = !1, showSpinner: n = !1, onClose: r }, i) {
+	return I`
+    <header>
+      ${t ? ye() : _}
+      <div class="filler">
+        <h2 tabindex="-1" ${L.ref(i)}>
+          ${e}
+        </h2>
+        ${n ? I`<devtools-spinner></devtools-spinner>` : _}
+      </div>
+      <div class="close-button">
+        <devtools-button
+          .iconName=${"cross"}
+          .variant=${s.ICON}
+          .size=${g.SMALL}
+          .title=${F(N.closeInsight)}
+          jslog=${ee().track({ click: !0 })}
+          @click=${r}
+        ></devtools-button>
+      </div>
+    </header>
+  `;
+}
+var be = (e, t, n) => {
+	let { state: r, noLogging: i, callbacks: a } = e, { onClose: o, onDisclaimerSettingsLink: s } = a, c = `${C(r.type).track({ resize: !0 })}`, l = _, u = _, d = {}, f;
+	switch (r.type) {
+		case "loading":
+			l = $({
+				headerText: F(N.generating),
+				onClose: o
+			}, t.headerRef), u = ue();
+			break;
+		case "insight":
+			l = $({
+				headerText: F(N.insight),
+				onClose: o,
+				showSpinner: !r.completed
+			}, t.headerRef), u = fe(r, e, t), f = ve(i, e.selectedRating, a);
+			break;
+		case "error":
+			l = $({
+				headerText: F(N.error),
+				onClose: o
+			}, t.headerRef), u = X(F(N.errorBody)), f = Q(i, s);
+			break;
+		case "consent-reminder":
+			l = $({
+				headerText: "Understand console messages with AI",
+				onClose: o,
+				showIcon: !0
+			}, t.headerRef), d["reminder-container"] = !0, u = pe(i), f = _e(a.onReminderSettingsLink, a.onConsentReminderConfirmed);
+			break;
+		case "setting-is-not-true":
+			d["opt-in-teaser"] = !0, u = me(a.onEnableInsightsInSettingsLink);
+			break;
+		case "not-logged-in":
+		case "sync-is-paused":
+			l = $({
+				headerText: F(N.signInToUse),
+				onClose: o
+			}, t.headerRef), u = he(), f = ge(a.onGoToSignIn);
+			break;
+		case "offline":
+			l = $({
+				headerText: F(N.offlineHeader),
+				onClose: o
+			}, t.headerRef), u = X(F(N.offline)), f = Q(i, s);
+			break;
+	}
+	ae(I`
+    <style>${re}</style>
+    <style>${j}</style>
+    <div
+      class=${L.classMap({
+		wrapper: !0,
+		closing: e.closing
+	})}
+      jslog=${D("console-insights").track({ resize: !0 })}
+      @animationend=${a.onAnimationEnd}
+      @keydown=${Y}
+      @keyup=${Y}
+      @keypress=${Y}
+      @click=${Y}
+    >
+      <div class="animation-wrapper">
+        ${l}
+        <main jslog=${c} class=${L.classMap(d)}>
+          ${u}
+        </main>
+        ${f ? I`<footer jslog=${C("footer")}>
+          ${f}
+        </footer>` : _}
+      </div>
+    </div>
+  `, n);
+}, xe = class e extends S {
+	static async create(t, n) {
+		let r = await l.checkAccessPreconditions();
+		return I`<devtools-widget class="devtools-console-insight" ${R((i) => new e(t, n, r, i))}>
+    </devtools-widget>`;
+	}
+	disableAnimations = !1;
+	#e;
+	#t;
+	#n;
+	#r;
+	#i;
+	#a = L.createRef();
+	#o = [];
+	#s = -1;
+	#c = !1;
+	#l = !1;
+	#u = !1;
+	#d;
+	#f;
+	#p;
+	#m;
+	#h;
+	constructor(e, t, n, r, i = be) {
+		super(r), this.#e = i, this.#t = e, this.#n = t, this.#p = n, this.#f = this.#y(), this.#r = new M(this.#g.bind(this)), this.#h = new A({ extensions: [q] }), this.#i = this.#v(), this.#m = this.#x.bind(this), this.requestUpdate();
+	}
+	#g(e) {
+		if (this.#i.type !== "insight") return;
+		let t = this.#c;
+		this.#c = !0, this.#s = e - 1, this.requestUpdate(), t && this.#_();
+	}
+	#_() {
+		let e = this.#o[this.#s];
+		e && (e.scrollIntoView({ behavior: "auto" }), e.focus());
+	}
+	#v() {
+		switch (this.#p) {
+			case v.AVAILABLE: {
+				let e = t.instance().createSetting("console-insights-skip-reminder", !1, r.SESSION).get();
+				return {
+					type: "loading",
+					consentOnboardingCompleted: this.#b().get() || e
+				};
+			}
+			case v.NO_ACCOUNT_EMAIL: return { type: "not-logged-in" };
+			case v.SYNC_IS_PAUSED: return { type: "sync-is-paused" };
+			case v.NO_INTERNET: return { type: "offline" };
+		}
+	}
+	#y() {
+		try {
+			return n("console-insights-enabled");
+		} catch {
+			return;
+		}
+	}
+	#b() {
+		return t.instance().createLocalSetting("console-insights-onboarding-finished", !1);
+	}
+	wasShown() {
+		super.wasShown(), this.focus(), this.#f?.addChangeListener(this.#S, this);
+		let e = a.aidaAvailability?.blockedByAge === !0;
+		this.#i.type === "loading" && this.#f?.getIfNotDisabled() === !0 && !e && this.#i.consentOnboardingCompleted && E.actionTaken(x.GeneratingInsightWithoutDisclaimer), c.instance().addEventListener(m.AIDA_AVAILABILITY_CHANGED, this.#m), this.#x(), this.#i.type !== "insight" && this.#i.type !== "error" && (this.#i = this.#v()), this.#w();
+	}
+	willHide() {
+		super.willHide(), this.#f?.removeChangeListener(this.#S, this), c.instance().removeEventListener(m.AIDA_AVAILABILITY_CHANGED, this.#m);
+	}
+	async #x() {
+		let e = await l.checkAccessPreconditions();
+		e !== this.#p && (this.#p = e, this.#i = this.#v(), this.#w());
+	}
+	#S() {
+		this.#f?.getIfNotDisabled() === !0 && this.#b().set(!0), this.#i.type === "setting-is-not-true" && this.#f?.getIfNotDisabled() === !0 && (this.#C({
+			type: "loading",
+			consentOnboardingCompleted: !0
+		}), E.actionTaken(x.InsightsOptInTeaserConfirmedInSettings), this.#w()), this.#i.type === "consent-reminder" && this.#f?.getIfNotDisabled() === !1 && (this.#C({
+			type: "loading",
+			consentOnboardingCompleted: !1
+		}), E.actionTaken(x.InsightsReminderTeaserAbortedInSettings), this.#w());
+	}
+	#C(e) {
+		this.#l = this.#i.type !== e.type, this.#i = e, this.requestUpdate();
+	}
+	async #w() {
+		if (this.#i.type !== "loading") return;
+		let e = a.aidaAvailability?.blockedByAge === !0;
+		if (this.#f?.getIfNotDisabled() !== !0 || e) {
+			this.#C({ type: "setting-is-not-true" }), E.actionTaken(x.InsightsOptInTeaserShown);
+			return;
+		}
+		if (!this.#i.consentOnboardingCompleted) {
+			let { sources: e, isPageReloadRecommended: t } = await this.#t.buildPrompt();
+			this.#C({
+				type: "consent-reminder",
+				sources: e,
+				isPageReloadRecommended: t
+			}), E.actionTaken(x.InsightsReminderTeaserShown);
+			return;
+		}
+		await this.#F();
+	}
+	#T() {
+		this.#i.type === "consent-reminder" && E.actionTaken(x.InsightsReminderTeaserCanceled), this.#u = !0, this.requestUpdate();
+	}
+	#E() {
+		if (this.#u) {
+			this.contentElement.dispatchEvent(new z());
+			return;
+		}
+		this.#l && this.#a.value?.focus();
+	}
+	#D() {
+		this.#s !== -1 && (this.#s = -1, this.requestUpdate());
+	}
+	#O(e) {
+		if (this.#i.type !== "insight") throw Error("Unexpected state");
+		if (this.#i.metadata?.rpcGlobalId === void 0) throw Error("RPC Id not in metadata");
+		if (this.#d !== void 0) return;
+		this.#d = e, this.requestUpdate(), this.#d ? E.actionTaken(x.InsightRatedPositive) : E.actionTaken(x.InsightRatedNegative);
+		let t = a.aidaAvailability?.disallowLogging ?? !0;
+		return this.#n.registerClientEvent({
+			corresponding_aida_rpc_global_id: this.#i.metadata.rpcGlobalId,
+			disable_user_content_logging: t,
+			do_conversation_client_event: { user_feedback: { sentiment: this.#d ? T.POSITIVE : T.NEGATIVE } }
+		});
+	}
+	#k() {
+		h.openInNewTab(G);
+	}
+	#A() {
+		let e = this.#t.getSearchQuery();
+		h.openSearchResultsInNewTab(e);
+	}
+	async #j() {
+		this.#b().set(!0), this.#C({
+			type: "loading",
+			consentOnboardingCompleted: !0
+		}), E.actionTaken(x.InsightsReminderTeaserConfirmed), await this.#F();
+	}
+	#M(e, t) {
+		let n = [];
+		if (!J(t) || !t.attributionMetadata) return {
+			explanationWithCitations: e,
+			directCitationUrls: n
+		};
+		let { attributionMetadata: r } = t, i = r.citations.filter((e) => e.sourceType === w.WORLD_FACTS).sort((e, t) => (t.endIndex || 0) - (e.endIndex || 0)), a = e;
+		for (let [e, t] of i.entries()) {
+			let r = /[.,:;!?]*\s/g;
+			r.lastIndex = t.endIndex || 0;
+			let o = r.exec(a);
+			o && t.uri && (a = a.slice(0, o.index) + `[^${i.length - e}]` + a.slice(o.index), n.push(t.uri));
+		}
+		return n.reverse(), {
+			explanationWithCitations: a,
+			directCitationUrls: n
+		};
+	}
+	#N(e) {
+		for (let t of e) if (t.type === "code") {
+			let e = t.text.match(/\[\^\d+\]/g);
+			t.text = t.text.replace(/\[\^\d+\]/g, ""), e?.length && (t.citations = e.map((e) => {
+				let t = parseInt(e.slice(2, -1), 10);
+				return {
+					index: t,
+					clickHandler: this.#g.bind(this, t)
+				};
+			}));
+		}
+	}
+	#P(e, t) {
+		if (!t.factualityMetadata?.facts.length) return [];
+		let n = t.factualityMetadata.facts.filter((t) => t.sourceUri && !e.includes(t.sourceUri)).map((e) => e.sourceUri) || [], r = t.attributionMetadata?.citations.filter((e) => e.sourceType === w.TRAINING_DATA && (e.uri || e.repository)).map((e) => e.uri || `https://www.github.com/${e.repository}`) || [], i = [...new Set(r.filter((t) => !n.includes(t) && !e.includes(t)))];
+		return n.push(...i), n;
+	}
+	async #F() {
+		try {
+			for await (let { sources: e, isPageReloadRecommended: t, explanation: n, metadata: r, completed: i } of this.#L()) {
+				let { explanationWithCitations: a, directCitationUrls: o } = this.#M(n, r), s = this.#P(o, r), c = this.#I(a), l = c !== !1;
+				l && this.#N(c), this.#C({
+					type: "insight",
+					tokens: l ? c : [],
+					validMarkdown: l,
+					explanation: n,
+					sources: e,
+					metadata: r,
+					isPageReloadRecommended: t,
+					completed: i,
+					directCitationUrls: o,
+					relatedUrls: s
+				});
+			}
+			E.actionTaken(x.InsightGenerated);
+		} catch (e) {
+			console.error("[ConsoleInsight] Error in #generateInsight:", e), E.actionTaken(x.InsightErrored), e.message === "doAidaConversation timed out" && this.#i.type === "insight" ? (this.#i.timedOut = !0, this.#C({
+				...this.#i,
+				completed: !0,
+				timedOut: !0
+			})) : this.#C({
+				type: "error",
+				error: e.message
+			});
+		}
+	}
+	#I(e) {
+		try {
+			let t = this.#h.lexer(e);
+			for (let e of t) this.#r.renderToken(e);
+			return t;
+		} catch {
+			return E.actionTaken(x.InsightErroredMarkdown), !1;
+		}
+	}
+	async *#L() {
+		let { prompt: e, sources: t, isPageReloadRecommended: n } = await this.#t.buildPrompt();
+		try {
+			for await (let r of this.#n.doConversation(l.buildConsoleInsightsRequest(e))) yield {
+				sources: t,
+				isPageReloadRecommended: n,
+				...r
+			};
+		} catch (e) {
+			throw e.message === "Server responded: permission denied" ? E.actionTaken(x.InsightErroredPermissionDenied) : e.message.startsWith("Cannot send request:") ? E.actionTaken(x.InsightErroredCannotSend) : e.message.startsWith("Request failed:") ? E.actionTaken(x.InsightErroredRequestFailed) : e.message.startsWith("Cannot parse chunk:") ? E.actionTaken(x.InsightErroredCannotParseChunk) : e.message === "Unknown chunk result" ? E.actionTaken(x.InsightErroredUnknownChunk) : e.message.startsWith("Server responded:") ? E.actionTaken(x.InsightErroredApi) : E.actionTaken(x.InsightErroredOther), e;
+		}
+	}
+	#R() {
+		h.openInNewTab(K);
+	}
+	#z(e) {
+		let t = e.target;
+		t && (this.#c = t.open, t.open || (this.#s = -1), this.requestUpdate());
+	}
+	#B() {
+		b.instance().showView("chrome-ai");
+	}
+	#V() {
+		E.actionTaken(x.InsightsReminderTeaserSettingsLinkClicked), b.instance().showView("chrome-ai");
+	}
+	#H() {
+		E.actionTaken(x.InsightsOptInTeaserSettingsLinkClicked), b.instance().showView("chrome-ai");
+	}
+	performUpdate() {
+		let e = {
+			state: this.#i,
+			closing: this.#u,
+			disableAnimations: this.disableAnimations,
+			renderer: this.#r,
+			citationClickHandler: this.#g.bind(this),
+			selectedRating: this.#d,
+			noLogging: a.aidaAvailability?.enterprisePolicyValue === o.ALLOW_WITHOUT_LOGGING,
+			areReferenceDetailsOpen: this.#c,
+			highlightedCitationIndex: this.#s,
+			callbacks: {
+				onClose: this.#T.bind(this),
+				onAnimationEnd: this.#E.bind(this),
+				onCitationAnimationEnd: this.#D.bind(this),
+				onSearch: this.#A.bind(this),
+				onRating: this.#O.bind(this),
+				onReport: this.#k.bind(this),
+				onGoToSignIn: this.#R.bind(this),
+				onConsentReminderConfirmed: this.#j.bind(this),
+				onToggleReferenceDetails: this.#z.bind(this),
+				onDisclaimerSettingsLink: this.#B.bind(this),
+				onReminderSettingsLink: this.#V.bind(this),
+				onEnableInsightsInSettingsLink: this.#H.bind(this),
+				onReferencesOpen: this.#_.bind(this)
+			}
+		}, t = {
+			headerRef: this.#a,
+			citationLinks: []
+		};
+		this.#e(e, t, this.contentElement), this.#o = t.citationLinks;
+	}
+}, Se = class {
+	handleAction(e, t) {
+		switch (t) {
+			case "explain.console-message.context":
+			case "explain.console-message.context.error":
+			case "explain.console-message.context.warning":
+			case "explain.console-message.context.other":
+			case "explain.console-message.teaser":
+			case "explain.console-message.hover": {
+				let n = e.flavor(ne);
+				if (n) {
+					t.startsWith("explain.console-message.context") ? E.actionTaken(x.InsightRequestedViaContextMenu) : t === "explain.console-message.teaser" ? E.actionTaken(x.InsightRequestedViaTeaser) : t === "explain.console-message.hover" && E.actionTaken(x.InsightRequestedViaHoverButton);
+					let e = new k(n), r = new l();
+					return xe.create(e, r).then((e) => {
+						n.setInsight(e);
+					}), !0;
+				}
+				return !1;
+			}
+		}
+		return !1;
+	}
+};
+//#endregion
+export { Se as ActionDelegate };