@midscene/visualizer 0.30.10 → 1.0.0

package/dist/lib/component/index.js

@@ -1,6 +1,6 @@
 "use strict";
 var __webpack_modules__ = {
-    "../types": function(module) {
+    "../types" (module) {
         module.exports = require("../types.js");
     }
 };
@@ -47,14 +47,12 @@ function __webpack_require__(moduleId) {
 var __webpack_exports__ = {};
 (()=>{
     __webpack_require__.r(__webpack_exports__);
-    var _types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("../types");
-    var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _types__WEBPACK_IMPORTED_MODULE_0__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _types__WEBPACK_IMPORTED_MODULE_0__[key];
-    }).bind(0, __WEBPACK_IMPORT_KEY__);
-    __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+    var _types__rspack_import_0 = __webpack_require__("../types");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _types__rspack_import_0)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_types__rspack_import_0[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
 })();
-for(var __webpack_i__ in __webpack_exports__)exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true
 });

package/dist/lib/component/logo/index.js

@@ -28,11 +28,15 @@ __webpack_require__.d(__webpack_exports__, {
     LogoUrl: ()=>LogoUrl
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const useTheme_js_namespaceObject = require("../../hooks/useTheme.js");
 require("./index.css");
 const LogoUrl = 'https://lf3-static.bytednsdoc.com/obj/eden-cn/vhaeh7vhabf/Midscene.png';
-const Logo = (param)=>{
-    let { hideLogo = false } = param;
+const LogoUrlLight = 'https://lf3-static.bytednsdoc.com/obj/eden-cn/nupipfups/Midscene/midscene_with_text_light.png';
+const LogoUrlDark = 'https://lf3-static.bytednsdoc.com/obj/eden-cn/nupipfups/Midscene/midscene_with_text_dark.png';
+const Logo = ({ hideLogo = false })=>{
+    const { isDarkMode } = (0, useTheme_js_namespaceObject.useTheme)();
     if (hideLogo) return null;
+    const logoSrc = isDarkMode ? LogoUrlDark : LogoUrlLight;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         className: "logo",
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("a", {
@@ -41,17 +45,17 @@ const Logo = (param)=>{
             rel: "noreferrer",
             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("img", {
                 alt: "Midscene_logo",
-                src: "https://lf3-static.bytednsdoc.com/obj/eden-cn/vhaeh7vhabf/Midscene.png"
+                src: logoSrc
             })
         })
     });
 };
 exports.Logo = __webpack_exports__.Logo;
 exports.LogoUrl = __webpack_exports__.LogoUrl;
-for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+for(var __rspack_i in __webpack_exports__)if (-1 === [
     "Logo",
     "LogoUrl"
-].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true
 });

package/dist/lib/component/misc/index.js

@@ -33,11 +33,11 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
-    serverLaunchTip: ()=>serverLaunchTip,
-    errorMessageServerNotReady: ()=>errorMessageServerNotReady,
     timeCostStrElement: ()=>timeCostStrElement,
+    errorMessageServerNotReady: ()=>errorMessageServerNotReady,
     iconForStatus: ()=>iconForStatus,
-    emptyResultTip: ()=>emptyResultTip
+    emptyResultTip: ()=>emptyResultTip,
+    serverLaunchTip: ()=>serverLaunchTip
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const icons_namespaceObject = require("@ant-design/icons");
@@ -112,9 +112,7 @@ const errorMessageServerNotReady = /*#__PURE__*/ (0, jsx_runtime_namespaceObject
         })
     ]
 });
-const serverLaunchTip = function() {
-    let notReadyMessage = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : errorMessageServerNotReady;
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+const serverLaunchTip = (notReadyMessage = errorMessageServerNotReady)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         className: "server-tip",
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Alert, {
             message: "Playground Server Not Ready",
@@ -122,7 +120,6 @@ const serverLaunchTip = function() {
             type: "warning"
         })
     });
-};
 const emptyResultTip = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
     className: "result-empty-tip",
     style: {
@@ -138,13 +135,13 @@ exports.errorMessageServerNotReady = __webpack_exports__.errorMessageServerNotRe
 exports.iconForStatus = __webpack_exports__.iconForStatus;
 exports.serverLaunchTip = __webpack_exports__.serverLaunchTip;
 exports.timeCostStrElement = __webpack_exports__.timeCostStrElement;
-for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+for(var __rspack_i in __webpack_exports__)if (-1 === [
     "emptyResultTip",
     "errorMessageServerNotReady",
     "iconForStatus",
     "serverLaunchTip",
     "timeCostStrElement"
-].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true
 });

package/dist/lib/component/nav-actions/index.js

@@ -31,8 +31,7 @@ const icons_namespaceObject = require("@ant-design/icons");
 const external_antd_namespaceObject = require("antd");
 const index_js_namespaceObject = require("../env-config/index.js");
 require("./style.css");
-function NavActions(param) {
-    let { showEnvConfig = true, showTooltipWhenEmpty = false, showModelName = false, githubUrl = 'https://github.com/web-infra-dev/midscene', helpUrl = 'https://midscenejs.com/quick-experience.html', className = '' } = param;
+function NavActions({ showEnvConfig = true, showTooltipWhenEmpty = false, showModelName = false, githubUrl = 'https://github.com/web-infra-dev/midscene', helpUrl = 'https://midscenejs.com/quick-experience.html', className = '' }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         className: `nav-actions ${className}`,
         children: [
@@ -58,9 +57,9 @@ function NavActions(param) {
     });
 }
 exports.NavActions = __webpack_exports__.NavActions;
-for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+for(var __rspack_i in __webpack_exports__)if (-1 === [
     "NavActions"
-].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true
 });

package/dist/lib/component/nav-actions/style.css

@@ -26,7 +26,7 @@
 }
 
 [data-theme="dark"] .nav-actions .nav-icon {
-  color: rgba(255, 255, 255, .65);
+  color: #f8fafd;
 }
 
 [data-theme="dark"] .nav-actions .nav-icon:hover {

package/dist/lib/component/player/index.css

@@ -183,3 +183,29 @@
   display: flex;
 }
 
+[data-theme="dark"] .player-container {
+  background: #141414;
+  border-color: #292929;
+}
+
+[data-theme="dark"] .player-container[data-fit-mode="height"] {
+  background: #292929;
+  border-color: #292929;
+}
+
+[data-theme="dark"] .player-container[data-fit-mode="height"] .canvas-container {
+  background-color: #141414;
+}
+
+[data-theme="dark"] .player-container .canvas-container {
+  background-color: #1f1f1f;
+}
+
+[data-theme="dark"] .player-container .player-tools, [data-theme="dark"] .player-container .player-tools .ant-spin, [data-theme="dark"] .player-container .player-tools .status-icon svg {
+  color: #f8fafd;
+}
+
+[data-theme="dark"] .player-container .player-tools .status-icon:hover {
+  background: rgba(255, 255, 255, .08);
+}
+