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

package/lib/client.page.js

@@ -0,0 +1,314 @@
+window.__ModuleLoader__.load({
+	id: "@qilin-agent/experimental-inspector",
+	chunk: "client.page.js",
+	factory: (require) => {
+		var module = { exports: {} };
+		var exports = module.exports;
+		let react_jsx_runtime = require("react/jsx-runtime");
+		let react = require("react");
+		let _qilin_agent_client_store = require("@qilin-agent/client-store");
+		let _qilin_agent_client_ui_primitives = require("@qilin-agent/client-ui-primitives");
+		//#region lib/types/client/bottom/keyboard.js
+		/**
+		* Forward the Inspector's current binding without replacing parent command arbitration.
+		* @param frame - Owned DevTools iframe.
+		* @param readBinding - Current effective Inspector binding, including user overrides.
+		* @returns Release load and document listeners.
+		*/
+		function bindInspectorKeyboard(frame, readBinding) {
+			let release;
+			const attach = () => {
+				release?.();
+				release = void 0;
+				const document = frame.contentDocument;
+				if (document === null) return;
+				const keydown = (event) => {
+					if (event.defaultPrevented || event.isComposing || event.getModifierState("AltGraph")) return;
+					const binding = readBinding();
+					if (binding == null || binding.secondCode !== void 0 || binding.code !== event.code) return;
+					const flags = [
+						event.ctrlKey,
+						event.altKey,
+						event.shiftKey,
+						event.metaKey
+					];
+					if (![
+						"control",
+						"alt",
+						"shift",
+						"meta"
+					].every((modifier, index) => binding.modifiers.includes(modifier) === flags[index])) return;
+					const forwarded = new KeyboardEvent("keydown", {
+						key: event.key,
+						code: event.code,
+						ctrlKey: event.ctrlKey,
+						altKey: event.altKey,
+						shiftKey: event.shiftKey,
+						metaKey: event.metaKey,
+						repeat: event.repeat,
+						bubbles: true,
+						cancelable: true,
+						composed: true
+					});
+					if (!frame.dispatchEvent(forwarded)) event.preventDefault();
+				};
+				document.addEventListener("keydown", keydown);
+				release = () => {
+					document.removeEventListener("keydown", keydown);
+				};
+			};
+			frame.addEventListener("load", attach);
+			attach();
+			return () => {
+				frame.removeEventListener("load", attach);
+				release?.();
+			};
+		}
+		//#endregion
+		//#region \0qilin-css:/home/runner/work/QiLin/QiLin/packages/experimental/inspector/src/client/bottom/page.module.css.mjs
+		const css = ".u6n5Sa_panel{height:var(--inspector-height);background:var(--dsw-alias-bg-base);border-top:.5px solid var(--dsw-alias-border-l3);box-sizing:border-box;flex-direction:column;min-height:0;display:flex;position:relative;overflow:hidden}.u6n5Sa_panel[hidden]{display:none}.u6n5Sa_header{color:var(--dsw-alias-label-primary);flex:none;justify-content:space-between;align-items:center;padding:6px 12px 4px;font-size:12px;line-height:20px;display:flex}.u6n5Sa_close{width:28px;padding:0}.u6n5Sa_resize{cursor:row-resize;touch-action:none;user-select:none;height:6px;position:absolute;inset:0 0 auto}.u6n5Sa_resize:hover,.u6n5Sa_resize:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}.u6n5Sa_page{border:0;flex:1;width:100%;min-width:0;height:0;min-height:0;display:block}";
+		const tagId = "@qilin-agent/experimental-inspector/page.module.css";
+		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
+			const tag = document.createElement("style");
+			tag.dataset.plugin = "@qilin-agent/experimental-inspector";
+			tag.dataset.pluginCss = tagId;
+			tag.textContent = css;
+			document.head.appendChild(tag);
+		}
+		var page_module_css_default = {
+			"close": "u6n5Sa_close",
+			"header": "u6n5Sa_header",
+			"page": "u6n5Sa_page",
+			"panel": "u6n5Sa_panel",
+			"resize": "u6n5Sa_resize"
+		};
+		//#endregion
+		//#region lib/types/client/bottom/resize.js
+		/** Pointer-captured resizing keeps the Inspector and main content within the viewport. */
+		const MIN_HEIGHT = 20;
+		const MAX_HEIGHT = 80;
+		/**
+		* Render the top divider; height is a percentage of the viewport, retained by its panel.
+		* @param props - current height, resize callback, localized label, and controlled panel id.
+		* @returns the pointer- and keyboard-operable horizontal divider.
+		*/
+		function InspectorResizeHandle({ height, onResize, label, panelId }) {
+			const drag = (0, react.useRef)();
+			const resize = (value) => {
+				onResize(Math.min(MAX_HEIGHT, Math.max(MIN_HEIGHT, value)));
+			};
+			const move = (event) => {
+				const start = drag.current;
+				if (start?.pointerId !== event.pointerId) return;
+				resize(start.height + (start.y - event.clientY) / window.innerHeight * 100);
+			};
+			const end = (event) => {
+				if (drag.current?.pointerId !== event.pointerId) return;
+				drag.current = void 0;
+				if (event.currentTarget.hasPointerCapture(event.pointerId)) event.currentTarget.releasePointerCapture(event.pointerId);
+			};
+			return (0, react_jsx_runtime.jsx)("div", {
+				className: page_module_css_default.resize,
+				role: "separator",
+				tabIndex: 0,
+				"aria-label": label,
+				"aria-orientation": "horizontal",
+				"aria-controls": panelId,
+				"aria-valuemin": MIN_HEIGHT,
+				"aria-valuemax": MAX_HEIGHT,
+				"aria-valuenow": Math.round(height),
+				onPointerDown: (event) => {
+					if (event.button !== 0 || drag.current !== void 0) return;
+					event.preventDefault();
+					event.currentTarget.setPointerCapture(event.pointerId);
+					drag.current = {
+						pointerId: event.pointerId,
+						y: event.clientY,
+						height
+					};
+				},
+				onPointerMove: move,
+				onPointerUp: (event) => {
+					move(event);
+					end(event);
+				},
+				onPointerCancel: end,
+				onLostPointerCapture: end,
+				onKeyDown: (event) => {
+					const next = {
+						ArrowUp: height + 5,
+						ArrowDown: height - 5,
+						Home: MIN_HEIGHT,
+						End: MAX_HEIGHT
+					}[event.key];
+					if (next === void 0) return;
+					event.preventDefault();
+					resize(next);
+				}
+			});
+		}
+		//#endregion
+		//#region lib/types/client/bottom/locales.js
+		/** Localized labels for the NodeJS Inspector bottom panel and command. */
+		const zh = {
+			title: "NodeJS 诊断",
+			toggle: "展开或收起 NodeJS 诊断",
+			close: "收起",
+			resize: "调整 NodeJS 诊断面板高度",
+			frameTitle: "NodeJS 诊断"
+		};
+		/** English labels checked against the bottom-panel dictionary. */
+		const en = {
+			title: "NodeJS Inspector",
+			toggle: "Toggle NodeJS Inspector",
+			close: "Collapse",
+			resize: "Resize NodeJS Inspector panel",
+			frameTitle: "NodeJS Inspector"
+		};
+		//#endregion
+		//#region lib/types/client/bottom/page.js
+		const ID = "inspector.toggle";
+		function InspectorPage({ t, frontendUrl, close, bindFrame, usePanel }) {
+			const state = usePanel((value) => value);
+			const [height, setHeight] = (0, react.useState)(45);
+			const panelId = (0, react.useId)();
+			const release = (0, react.useRef)();
+			const frameRef = (0, react.useCallback)((frame) => {
+				release.current?.();
+				release.current = frame === null ? void 0 : bindFrame(frame);
+			}, [bindFrame]);
+			return (0, react_jsx_runtime.jsxs)("section", {
+				id: panelId,
+				className: page_module_css_default.panel,
+				style: { "--inspector-height": `${height}dvh` },
+				hidden: state !== "visible",
+				"aria-label": t("title"),
+				"data-inspector-panel": true,
+				children: [
+					state === "visible" && (0, react_jsx_runtime.jsx)(InspectorResizeHandle, {
+						height,
+						onResize: setHeight,
+						label: t("resize"),
+						panelId
+					}),
+					(0, react_jsx_runtime.jsxs)("header", {
+						className: page_module_css_default.header,
+						children: [(0, react_jsx_runtime.jsx)("span", { children: t("title") }), (0, react_jsx_runtime.jsx)(_qilin_agent_client_ui_primitives.Tooltip, {
+							label: t("close"),
+							side: "top",
+							portal: true,
+							children: (0, react_jsx_runtime.jsx)(_qilin_agent_client_ui_primitives.Button, {
+								variant: "ghost",
+								size: "sm",
+								className: page_module_css_default.close,
+								"aria-label": t("close"),
+								onClick: close,
+								icon: (0, react_jsx_runtime.jsx)(_qilin_agent_client_ui_primitives.IconCloseOutlineRegular, { size: 14 })
+							})
+						})]
+					}),
+					state !== "unopened" && (0, react_jsx_runtime.jsx)("iframe", {
+						ref: frameRef,
+						className: page_module_css_default.page,
+						src: frontendUrl,
+						title: t("frameTitle"),
+						name: "qilin-nodejs-inspector",
+						referrerPolicy: "no-referrer",
+						"data-inspector-devtools": true
+					})
+				]
+			});
+		}
+		/**
+		* Register bottom content and its window-local toggle command for one Client source.
+		* @param ctx - Inspector context owning the registrations.
+		* @param sourceId - Claimed identity of the embedding page's Client source.
+		*/
+		function registerInspectorPage(ctx, sourceId) {
+			const frontendUrl = `inspector/devtools/devtools_app.html?${new URLSearchParams({
+				disableLocaleInfoBar: "true",
+				clientSourceId: sourceId
+			})}`;
+			ctx.effect(() => ctx.locale.register("inspectorPanel", {
+				zh,
+				en
+			}));
+			const t = ctx.locale.bind("inspectorPanel");
+			ctx.slots.inject("shell.bottom", function* () {
+				const panel = (0, _qilin_agent_client_store.createSnapshotStore)("unopened");
+				let opener;
+				const close = () => {
+					if (panel.getSnapshot() !== "visible") return;
+					panel.set("hidden");
+					if (opener?.isConnected) opener.focus();
+				};
+				yield ctx.shortcuts.register({
+					id: ID,
+					label: () => t("toggle"),
+					aliases: [
+						"inspector",
+						"nodejs",
+						"devtools"
+					],
+					defaults: {
+						"desktop:macos": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						},
+						"desktop:windows": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						},
+						"desktop:linux": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						},
+						"web:macos": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						},
+						"web:windows": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						},
+						"web:linux": {
+							code: "Period",
+							modifiers: ["primary", "shift"]
+						}
+					},
+					regions: [
+						"page",
+						"editable",
+						"terminal"
+					],
+					modals: [],
+					resolve: ({ target }) => ({
+						status: "handled",
+						run: () => {
+							if (panel.getSnapshot() === "visible") close();
+							else {
+								opener = target instanceof HTMLElement ? target : void 0;
+								panel.set("visible");
+							}
+						}
+					})
+				});
+				yield ctx.slots.register({
+					name: "shell.bottom",
+					locale: "inspectorPanel",
+					inject: () => ({
+						frontendUrl,
+						close,
+						hooks: { panel },
+						bindFrame: (frame) => bindInspectorKeyboard(frame, () => ctx.shortcuts.catalog.getSnapshot().find((row) => row.id === ID)?.binding)
+					})
+				}, InspectorPage);
+			});
+		}
+		//#endregion
+		exports.registerInspectorPage = registerInspectorPage;
+		return module.exports;
+	}
+});
+
+//# sourceMappingURL=client.page.js.map

