@midscene/visualizer 1.0.1 → 1.0.2
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/dist/es/component/playground/index.css +1 -36
- package/dist/es/component/prompt-input/index.css +1 -36
- package/dist/es/component/prompt-input/index.mjs +6 -48
- package/dist/es/hooks/usePlaygroundExecution.mjs +1 -3
- package/dist/es/store/store.mjs +0 -9
- package/dist/lib/component/playground/index.css +1 -36
- package/dist/lib/component/prompt-input/index.css +1 -36
- package/dist/lib/component/prompt-input/index.js +5 -47
- package/dist/lib/hooks/usePlaygroundExecution.js +1 -3
- package/dist/lib/store/store.js +0 -9
- package/dist/types/store/store.d.ts +0 -3
- package/dist/types/types.d.ts +0 -1
- package/package.json +5 -5
|
@@ -196,7 +196,7 @@
|
|
|
196
196
|
border: 1px solid rgba(0, 0, 0, 0);
|
|
197
197
|
border-radius: 12px;
|
|
198
198
|
margin-top: 10px;
|
|
199
|
-
padding-bottom:
|
|
199
|
+
padding-bottom: 48px;
|
|
200
200
|
position: relative;
|
|
201
201
|
}
|
|
202
202
|
|
|
@@ -325,28 +325,6 @@
|
|
|
325
325
|
pointer-events: auto;
|
|
326
326
|
}
|
|
327
327
|
|
|
328
|
-
.prompt-input-wrapper .form-controller-wrapper.with-strategy {
|
|
329
|
-
justify-content: space-between;
|
|
330
|
-
}
|
|
331
|
-
|
|
332
|
-
.prompt-input-wrapper .planning-strategy-selector {
|
|
333
|
-
color: #2b83ff;
|
|
334
|
-
cursor: pointer;
|
|
335
|
-
align-items: center;
|
|
336
|
-
font-size: 13px;
|
|
337
|
-
transition: opacity .2s;
|
|
338
|
-
display: inline-flex;
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
.prompt-input-wrapper .planning-strategy-selector:hover {
|
|
342
|
-
opacity: .8;
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
.prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
346
|
-
color: #2b83ff !important;
|
|
347
|
-
background-color: #e6f4ff !important;
|
|
348
|
-
}
|
|
349
|
-
|
|
350
328
|
.prompt-input-wrapper .settings-wrapper {
|
|
351
329
|
color: #777;
|
|
352
330
|
flex-flow: wrap;
|
|
@@ -595,19 +573,6 @@
|
|
|
595
573
|
background-color: rgba(0, 0, 0, 0) !important;
|
|
596
574
|
}
|
|
597
575
|
|
|
598
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector {
|
|
599
|
-
color: #2b83ff !important;
|
|
600
|
-
}
|
|
601
|
-
|
|
602
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector:hover {
|
|
603
|
-
opacity: .8;
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
[data-theme="dark"] .prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
607
|
-
color: #2b83ff !important;
|
|
608
|
-
background-color: rgba(43, 131, 255, .15) !important;
|
|
609
|
-
}
|
|
610
|
-
|
|
611
576
|
[data-theme="dark"] .prompt-input-wrapper .structured-params-container {
|
|
612
577
|
background: linear-gradient(#1f1f1f, #1f1f1f) padding-box padding-box, linear-gradient(135deg, #4285f4 0%, #06f 25%, #7b02c5 50%, #ea4335 75%, #ff7043 100%) border-box !important;
|
|
613
578
|
}
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
border: 1px solid rgba(0, 0, 0, 0);
|
|
153
153
|
border-radius: 12px;
|
|
154
154
|
margin-top: 10px;
|
|
155
|
-
padding-bottom:
|
|
155
|
+
padding-bottom: 48px;
|
|
156
156
|
position: relative;
|
|
157
157
|
}
|
|
158
158
|
|
|
@@ -281,28 +281,6 @@
|
|
|
281
281
|
pointer-events: auto;
|
|
282
282
|
}
|
|
283
283
|
|
|
284
|
-
.prompt-input-wrapper .form-controller-wrapper.with-strategy {
|
|
285
|
-
justify-content: space-between;
|
|
286
|
-
}
|
|
287
|
-
|
|
288
|
-
.prompt-input-wrapper .planning-strategy-selector {
|
|
289
|
-
color: #2b83ff;
|
|
290
|
-
cursor: pointer;
|
|
291
|
-
align-items: center;
|
|
292
|
-
font-size: 13px;
|
|
293
|
-
transition: opacity .2s;
|
|
294
|
-
display: inline-flex;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
|
-
.prompt-input-wrapper .planning-strategy-selector:hover {
|
|
298
|
-
opacity: .8;
|
|
299
|
-
}
|
|
300
|
-
|
|
301
|
-
.prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
302
|
-
color: #2b83ff !important;
|
|
303
|
-
background-color: #e6f4ff !important;
|
|
304
|
-
}
|
|
305
|
-
|
|
306
284
|
.prompt-input-wrapper .settings-wrapper {
|
|
307
285
|
color: #777;
|
|
308
286
|
flex-flow: wrap;
|
|
@@ -551,19 +529,6 @@
|
|
|
551
529
|
background-color: rgba(0, 0, 0, 0) !important;
|
|
552
530
|
}
|
|
553
531
|
|
|
554
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector {
|
|
555
|
-
color: #2b83ff !important;
|
|
556
|
-
}
|
|
557
|
-
|
|
558
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector:hover {
|
|
559
|
-
opacity: .8;
|
|
560
|
-
}
|
|
561
|
-
|
|
562
|
-
[data-theme="dark"] .prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
563
|
-
color: #2b83ff !important;
|
|
564
|
-
background-color: rgba(43, 131, 255, .15) !important;
|
|
565
|
-
}
|
|
566
|
-
|
|
567
532
|
[data-theme="dark"] .prompt-input-wrapper .structured-params-container {
|
|
568
533
|
background: linear-gradient(#1f1f1f, #1f1f1f) padding-box padding-box, linear-gradient(135deg, #4285f4 0%, #06f 25%, #7b02c5 50%, #ea4335 75%, #ff7043 100%) border-box !important;
|
|
569
534
|
}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { BorderOutlined, DownOutlined, SendOutlined } from "@ant-design/icons";
|
|
3
3
|
import "./index.css";
|
|
4
|
-
import { Button, Dropdown, Form, Input, Radio,
|
|
4
|
+
import { Button, Dropdown, Form, Input, Radio, Tooltip } from "antd";
|
|
5
5
|
import react, { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
6
6
|
import { useHistoryStore } from "../../store/history.mjs";
|
|
7
|
-
import { useEnvConfig } from "../../store/store.mjs";
|
|
8
7
|
import { extractDefaultValue, isLocateField, isZodObjectSchema, unwrapZodType } from "../../types.mjs";
|
|
9
8
|
import { apiMetadata, defaultMainButtons } from "../../utils/constants.mjs";
|
|
10
9
|
import { actionNameForType, getPlaceholderForType, isRunButtonEnabled as playground_utils_mjs_isRunButtonEnabled } from "../../utils/playground-utils.mjs";
|
|
@@ -47,8 +46,6 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
47
46
|
const lastSelectedType = useHistoryStore((state)=>state.lastSelectedType);
|
|
48
47
|
const addHistory = useHistoryStore((state)=>state.addHistory);
|
|
49
48
|
const setLastSelectedType = useHistoryStore((state)=>state.setLastSelectedType);
|
|
50
|
-
const planningStrategy = useEnvConfig((state)=>state.planningStrategy);
|
|
51
|
-
const setPlanningStrategy = useEnvConfig((state)=>state.setPlanningStrategy);
|
|
52
49
|
const historyForSelectedType = useMemo(()=>history[selectedType] || [], [
|
|
53
50
|
history,
|
|
54
51
|
selectedType
|
|
@@ -413,7 +410,7 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
413
410
|
},
|
|
414
411
|
children: /*#__PURE__*/ jsx(Input.TextArea, {
|
|
415
412
|
className: "main-side-console-input-textarea",
|
|
416
|
-
rows:
|
|
413
|
+
rows: 3,
|
|
417
414
|
placeholder: placeholderText,
|
|
418
415
|
autoFocus: true,
|
|
419
416
|
onKeyDown: handleStructuredKeyDown
|
|
@@ -717,7 +714,7 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
717
714
|
children: /*#__PURE__*/ jsx(TextArea, {
|
|
718
715
|
className: "main-side-console-input-textarea",
|
|
719
716
|
disabled: !runButtonEnabled,
|
|
720
|
-
rows:
|
|
717
|
+
rows: 3,
|
|
721
718
|
placeholder: placeholder,
|
|
722
719
|
autoFocus: true,
|
|
723
720
|
onKeyDown: handleKeyDown,
|
|
@@ -737,48 +734,9 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
737
734
|
actionNameForType(selectedType)
|
|
738
735
|
]
|
|
739
736
|
}),
|
|
740
|
-
/*#__PURE__*/
|
|
741
|
-
className:
|
|
742
|
-
children:
|
|
743
|
-
'aiAct' === selectedType && /*#__PURE__*/ jsx(Dropdown, {
|
|
744
|
-
menu: {
|
|
745
|
-
items: [
|
|
746
|
-
{
|
|
747
|
-
key: 'standard',
|
|
748
|
-
label: 'Standard',
|
|
749
|
-
onClick: ()=>setPlanningStrategy('standard')
|
|
750
|
-
},
|
|
751
|
-
{
|
|
752
|
-
key: 'fast',
|
|
753
|
-
label: 'Fast',
|
|
754
|
-
onClick: ()=>setPlanningStrategy('fast')
|
|
755
|
-
}
|
|
756
|
-
],
|
|
757
|
-
selectedKeys: [
|
|
758
|
-
planningStrategy
|
|
759
|
-
]
|
|
760
|
-
},
|
|
761
|
-
trigger: [
|
|
762
|
-
'click'
|
|
763
|
-
],
|
|
764
|
-
children: /*#__PURE__*/ jsx("a", {
|
|
765
|
-
onClick: (e)=>e.preventDefault(),
|
|
766
|
-
className: "planning-strategy-selector",
|
|
767
|
-
children: /*#__PURE__*/ jsxs(Space, {
|
|
768
|
-
size: 4,
|
|
769
|
-
children: [
|
|
770
|
-
'fast' === planningStrategy ? 'Fast' : 'Standard',
|
|
771
|
-
/*#__PURE__*/ jsx(DownOutlined, {
|
|
772
|
-
style: {
|
|
773
|
-
fontSize: 10
|
|
774
|
-
}
|
|
775
|
-
})
|
|
776
|
-
]
|
|
777
|
-
})
|
|
778
|
-
})
|
|
779
|
-
}),
|
|
780
|
-
renderActionButton()
|
|
781
|
-
]
|
|
737
|
+
/*#__PURE__*/ jsx("div", {
|
|
738
|
+
className: "form-controller-wrapper",
|
|
739
|
+
children: renderActionButton()
|
|
782
740
|
})
|
|
783
741
|
]
|
|
784
742
|
})
|
|
@@ -98,7 +98,7 @@ function wrapExecutionDumpForReplay(dump) {
|
|
|
98
98
|
};
|
|
99
99
|
}
|
|
100
100
|
function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, setLoading, setInfoList, replayCounter, setReplayCounter, verticalMode, currentRunningIdRef, interruptedFlagRef) {
|
|
101
|
-
const { deepThink, screenshotIncluded, domIncluded
|
|
101
|
+
const { deepThink, screenshotIncluded, domIncluded } = useEnvConfig();
|
|
102
102
|
const handleRun = useCallback((value)=>_async_to_generator(function*() {
|
|
103
103
|
if (!playgroundSDK) return void console.warn('PlaygroundSDK is not available');
|
|
104
104
|
const thisRunningId = Date.now();
|
|
@@ -161,7 +161,6 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
|
|
|
161
161
|
result.result = yield playgroundSDK.executeAction(actionType, value, {
|
|
162
162
|
requestId: thisRunningId.toString(),
|
|
163
163
|
deepThink,
|
|
164
|
-
planningStrategy,
|
|
165
164
|
screenshotIncluded,
|
|
166
165
|
domIncluded
|
|
167
166
|
});
|
|
@@ -243,7 +242,6 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
|
|
|
243
242
|
currentRunningIdRef,
|
|
244
243
|
interruptedFlagRef,
|
|
245
244
|
deepThink,
|
|
246
|
-
planningStrategy,
|
|
247
245
|
screenshotIncluded,
|
|
248
246
|
domIncluded
|
|
249
247
|
]);
|
package/dist/es/store/store.mjs
CHANGED
|
@@ -108,7 +108,6 @@ const TRACKING_ACTIVE_TAB_KEY = 'midscene-tracking-active-tab';
|
|
|
108
108
|
const DEEP_THINK_KEY = 'midscene-deep-think';
|
|
109
109
|
const SCREENSHOT_INCLUDED_KEY = 'midscene-screenshot-included';
|
|
110
110
|
const DOM_INCLUDED_KEY = 'midscene-dom-included';
|
|
111
|
-
const PLANNING_STRATEGY_KEY = 'midscene-planning-strategy';
|
|
112
111
|
const IME_STRATEGY_KEY = 'midscene-ime-strategy';
|
|
113
112
|
const AUTO_DISMISS_KEYBOARD_KEY = 'midscene-auto-dismiss-keyboard';
|
|
114
113
|
const KEYBOARD_DISMISS_STRATEGY_KEY = 'midscene-keyboard-dismiss-strategy';
|
|
@@ -147,7 +146,6 @@ const useEnvConfig = store_create((set, get)=>{
|
|
|
147
146
|
const savedAutoDismissKeyboard = 'false' !== localStorage.getItem(AUTO_DISMISS_KEYBOARD_KEY);
|
|
148
147
|
const savedKeyboardDismissStrategy = localStorage.getItem(KEYBOARD_DISMISS_STRATEGY_KEY) || 'esc-first';
|
|
149
148
|
const savedAlwaysRefreshScreenInfo = 'true' === localStorage.getItem(ALWAYS_REFRESH_SCREEN_INFO_KEY);
|
|
150
|
-
const savedPlanningStrategy = localStorage.getItem(PLANNING_STRATEGY_KEY) || 'standard';
|
|
151
149
|
return {
|
|
152
150
|
serviceMode: ifInExtension ? 'In-Browser-Extension' : savedServiceMode || 'Server',
|
|
153
151
|
setServiceMode: (serviceMode)=>{
|
|
@@ -206,13 +204,6 @@ const useEnvConfig = store_create((set, get)=>{
|
|
|
206
204
|
});
|
|
207
205
|
localStorage.setItem(DOM_INCLUDED_KEY, domIncluded.toString());
|
|
208
206
|
},
|
|
209
|
-
planningStrategy: savedPlanningStrategy,
|
|
210
|
-
setPlanningStrategy: (planningStrategy)=>{
|
|
211
|
-
set({
|
|
212
|
-
planningStrategy
|
|
213
|
-
});
|
|
214
|
-
localStorage.setItem(PLANNING_STRATEGY_KEY, planningStrategy);
|
|
215
|
-
},
|
|
216
207
|
popupTab: 'playground',
|
|
217
208
|
setPopupTab: (tab)=>{
|
|
218
209
|
set({
|
|
@@ -196,7 +196,7 @@
|
|
|
196
196
|
border: 1px solid rgba(0, 0, 0, 0);
|
|
197
197
|
border-radius: 12px;
|
|
198
198
|
margin-top: 10px;
|
|
199
|
-
padding-bottom:
|
|
199
|
+
padding-bottom: 48px;
|
|
200
200
|
position: relative;
|
|
201
201
|
}
|
|
202
202
|
|
|
@@ -325,28 +325,6 @@
|
|
|
325
325
|
pointer-events: auto;
|
|
326
326
|
}
|
|
327
327
|
|
|
328
|
-
.prompt-input-wrapper .form-controller-wrapper.with-strategy {
|
|
329
|
-
justify-content: space-between;
|
|
330
|
-
}
|
|
331
|
-
|
|
332
|
-
.prompt-input-wrapper .planning-strategy-selector {
|
|
333
|
-
color: #2b83ff;
|
|
334
|
-
cursor: pointer;
|
|
335
|
-
align-items: center;
|
|
336
|
-
font-size: 13px;
|
|
337
|
-
transition: opacity .2s;
|
|
338
|
-
display: inline-flex;
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
.prompt-input-wrapper .planning-strategy-selector:hover {
|
|
342
|
-
opacity: .8;
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
.prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
346
|
-
color: #2b83ff !important;
|
|
347
|
-
background-color: #e6f4ff !important;
|
|
348
|
-
}
|
|
349
|
-
|
|
350
328
|
.prompt-input-wrapper .settings-wrapper {
|
|
351
329
|
color: #777;
|
|
352
330
|
flex-flow: wrap;
|
|
@@ -595,19 +573,6 @@
|
|
|
595
573
|
background-color: rgba(0, 0, 0, 0) !important;
|
|
596
574
|
}
|
|
597
575
|
|
|
598
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector {
|
|
599
|
-
color: #2b83ff !important;
|
|
600
|
-
}
|
|
601
|
-
|
|
602
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector:hover {
|
|
603
|
-
opacity: .8;
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
[data-theme="dark"] .prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
607
|
-
color: #2b83ff !important;
|
|
608
|
-
background-color: rgba(43, 131, 255, .15) !important;
|
|
609
|
-
}
|
|
610
|
-
|
|
611
576
|
[data-theme="dark"] .prompt-input-wrapper .structured-params-container {
|
|
612
577
|
background: linear-gradient(#1f1f1f, #1f1f1f) padding-box padding-box, linear-gradient(135deg, #4285f4 0%, #06f 25%, #7b02c5 50%, #ea4335 75%, #ff7043 100%) border-box !important;
|
|
613
578
|
}
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
border: 1px solid rgba(0, 0, 0, 0);
|
|
153
153
|
border-radius: 12px;
|
|
154
154
|
margin-top: 10px;
|
|
155
|
-
padding-bottom:
|
|
155
|
+
padding-bottom: 48px;
|
|
156
156
|
position: relative;
|
|
157
157
|
}
|
|
158
158
|
|
|
@@ -281,28 +281,6 @@
|
|
|
281
281
|
pointer-events: auto;
|
|
282
282
|
}
|
|
283
283
|
|
|
284
|
-
.prompt-input-wrapper .form-controller-wrapper.with-strategy {
|
|
285
|
-
justify-content: space-between;
|
|
286
|
-
}
|
|
287
|
-
|
|
288
|
-
.prompt-input-wrapper .planning-strategy-selector {
|
|
289
|
-
color: #2b83ff;
|
|
290
|
-
cursor: pointer;
|
|
291
|
-
align-items: center;
|
|
292
|
-
font-size: 13px;
|
|
293
|
-
transition: opacity .2s;
|
|
294
|
-
display: inline-flex;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
|
-
.prompt-input-wrapper .planning-strategy-selector:hover {
|
|
298
|
-
opacity: .8;
|
|
299
|
-
}
|
|
300
|
-
|
|
301
|
-
.prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
302
|
-
color: #2b83ff !important;
|
|
303
|
-
background-color: #e6f4ff !important;
|
|
304
|
-
}
|
|
305
|
-
|
|
306
284
|
.prompt-input-wrapper .settings-wrapper {
|
|
307
285
|
color: #777;
|
|
308
286
|
flex-flow: wrap;
|
|
@@ -551,19 +529,6 @@
|
|
|
551
529
|
background-color: rgba(0, 0, 0, 0) !important;
|
|
552
530
|
}
|
|
553
531
|
|
|
554
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector {
|
|
555
|
-
color: #2b83ff !important;
|
|
556
|
-
}
|
|
557
|
-
|
|
558
|
-
[data-theme="dark"] .prompt-input-wrapper .planning-strategy-selector:hover {
|
|
559
|
-
opacity: .8;
|
|
560
|
-
}
|
|
561
|
-
|
|
562
|
-
[data-theme="dark"] .prompt-input-wrapper .ant-dropdown-menu-item-selected {
|
|
563
|
-
color: #2b83ff !important;
|
|
564
|
-
background-color: rgba(43, 131, 255, .15) !important;
|
|
565
|
-
}
|
|
566
|
-
|
|
567
532
|
[data-theme="dark"] .prompt-input-wrapper .structured-params-container {
|
|
568
533
|
background: linear-gradient(#1f1f1f, #1f1f1f) padding-box padding-box, linear-gradient(135deg, #4285f4 0%, #06f 25%, #7b02c5 50%, #ea4335 75%, #ff7043 100%) border-box !important;
|
|
569
534
|
}
|
|
@@ -42,7 +42,6 @@ const external_antd_namespaceObject = require("antd");
|
|
|
42
42
|
const external_react_namespaceObject = require("react");
|
|
43
43
|
var external_react_default = /*#__PURE__*/ __webpack_require__.n(external_react_namespaceObject);
|
|
44
44
|
const history_js_namespaceObject = require("../../store/history.js");
|
|
45
|
-
const store_js_namespaceObject = require("../../store/store.js");
|
|
46
45
|
const external_types_js_namespaceObject = require("../../types.js");
|
|
47
46
|
const constants_js_namespaceObject = require("../../utils/constants.js");
|
|
48
47
|
const playground_utils_js_namespaceObject = require("../../utils/playground-utils.js");
|
|
@@ -85,8 +84,6 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
85
84
|
const lastSelectedType = (0, history_js_namespaceObject.useHistoryStore)((state)=>state.lastSelectedType);
|
|
86
85
|
const addHistory = (0, history_js_namespaceObject.useHistoryStore)((state)=>state.addHistory);
|
|
87
86
|
const setLastSelectedType = (0, history_js_namespaceObject.useHistoryStore)((state)=>state.setLastSelectedType);
|
|
88
|
-
const planningStrategy = (0, store_js_namespaceObject.useEnvConfig)((state)=>state.planningStrategy);
|
|
89
|
-
const setPlanningStrategy = (0, store_js_namespaceObject.useEnvConfig)((state)=>state.setPlanningStrategy);
|
|
90
87
|
const historyForSelectedType = (0, external_react_namespaceObject.useMemo)(()=>history[selectedType] || [], [
|
|
91
88
|
history,
|
|
92
89
|
selectedType
|
|
@@ -451,7 +448,7 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
451
448
|
},
|
|
452
449
|
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Input.TextArea, {
|
|
453
450
|
className: "main-side-console-input-textarea",
|
|
454
|
-
rows:
|
|
451
|
+
rows: 3,
|
|
455
452
|
placeholder: placeholderText,
|
|
456
453
|
autoFocus: true,
|
|
457
454
|
onKeyDown: handleStructuredKeyDown
|
|
@@ -755,7 +752,7 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
755
752
|
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(TextArea, {
|
|
756
753
|
className: "main-side-console-input-textarea",
|
|
757
754
|
disabled: !runButtonEnabled,
|
|
758
|
-
rows:
|
|
755
|
+
rows: 3,
|
|
759
756
|
placeholder: placeholder,
|
|
760
757
|
autoFocus: true,
|
|
761
758
|
onKeyDown: handleKeyDown,
|
|
@@ -775,48 +772,9 @@ const PromptInput = ({ runButtonEnabled, form, serviceMode, selectedType, dryMod
|
|
|
775
772
|
(0, playground_utils_js_namespaceObject.actionNameForType)(selectedType)
|
|
776
773
|
]
|
|
777
774
|
}),
|
|
778
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.
|
|
779
|
-
className:
|
|
780
|
-
children:
|
|
781
|
-
'aiAct' === selectedType && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Dropdown, {
|
|
782
|
-
menu: {
|
|
783
|
-
items: [
|
|
784
|
-
{
|
|
785
|
-
key: 'standard',
|
|
786
|
-
label: 'Standard',
|
|
787
|
-
onClick: ()=>setPlanningStrategy('standard')
|
|
788
|
-
},
|
|
789
|
-
{
|
|
790
|
-
key: 'fast',
|
|
791
|
-
label: 'Fast',
|
|
792
|
-
onClick: ()=>setPlanningStrategy('fast')
|
|
793
|
-
}
|
|
794
|
-
],
|
|
795
|
-
selectedKeys: [
|
|
796
|
-
planningStrategy
|
|
797
|
-
]
|
|
798
|
-
},
|
|
799
|
-
trigger: [
|
|
800
|
-
'click'
|
|
801
|
-
],
|
|
802
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("a", {
|
|
803
|
-
onClick: (e)=>e.preventDefault(),
|
|
804
|
-
className: "planning-strategy-selector",
|
|
805
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_antd_namespaceObject.Space, {
|
|
806
|
-
size: 4,
|
|
807
|
-
children: [
|
|
808
|
-
'fast' === planningStrategy ? 'Fast' : 'Standard',
|
|
809
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icons_namespaceObject.DownOutlined, {
|
|
810
|
-
style: {
|
|
811
|
-
fontSize: 10
|
|
812
|
-
}
|
|
813
|
-
})
|
|
814
|
-
]
|
|
815
|
-
})
|
|
816
|
-
})
|
|
817
|
-
}),
|
|
818
|
-
renderActionButton()
|
|
819
|
-
]
|
|
775
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
776
|
+
className: "form-controller-wrapper",
|
|
777
|
+
children: renderActionButton()
|
|
820
778
|
})
|
|
821
779
|
]
|
|
822
780
|
})
|
|
@@ -126,7 +126,7 @@ function wrapExecutionDumpForReplay(dump) {
|
|
|
126
126
|
};
|
|
127
127
|
}
|
|
128
128
|
function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, setLoading, setInfoList, replayCounter, setReplayCounter, verticalMode, currentRunningIdRef, interruptedFlagRef) {
|
|
129
|
-
const { deepThink, screenshotIncluded, domIncluded
|
|
129
|
+
const { deepThink, screenshotIncluded, domIncluded } = (0, store_js_namespaceObject.useEnvConfig)();
|
|
130
130
|
const handleRun = (0, external_react_namespaceObject.useCallback)((value)=>_async_to_generator(function*() {
|
|
131
131
|
if (!playgroundSDK) return void console.warn('PlaygroundSDK is not available');
|
|
132
132
|
const thisRunningId = Date.now();
|
|
@@ -189,7 +189,6 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
|
|
|
189
189
|
result.result = yield playgroundSDK.executeAction(actionType, value, {
|
|
190
190
|
requestId: thisRunningId.toString(),
|
|
191
191
|
deepThink,
|
|
192
|
-
planningStrategy,
|
|
193
192
|
screenshotIncluded,
|
|
194
193
|
domIncluded
|
|
195
194
|
});
|
|
@@ -271,7 +270,6 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
|
|
|
271
270
|
currentRunningIdRef,
|
|
272
271
|
interruptedFlagRef,
|
|
273
272
|
deepThink,
|
|
274
|
-
planningStrategy,
|
|
275
273
|
screenshotIncluded,
|
|
276
274
|
domIncluded
|
|
277
275
|
]);
|
package/dist/lib/store/store.js
CHANGED
|
@@ -110,7 +110,6 @@ const TRACKING_ACTIVE_TAB_KEY = 'midscene-tracking-active-tab';
|
|
|
110
110
|
const DEEP_THINK_KEY = 'midscene-deep-think';
|
|
111
111
|
const SCREENSHOT_INCLUDED_KEY = 'midscene-screenshot-included';
|
|
112
112
|
const DOM_INCLUDED_KEY = 'midscene-dom-included';
|
|
113
|
-
const PLANNING_STRATEGY_KEY = 'midscene-planning-strategy';
|
|
114
113
|
const IME_STRATEGY_KEY = 'midscene-ime-strategy';
|
|
115
114
|
const AUTO_DISMISS_KEYBOARD_KEY = 'midscene-auto-dismiss-keyboard';
|
|
116
115
|
const KEYBOARD_DISMISS_STRATEGY_KEY = 'midscene-keyboard-dismiss-strategy';
|
|
@@ -149,7 +148,6 @@ const useEnvConfig = create((set, get)=>{
|
|
|
149
148
|
const savedAutoDismissKeyboard = 'false' !== localStorage.getItem(AUTO_DISMISS_KEYBOARD_KEY);
|
|
150
149
|
const savedKeyboardDismissStrategy = localStorage.getItem(KEYBOARD_DISMISS_STRATEGY_KEY) || 'esc-first';
|
|
151
150
|
const savedAlwaysRefreshScreenInfo = 'true' === localStorage.getItem(ALWAYS_REFRESH_SCREEN_INFO_KEY);
|
|
152
|
-
const savedPlanningStrategy = localStorage.getItem(PLANNING_STRATEGY_KEY) || 'standard';
|
|
153
151
|
return {
|
|
154
152
|
serviceMode: ifInExtension ? 'In-Browser-Extension' : savedServiceMode || 'Server',
|
|
155
153
|
setServiceMode: (serviceMode)=>{
|
|
@@ -208,13 +206,6 @@ const useEnvConfig = create((set, get)=>{
|
|
|
208
206
|
});
|
|
209
207
|
localStorage.setItem(DOM_INCLUDED_KEY, domIncluded.toString());
|
|
210
208
|
},
|
|
211
|
-
planningStrategy: savedPlanningStrategy,
|
|
212
|
-
setPlanningStrategy: (planningStrategy)=>{
|
|
213
|
-
set({
|
|
214
|
-
planningStrategy
|
|
215
|
-
});
|
|
216
|
-
localStorage.setItem(PLANNING_STRATEGY_KEY, planningStrategy);
|
|
217
|
-
},
|
|
218
209
|
popupTab: 'playground',
|
|
219
210
|
setPopupTab: (tab)=>{
|
|
220
211
|
set({
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as Z from 'zustand';
|
|
2
|
-
import type { PlanningStrategyType } from '../types';
|
|
3
2
|
export declare const useGlobalPreference: Z.UseBoundStore<Z.StoreApi<{
|
|
4
3
|
backgroundVisible: boolean;
|
|
5
4
|
elementsVisible: boolean;
|
|
@@ -38,8 +37,6 @@ export declare const useEnvConfig: Z.UseBoundStore<Z.StoreApi<{
|
|
|
38
37
|
setScreenshotIncluded: (screenshotIncluded: boolean) => void;
|
|
39
38
|
domIncluded: boolean | "visible-only";
|
|
40
39
|
setDomIncluded: (domIncluded: boolean | "visible-only") => void;
|
|
41
|
-
planningStrategy: PlanningStrategyType;
|
|
42
|
-
setPlanningStrategy: (planningStrategy: PlanningStrategyType) => void;
|
|
43
40
|
popupTab: "playground" | "bridge" | "recorder";
|
|
44
41
|
setPopupTab: (tab: "playground" | "bridge" | "recorder") => void;
|
|
45
42
|
imeStrategy: ImeStrategyType;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -90,7 +90,6 @@ export interface StaticPlaygroundProps {
|
|
|
90
90
|
}
|
|
91
91
|
export type ServiceModeType = 'Server' | 'In-Browser' | 'In-Browser-Extension';
|
|
92
92
|
export type DeviceType = 'web' | 'android' | 'ios';
|
|
93
|
-
export type PlanningStrategyType = 'fast' | 'standard';
|
|
94
93
|
export type RunType = 'aiAct' | 'aiQuery' | 'aiAssert' | 'aiTap' | 'aiDoubleClick' | 'aiHover' | 'aiInput' | 'aiRightClick' | 'aiKeyboardPress' | 'aiScroll' | 'aiLocate' | 'aiBoolean' | 'aiNumber' | 'aiString' | 'aiAsk' | 'aiWaitFor';
|
|
95
94
|
export interface ReplayScriptsInfo {
|
|
96
95
|
scripts: any[];
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@midscene/visualizer",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"repository": "https://github.com/web-infra-dev/midscene",
|
|
5
5
|
"homepage": "https://midscenejs.com/",
|
|
6
6
|
"types": "./dist/types/index.d.ts",
|
|
@@ -60,10 +60,10 @@
|
|
|
60
60
|
"antd": "^5.21.6",
|
|
61
61
|
"buffer": "6.0.3",
|
|
62
62
|
"dayjs": "^1.11.11",
|
|
63
|
-
"@midscene/
|
|
64
|
-
"@midscene/
|
|
65
|
-
"@midscene/
|
|
66
|
-
"@midscene/web": "1.0.
|
|
63
|
+
"@midscene/playground": "1.0.2",
|
|
64
|
+
"@midscene/shared": "1.0.2",
|
|
65
|
+
"@midscene/core": "1.0.2",
|
|
66
|
+
"@midscene/web": "1.0.2"
|
|
67
67
|
},
|
|
68
68
|
"license": "MIT",
|
|
69
69
|
"scripts": {
|