package/lib/devtools/Images/3d-center.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.062 17L3 15.938L5.438 13.5H4V12H8V16H6.5V14.562L4.062 17ZM15.938 17L13.5 14.562V16H12V12H16V13.5H14.562L17 15.938L15.938 17ZM4 8V6.5H5.438L3 4.062L4.062 3L6.5 5.438V4H8V8H4ZM12 8V4H13.5V5.438L15.938 3L17 4.062L14.562 6.5H16V8H12Z" fill="black"/>
+</svg>

package/lib/devtools/Images/3d-pan.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 18L6.5 14.5L7.562 13.438L9.25 15.125V10.75H4.875L6.562 12.438L5.5 13.5L2 10L5.5 6.5L6.562 7.562L4.875 9.25H9.25V4.875L7.562 6.562L6.5 5.5L10 2L13.5 5.5L12.438 6.562L10.75 4.875V9.25H15.125L13.438 7.562L14.5 6.5L18 10L14.5 13.5L13.438 12.438L15.125 10.75H10.75V15.125L12.438 13.438L13.5 14.5L10 18Z" fill="black"/>
+</svg>

package/lib/devtools/Images/3d-rotate.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 16.25L6.938 15.188L8.229 13.896C6.40967 13.7013 4.91667 13.236 3.75 12.5C2.58333 11.764 2 10.9307 2 10C2 8.88867 2.77767 7.94433 4.333 7.167C5.889 6.389 7.778 6 10 6C12.222 6 14.111 6.389 15.667 7.167C17.2223 7.94433 18 8.88867 18 10C18 10.8333 17.545 11.5867 16.635 12.26C15.7257 12.934 14.514 13.4167 13 13.708V12.167C14 11.9303 14.8333 11.6073 15.5 11.198C16.1667 10.788 16.5 10.3887 16.5 10C16.5 9.36133 15.8263 8.785 14.479 8.271C13.1317 7.757 11.6387 7.5 10 7.5C8.37467 7.5 6.885 7.76033 5.531 8.281C4.177 8.80167 3.5 9.37467 3.5 10C3.5 10.472 3.948 10.9443 4.844 11.417C5.74 11.889 6.785 12.2013 7.979 12.354L6.938 11.312L8 10.25L11 13.25L8 16.25Z" fill="black"/>
+</svg>

package/lib/devtools/Images/accelerometer-back.svg

@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   viewBox="0 0 770.00001 1580"
+   version="1.1"
+   width="770"
+   height="1580"
+   id="svg11071">
+  <defs
+     id="defs3775" />
+  <metadata
+     id="metadata11076">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     transform="matrix(-1,0,0,1,770.5,0)"
+     id="layer3">
+    <path
+       style="fill:none;stroke:#ff8800;stroke-width:9"
+       d="M 766,366 V 466"
+       id="path11635" />
+    <path
+       style="fill:none;stroke:#888888;stroke-width:9"
+       d="M 766,768 V 568"
+       id="path11637" />
+    <g
+       style="fill-rule:evenodd"
+       id="g3764">
+      <rect
+         style="fill:#222222"
+         x="0"
+         y="0"
+         width="767"
+         height="1580"
+         ry="80"
+         rx="80"
+         id="rect11633" />
+    </g>
+    <g
+       style="fill:#ffffff;fill-rule:evenodd"
+       id="g3769">
+      <rect
+         style="fill-opacity:0.13332998"
+         x="273.5"
+         y="1526"
+         width="220"
+         height="15"
+         ry="5"
+         rx="5"
+         id="rect11707" />
+      <path
+         style="fill-opacity:0.86667002"
+         d="M 70.36319,6.9493575 C 28.332124,5.755102 4.8083241,47.982906 4.8378685,83.222978 L 6.032124,1507.7128 c 0.025949,30.952 32.037776,68.2787 64.633409,68.2161 l 622.086167,-1.1942 c 30.87325,-0.059 68.21618,-37.2632 68.21618,-64.6334 V 76.057445 c 0,-31.282766 -24.68851,-66.7195765 -63.13681,-70.302343 C 456.89848,4.61017 269.72229,6.9493575 70.36319,6.9493575 Z"
+         id="path11722" />
+    </g>
+  </g>
+</svg>

package/lib/devtools/Images/accelerometer-front.svg

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg id="svg11071" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="1580" width="770" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 770.00001 1580">
+ <metadata id="metadata11076">
+  <rdf:RDF>
+   <cc:Work rdf:about="">
+    <dc:format>image/svg+xml</dc:format>
+    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+    <dc:title/>
+   </cc:Work>
+  </rdf:RDF>
+ </metadata>
+ <g id="layer3">
+  <path id="path11635" d="m766 366v100" stroke="#f80" stroke-width="9" fill="none"/>
+  <path id="path11637" d="m766 768v-200" stroke="#888" stroke-width="9" fill="none"/>
+  <g fill-rule="evenodd">
+   <rect id="rect11633" rx="80" ry="80" height="1580" width="767" y="0" x="0" fill="#222"/>
+   <rect id="rect11061" fill-opacity=".13333" rx="5" ry="5" height="18" width="80" y="80" x="343.5" fill="#fff"/>
+   <circle id="path11063" cx="459" fill-opacity=".26667" cy="76.25" r="15" fill="#00f"/>
+   <circle id="path11069" cx="297.25" fill-opacity=".26667" cy="74" r="17.5" fill="#00f"/>
+  </g>
+  <g fill-rule="evenodd" fill="#fff">
+   <rect id="rect11705" fill-opacity=".13333" rx="10" ry="10" height="25" width="50" y="34" x="358.5"/>
+   <rect id="rect11707" fill-opacity=".13333" rx="5" ry="5" height="15" width="220" y="1526" x="273.5"/>
+   <path id="path11722" d="m83.5 38c-27.7 0-50 22.3-50 50v1360c0 16.62 13.38 30 30 30h640c16.62 0 30-13.38 30-30v-1360c0-27.7-22.3-50-50-50h-90-50c-19.39 0-35 15.61-35 35v4c0 24.93-20.07 45-45 45h-160c-24.93 0-45-20.07-45-45v-4c0-19.39-15.61-35-35-35h-70z" fill-opacity=".86667"/>
+  </g>
+ </g>
+</svg>

package/lib/devtools/Images/account-tree.svg

@@ -0,0 +1,10 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5629_175)">
+<path d="M13 17V14.75H9.25V6.75H7V9H2V3H7V5.25H13V3H18V9H13V6.75H10.75V13.25H13V11H18V17H13ZM3.5 4.5V7.5V4.5ZM14.5 12.5V15.5V12.5ZM14.5 4.5V7.5V4.5ZM14.5 7.5H16.5V4.5H14.5V7.5ZM14.5 15.5H16.5V12.5H14.5V15.5ZM3.5 7.5H5.5V4.5H3.5V7.5Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_5629_175">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/lib/devtools/Images/add-photo.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.5 17C4.0875 17 3.73437 16.8531 3.44062 16.5594C3.14687 16.2656 3 15.9125 3 15.5V4.5C3 4.0875 3.14687 3.73438 3.44062 3.44063C3.73437 3.14688 4.0875 3 4.5 3H11V4.5H4.5V15.5H15.5V9H17V15.5C17 15.9125 16.8531 16.2656 16.5594 16.5594C16.2656 16.8531 15.9125 17 15.5 17H4.5ZM5.5 14H14.5L11.5 10L9.25 13L7.75 11L5.5 14ZM14 7.5V6H12.5V4.5H14V3H15.5V4.5H17V6H15.5V7.5H14Z" fill="black"/>
+</svg>

package/lib/devtools/Images/ai-explorer-badge.svg

@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 600 600">
+  <defs>
+    <style>
+      .cls-1, .cls-2 {
+        fill: none;
+      }
+
+      .cls-2 {
+        stroke: #fff;
+        stroke-width: 16px;
+      }
+
+      .cls-3 {
+        fill: #1a73e8;
+      }
+
+      .cls-4 {
+        fill: #8ab4f8;
+      }
+
+      .cls-5 {
+        fill: #fff;
+      }
+
+      .cls-6 {
+        fill: #ea4335;
+      }
+
+      .cls-7 {
+        fill: url(#Google_AI_Gradient_Blue-2);
+      }
+
+      .cls-8 {
+        fill: #bdc1c6;
+      }
+
+      .cls-9 {
+        fill: #aecbfa;
+      }
+
+      .cls-10 {
+        fill: url(#Google_AI_Gradient_Blue);
+      }
+
+      .cls-11 {
+        clip-path: url(#clippath);
+      }
+
+      .cls-12 {
+        fill: #e8eaed;
+      }
+    </style>
+    <filter id="filter0_d_8437_5135" x="40" y="44" width="520" height="520" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+    <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+    <feMorphology radius="6" operator="dilate" in="SourceAlpha" result="effect1_dropShadow_8437_5135"/>
+    <feOffset dy="4"/>
+    <feGaussianBlur stdDeviation="6"/>
+    <feColorMatrix type="matrix" values="0 0 0 0 0.235294 0 0 0 0 0.25098 0 0 0 0 0.262745 0 0 0 0.15 0"/>
+    <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_8437_5135"/>
+    <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_8437_5135" result="shape"/>
+    </filter>
+    <clipPath id="clippath">
+      <circle class="cls-1" cx="300" cy="300" r="226"/>
+    </clipPath>
+    <linearGradient id="Google_AI_Gradient_Blue" data-name="Google AI Gradient Blue" x1="290.3" y1="245.75" x2="470.47" y2="129.62" gradientUnits="userSpaceOnUse">
+      <stop offset=".37" stop-color="#4285f4"/>
+      <stop offset=".93" stop-color="#2daeb4"/>
+    </linearGradient>
+    <linearGradient id="Google_AI_Gradient_Blue-2" data-name="Google AI Gradient Blue" x1="295.09" y1="253.17" x2="475.25" y2="137.04" xlink:href="#Google_AI_Gradient_Blue"/>
+  </defs>
+  <circle id="baseplate" class="cls-4" cx="300" cy="300" r="242" filter="url(#filter0_d_8437_5135)"/>
+  <circle id="border" class="cls-2" cx="300" cy="300" r="234"/>
+  <g id="illustration">
+    <g class="cls-11">
+      <g>
+        <path class="cls-5" d="M302.85,34.71c-138.53,0-252.22,106.31-263.98,241.79l256.57,148.13c11.11,6.41,30.51,5.61,43.34-1.8l228.9-132.15c-4.76-142.18-121.5-255.98-264.83-255.98Z"/>
+        <path class="cls-12" d="M506.75,166.87l-18.87-10.9s0,0,0,0l-19.93-11.51c-.13-.08-.28-.14-.42-.2l-7.6-4.39c-.11-.08-.22-.17-.36-.25l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-19.93-11.51c-.13-.08-.28-.14-.42-.2l-9.05-5.23c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-4.98,2.88c-.7.41-1.05.88-1.05,1.41s.35,1,1.06,1.41l10.49,6.06s0,0,0,0l17.81,10.28s0,0,0,0l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l10.49,6.06h0s17.81,10.29,17.81,10.29c0,0,0,0,0,0l19.93,11.51c.71.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.01-2.9c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+        <path class="cls-12" d="M350.67,77.35l-18.87-10.9s0,0,0,0l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l18.87,10.89s0,0,0,0l19.93,11.51c.71.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.05-.88,1.05-1.41s-.35-1-1.06-1.41Z"/>
+        <path class="cls-12" d="M345.69,102.03l-9.05-5.23c-.11-.08-.22-.16-.35-.24l-19.93-11.51c-.14-.08-.28-.14-.42-.21l-7.99-4.61s0,0,0,0l-9.05-5.22c-.11-.08-.22-.17-.36-.24l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61-.92,0-1.74.2-2.44.61l-5.02,2.9c-.71.41-1.06.88-1.06,1.41,0,.53.35,1,1.06,1.41l18.87,10.9s0,0,0,0l9.44,5.45s0,0,0,0l9.44,5.45h0s18.87,10.9,18.87,10.9c0,0,0,0,0,0l10.49,6.06c.7.41,1.52.61,2.44.61s1.74-.2,2.44-.61l4.98-2.88c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+        <path class="cls-12" d="M422.14,146.13l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.71.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l19.93,11.51c.7.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.05-.88,1.05-1.41s-.35-1-1.06-1.41Z"/>
+        <g>
+          <path class="cls-12" d="M414.75,218.49l-18.87-10.9s0,0,0,0l-19.93-11.51c-.13-.08-.27-.14-.42-.2l-7.62-4.4c-.11-.08-.22-.16-.35-.24l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-19.93-11.51c-.14-.08-.28-.14-.42-.21l-9.05-5.22c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-4.98,2.88c-.7.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l10.49,6.06s.01,0,.02,0l17.8,10.28s0,0,0,0l19.93,11.51s0,0,0,0l17.81,10.28s0,0,0,0l19.93,11.51s0,0,0,0l9.43,5.45h0s18.87,10.9,18.87,10.9c0,0,0,0,0,0l18.87,10.89c.71.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.06-.88,1.06-1.41s-.35-1-1.06-1.41Z"/>
+          <path class="cls-12" d="M258.67,128.98l-19.93-11.51s0,0,0,0l-18.87-10.89c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l18.87,10.9s0,0,0,0l19.93,11.51c.7.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.06-.88,1.06-1.41s-.35-1-1.06-1.41Z"/>
+          <path class="cls-12" d="M253.68,153.65l-9.06-5.23c-.11-.08-.22-.16-.35-.24l-19.93-11.51c-.13-.08-.27-.14-.42-.2l-9.05-5.23s0,0,0,0l-7.99-4.61c-.11-.08-.22-.16-.35-.24l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41,0,.53.35,1,1.06,1.41l19.93,11.51s0,0,0,0l9.43,5.45s0,0,0,0l8.37,4.83s0,0,0,0l18.87,10.9s0,0,0,0l10.49,6.06c.7.41,1.52.61,2.44.61s1.74-.2,2.44-.61l4.98-2.88c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+          <path class="cls-12" d="M330.13,197.75l-18.87-10.9s0,0,0,0l-18.87-10.9s0,0,0,0l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l19.93,11.51c.7.41,1.52.61,2.44.61.92,0,1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+        </g>
+        <g>
+          <path class="cls-12" d="M384.03,333.26L79.31,157.34c-14.86,23.28-26.18,49.04-33.21,76.52l255.05,147.26c6.06,3.5,16.65,3.06,23.65-.98l57.52-33.21c7-4.04,7.76-10.16,1.7-13.66Z"/>
+          <path class="cls-6" d="M294.46,339.99h11.15s0,6.44,0,6.44h4.33s0-6.44,0-6.44h11.15s0-2.5,0-2.5h-11.15s0-6.44,0-6.44h-4.33s0,6.44,0,6.44h-11.15s0,2.5,0,2.5ZM292.29,347.68c-2.14-1.24-3.75-2.63-4.82-4.19-1.07-1.56-1.61-3.14-1.61-4.75,0-1.61.54-3.19,1.61-4.75,1.07-1.56,2.68-2.95,4.82-4.19,2.14-1.24,4.56-2.16,7.26-2.78,2.7-.62,5.44-.93,8.22-.93,2.79,0,5.53.31,8.22.93,2.7.62,5.12,1.55,7.26,2.78,2.14,1.24,3.75,2.63,4.82,4.19s1.61,3.14,1.61,4.75-.54,3.19-1.61,4.75c-1.07,1.56-2.68,2.95-4.82,4.19s-4.56,2.16-7.26,2.78-5.44.93-8.22.93c-2.79,0-5.53-.31-8.22-.93-2.7-.62-5.12-1.55-7.26-2.78Z"/>
+          <path class="cls-4" d="M278.44,301.35l-19.93-11.51s0,0,0,0l-18.87-10.9c-.13-.08-.28-.14-.42-.2l-7.61-4.39c-.11-.08-.22-.17-.36-.25l-18.87-10.9h0s-18.87-10.9-18.87-10.9c0,0,0,0,0,0l-18.87-10.9h0s-19.93-11.51-19.93-11.51c-.13-.08-.27-.14-.42-.2l-9.05-5.23c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-4.98,2.88c-.71.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l9.43,5.44s0,0,0,0l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l18.87,10.9s0,0,0,0l9.43,5.44s0,0,0,0l19.93,11.51s0,0,0,0l18.87,10.9c.71.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.01-2.9c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+          <path class="cls-8" d="M122.37,211.84l-19.93-11.51s0,0,0,0l-18.87-10.89c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41,0,.53.35,1,1.06,1.41l19.93,11.51s0,0,0,0l18.87,10.9c.7.41,1.52.61,2.44.61.92,0,1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.06-.88,1.05-1.41,0-.53-.35-1-1.05-1.41Z"/>
+          <path class="cls-8" d="M117.38,236.52l-9.06-5.23c-.11-.08-.22-.16-.35-.24l-19.93-11.51c-.13-.08-.28-.14-.42-.2l-9.05-5.23s0,0,0,0l-8-4.62c-.11-.08-.22-.16-.35-.24l-19.93-11.51c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41s.35,1,1.06,1.41l18.87,10.9s0,0,0,0l10.49,6.06s0,0,0,0l9.43,5.45s0,0,0,0l18.86,10.89s0,0,0,0l9.43,5.45c.7.41,1.52.61,2.44.61.92,0,1.74-.2,2.44-.61l4.98-2.88c.7-.41,1.06-.88,1.06-1.41,0-.53-.35-1-1.06-1.41Z"/>
+          <path class="cls-8" d="M193.83,280.62l-18.87-10.9h0s-19.93-11.51-19.93-11.51c0,0,0,0,0,0l-18.87-10.89c-.7-.41-1.52-.61-2.44-.61s-1.74.2-2.44.61l-5.02,2.9c-.7.41-1.06.88-1.06,1.41,0,.53.35,1,1.06,1.41l19.93,11.51s0,0,0,0l17.81,10.28s0,0,0,0l19.93,11.51c.7.41,1.52.61,2.44.61s1.74-.2,2.44-.61l5.02-2.9c.7-.41,1.06-.88,1.06-1.41s-.35-1-1.06-1.41Z"/>
+        </g>
+      </g>
+    </g>
+    <g>
+      <path class="cls-3" d="M135.54,455c41.21,43.71,99.64,71,164.46,71s123.25-27.29,164.46-71H135.54Z"/>
+      <path class="cls-5" d="M288.7,489.5c0,2.69.96,5,2.88,6.92,1.92,1.92,4.23,2.88,6.92,2.88s5-.96,6.92-2.88,2.88-4.23,2.88-6.92-.96-5-2.88-6.92-4.23-2.88-6.92-2.88-5,.96-6.92,2.88c-1.92,1.92-2.88,4.23-2.88,6.92ZM298.5,504.2c.53,0,1.04-.02,1.53-.06s.98-.12,1.47-.24l-5.76,9.92c-6.17-.69-11.33-3.34-15.5-7.93s-6.25-10.06-6.25-16.38c0-1.72.16-3.38.49-4.99s.82-3.15,1.47-4.62l9.8,16.97c1.27,2.21,3.02,3.98,5.27,5.33,2.25,1.35,4.74,2.02,7.47,2.02ZM298.5,474.8c-3.27,0-6.17.95-8.7,2.85-2.53,1.9-4.29,4.32-5.27,7.26l-5.76-9.92c2.25-3.02,5.07-5.44,8.48-7.26,3.41-1.82,7.16-2.73,11.24-2.73s7.76.89,11.15,2.66,6.21,4.15,8.45,7.14h-19.6ZM320.92,479.7c.69,1.51,1.21,3.08,1.56,4.72s.52,3.33.52,5.08c0,6.33-2.07,11.78-6.22,16.35-4.14,4.57-9.26,7.23-15.34,7.96l9.8-16.97c.61-1.06,1.09-2.22,1.44-3.46s.52-2.54.52-3.89c0-1.92-.34-3.71-1.01-5.36s-1.6-3.13-2.79-4.44h11.51Z"/>
+    </g>
+    <g>
+      <path class="cls-9" d="M377.18,87.59l-70.03-40.43c-5.5-3.18-10.22-3.64-14.15-1.4l-17.62,10.24c3.93-2.24,8.64-1.78,14.15,1.4l70.03,40.43-.07,22.99,17.62-10.24.07-22.99h0s0,0,0,0Z"/>
+      <path class="cls-10" d="M429.07,322.2l.2-68.97,20.01,11.55-.2,68.97c-.02,6.32-1.99,10.61-5.93,12.84-3.93,2.25-8.64,1.78-14.15-1.4l-40.02-23.11-30.11,17.16-29.92-51.82-40.02-23.11c-5.5-3.18-10.2-8.15-14.11-14.91-3.91-6.76-5.85-13.31-5.83-19.63l.46-160.94c.02-6.32,1.99-10.6,5.93-12.84,3.93-2.24,8.64-1.78,14.15,1.4l70.03,40.43-.07,22.99-70.03-40.43-.46,160.94,140.06,80.86Z"/>
+      <path class="cls-9" d="M466.89,254.54l-20.01-11.55-17.62,10.24,20.01,11.55h0l-.2,68.97c-.02,6.32-1.99,10.61-5.93,12.84l17.62-10.24c3.93-2.23,5.91-6.52,5.93-12.84l.2-68.97h0,0Z"/>
+      <path class="cls-7" d="M503.16,195.26c.5.29,1.24,1.86,2.24,4.74,0,.29-.76,1-2.26,2.14-15.24-4.2-28.44-3.12-39.58,3.23-11.15,6.35-18.74,17.13-22.79,32.32,0,.57-1,.86-3,.85-.25-.14-1.24-1.58-2.99-4.31-3.95-19.8-11.46-39.3-22.53-58.48-11.07-19.18-24.21-35.46-39.43-48.85-.5-.57-1.24-2.15-2.24-4.74,0-.57.76-1.28,2.26-2.14,15.25,4.2,28.44,3.12,39.58-3.23,11.15-6.35,18.74-17.12,22.79-32.32.25-.43,1.25-.71,3-.85.5.29,1.5,1.72,2.99,4.3,4.2,19.96,11.77,39.48,22.72,58.59,10.95,19.11,24.03,35.36,39.25,48.74Z"/>
+      <path class="cls-9" d="M520.78,185.02c-15.21-13.38-28.3-29.63-39.25-48.74-10.95-19.11-18.52-38.63-22.72-58.59-1.49-2.58-2.49-4.02-2.99-4.3-1.33.1-2.22.29-2.69.56l-17.62,10.24c.47-.27,1.36-.46,2.69-.56.5.29,1.5,1.72,2.99,4.3,4.2,19.96,11.77,39.48,22.72,58.59,10.95,19.11,24.03,35.36,39.25,48.74.5.29,1.24,1.86,2.24,4.74,0,.29-.76,1-2.26,2.14l17.62-10.24c1.5-1.14,2.26-1.86,2.26-2.14-1-2.87-1.74-4.45-2.24-4.74Z"/>
+      <polygon class="cls-9" points="429.12 301.82 306.63 231.09 307.02 90.53 289.46 80.39 289.01 241.33 429.07 322.2 429.12 301.82"/>
+      <path class="cls-9" d="M412.41,116.79c3.11-1.77,5.93-3.9,8.49-6.36-9.03,2.66-19.18,2.45-30.45-.66l-17.62,10.24c15.25,4.2,28.44,3.12,39.58-3.23Z"/>
+      <path class="cls-9" d="M463.55,205.37c-11.15,6.35-18.74,17.13-22.79,32.32l17.62-10.24c2.92-10.95,7.69-19.6,14.3-25.96-3.18.94-6.23,2.23-9.14,3.88Z"/>
+    </g>
+  </g>
+</svg>

package/lib/devtools/Images/align-content-center.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 10.75H2V9.25H18V10.75Z" fill="black"/>
+<path d="M6 4H14V7H6V4Z" fill="black"/>
+<path d="M6 13H14V16H6V13Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-end.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 18H2V16.5H18V18Z" fill="black"/>
+<path d="M6 6H14V9H6V6Z" fill="black"/>
+<path d="M6 11H14V14H6V11Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-space-around.svg

@@ -0,0 +1,6 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 18H2V16.5H18V18Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 3.5H2V2H18V3.5Z" fill="black"/>
+<path d="M6 5H14V8H6V5Z" fill="black"/>
+<path d="M6 12H14V15H6V12Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-space-between.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14 3.5H18V2H2V3.5H6V6.5H14V3.5Z" fill="black"/>
+<path d="M2 18H18V16.5H14V13.5H6V16.5H2V18Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-space-evenly.svg

@@ -0,0 +1,6 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 18H2V16.5H18V18Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 3.5H2V2H18V3.5Z" fill="black"/>
+<path d="M6 6H14V9H6V6Z" fill="black"/>
+<path d="M6 11H14V14H6V11Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-start.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 3.5H2V2H18V3.5Z" fill="black"/>
+<path d="M6 6H14V9H6V6Z" fill="black"/>
+<path d="M6 11H14V14H6V11Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-content-stretch.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 3.5H6V9H14V3.5H18V2H2V3.5Z" fill="black"/>
+<path d="M2 18H18V16.5H14V11H6V16.5H2V18Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-items-baseline.svg

@@ -0,0 +1,4 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.104 4L5.354 14H7.083L8 11.438H12.042L12.916 14H14.646L10.896 4H9.104ZM11.5 10H8.521L9.958 5.854H10.042L11.5 10Z" fill="black"/>
+<path d="M18 16.5H2V18H18V16.5Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-items-center.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18 10.75H2V9.25H18V10.75Z" fill="black"/>
+<path d="M9 3L9 17H6L6 3L9 3Z" fill="black"/>
+<path d="M15 6V14H12V6L15 6Z" fill="black"/>
+</svg>

package/lib/devtools/Images/align-items-end.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 16.5H18V18H2V16.5Z" fill="black"/>
+<path d="M6 15L6 4H9V15H6Z" fill="black"/>
+<path d="M11 8V15H14V8H11Z" fill="black"/>
+</svg>