sales-frontend-debug 0.0.30 → 0.0.32
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/index.cjs +167 -78
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -1
- package/dist/index.d.ts +2 -1
- package/dist/index.js +127 -39
- package/dist/index.js.map +1 -1
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React2, { useEffect, useState, useMemo, useRef, useCallback } from 'react';
|
|
2
2
|
import { getEnvironmentFromHostname, isClient } from 'sales-frontend-utils';
|
|
3
3
|
import { useDebugStore } from 'sales-frontend-stores';
|
|
4
4
|
|
|
@@ -225,9 +225,85 @@ var textareaStyle = {
|
|
|
225
225
|
var FloatingButton = ({ onClick }) => {
|
|
226
226
|
const [position, setPosition] = useState({ x: 0, y: 0 });
|
|
227
227
|
const [isDragging, setIsDragging] = useState(false);
|
|
228
|
+
const [isVisible, setIsVisible] = useState(false);
|
|
229
|
+
const gestureStep = useRef(0);
|
|
230
|
+
const gestureTimeout = useRef(null);
|
|
231
|
+
const globalDragStart = useRef(null);
|
|
228
232
|
const dragHappened = useRef(false);
|
|
229
233
|
const dragStartPos = useRef({ x: 0, y: 0 });
|
|
230
234
|
const elementStartPos = useRef({ x: 0, y: 0 });
|
|
235
|
+
const clickCount = useRef(0);
|
|
236
|
+
const clickTimeout = useRef(null);
|
|
237
|
+
useEffect(() => {
|
|
238
|
+
const handleGlobalMouseDown = (e) => {
|
|
239
|
+
globalDragStart.current = { x: e.clientX, y: e.clientY };
|
|
240
|
+
};
|
|
241
|
+
const handleGlobalMouseUp = (e) => {
|
|
242
|
+
if (!globalDragStart.current) {
|
|
243
|
+
return;
|
|
244
|
+
}
|
|
245
|
+
const dx = e.clientX - globalDragStart.current.x;
|
|
246
|
+
const dy = e.clientY - globalDragStart.current.y;
|
|
247
|
+
const absDx = Math.abs(dx);
|
|
248
|
+
const absDy = Math.abs(dy);
|
|
249
|
+
const THRESHOLD = 200;
|
|
250
|
+
if (dy > THRESHOLD && absDy > absDx) {
|
|
251
|
+
if (gestureStep.current === 0) {
|
|
252
|
+
gestureStep.current = 1;
|
|
253
|
+
if (gestureTimeout.current) {
|
|
254
|
+
clearTimeout(gestureTimeout.current);
|
|
255
|
+
}
|
|
256
|
+
gestureTimeout.current = setTimeout(() => {
|
|
257
|
+
gestureStep.current = 0;
|
|
258
|
+
}, 2e3);
|
|
259
|
+
}
|
|
260
|
+
} else if (dx > THRESHOLD && absDx > absDy) {
|
|
261
|
+
if (gestureStep.current === 1) {
|
|
262
|
+
setIsVisible((prev) => !prev);
|
|
263
|
+
gestureStep.current = 0;
|
|
264
|
+
if (gestureTimeout.current) {
|
|
265
|
+
clearTimeout(gestureTimeout.current);
|
|
266
|
+
}
|
|
267
|
+
} else {
|
|
268
|
+
gestureStep.current = 0;
|
|
269
|
+
}
|
|
270
|
+
} else ;
|
|
271
|
+
globalDragStart.current = null;
|
|
272
|
+
};
|
|
273
|
+
window.addEventListener("mousedown", handleGlobalMouseDown);
|
|
274
|
+
window.addEventListener("mouseup", handleGlobalMouseUp);
|
|
275
|
+
return () => {
|
|
276
|
+
window.removeEventListener("mousedown", handleGlobalMouseDown);
|
|
277
|
+
window.removeEventListener("mouseup", handleGlobalMouseUp);
|
|
278
|
+
if (gestureTimeout.current) {
|
|
279
|
+
clearTimeout(gestureTimeout.current);
|
|
280
|
+
}
|
|
281
|
+
};
|
|
282
|
+
}, []);
|
|
283
|
+
useEffect(() => {
|
|
284
|
+
const handleGlobalClick = () => {
|
|
285
|
+
clickCount.current += 1;
|
|
286
|
+
if (clickCount.current === 1) {
|
|
287
|
+
clickTimeout.current = setTimeout(() => {
|
|
288
|
+
clickCount.current = 0;
|
|
289
|
+
}, 3e3);
|
|
290
|
+
}
|
|
291
|
+
if (clickCount.current >= 10) {
|
|
292
|
+
setIsVisible((prev) => !prev);
|
|
293
|
+
clickCount.current = 0;
|
|
294
|
+
if (clickTimeout.current) {
|
|
295
|
+
clearTimeout(clickTimeout.current);
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
};
|
|
299
|
+
window.addEventListener("click", handleGlobalClick);
|
|
300
|
+
return () => {
|
|
301
|
+
window.removeEventListener("click", handleGlobalClick);
|
|
302
|
+
if (clickTimeout.current) {
|
|
303
|
+
clearTimeout(clickTimeout.current);
|
|
304
|
+
}
|
|
305
|
+
};
|
|
306
|
+
}, []);
|
|
231
307
|
const handleMouseDown = (e) => {
|
|
232
308
|
if (e.button !== 0) {
|
|
233
309
|
return;
|
|
@@ -266,17 +342,11 @@ var FloatingButton = ({ onClick }) => {
|
|
|
266
342
|
const buttonStyle = {
|
|
267
343
|
...debugFloatingButtonStyle,
|
|
268
344
|
transform: `translate(${position.x}px, ${position.y}px)`,
|
|
269
|
-
cursor: isDragging ? "grabbing" : "grab"
|
|
345
|
+
cursor: isDragging ? "grabbing" : "grab",
|
|
346
|
+
display: isVisible ? "flex" : "none"
|
|
347
|
+
// Hide until activated
|
|
270
348
|
};
|
|
271
|
-
return /* @__PURE__ */
|
|
272
|
-
"button",
|
|
273
|
-
{
|
|
274
|
-
style: buttonStyle,
|
|
275
|
-
onMouseDown: handleMouseDown,
|
|
276
|
-
onClick: handleClick
|
|
277
|
-
},
|
|
278
|
-
"DEBUG"
|
|
279
|
-
);
|
|
349
|
+
return /* @__PURE__ */ React2.createElement("button", { style: buttonStyle, onMouseDown: handleMouseDown, onClick: handleClick }, "DEBUG");
|
|
280
350
|
};
|
|
281
351
|
var floating_button_default = FloatingButton;
|
|
282
352
|
var cookieClient = {
|
|
@@ -393,6 +463,13 @@ var MenuPanel = ({ menuItems: menuItems2, onMenuItemClick, onClose, serviceCode
|
|
|
393
463
|
"x-channel-business-work-division-code": cookieClient.getCookie("x-channel-business-work-division-code")
|
|
394
464
|
});
|
|
395
465
|
};
|
|
466
|
+
const handleDeleteHostCookie = () => {
|
|
467
|
+
cookieClient.deleteCookie("dsp-debug-mode-env");
|
|
468
|
+
alert("\uD638\uC2A4\uD2B8\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
|
|
469
|
+
console.log("\uD638\uC2A4\uD2B8\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
|
|
470
|
+
"dsp-debug-mode-env": cookieClient.getCookie("dsp-debug-mode-env")
|
|
471
|
+
});
|
|
472
|
+
};
|
|
396
473
|
const handleDeleteTokenCookie = () => {
|
|
397
474
|
cookieClient.deleteCookie("accessToken");
|
|
398
475
|
alert("\uD1A0\uD070\uCFE0\uD0A4\uAC00 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.");
|
|
@@ -407,7 +484,14 @@ var MenuPanel = ({ menuItems: menuItems2, onMenuItemClick, onClose, serviceCode
|
|
|
407
484
|
"x-channel-formfactor": cookieClient.getCookie("x-channel-formfactor")
|
|
408
485
|
});
|
|
409
486
|
};
|
|
410
|
-
|
|
487
|
+
const handleHost = (host) => {
|
|
488
|
+
cookieClient.setCookie("dsp-debug-mode-env", host);
|
|
489
|
+
alert(`\uD638\uC2A4\uD2B8\uAC00 \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.:${host}`);
|
|
490
|
+
console.log("\uD638\uC2A4\uD2B8\uAC00 \uBCC0\uACBD\uB418\uC5C8\uC2B5\uB2C8\uB2E4.", {
|
|
491
|
+
"dsp-debug-mode-env": cookieClient.getCookie("dsp-debug-mode-env")
|
|
492
|
+
});
|
|
493
|
+
};
|
|
494
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugMenuPanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "Debug Menu"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("ul", null, menuItems2.map((item) => /* @__PURE__ */ React2.createElement("li", { key: item.id, onClick: () => onMenuItemClick(item.component), style: menuItemStyle }, item.label))), serviceCode === "dsp" && /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uD3FC\uD329\uD130")), /* @__PURE__ */ React2.createElement("ul", null, /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleFormFactor("tablet") }, "Tablet"), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleFormFactor("phone") }, "Phone"), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleFormFactor("pc") }, "PC")), /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "API\uD638\uC2A4\uD2B8")), /* @__PURE__ */ React2.createElement("ul", null, /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleHost("local") }, "local"), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleHost("dev") }, "dev"), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle, onClick: () => handleHost("stg") }, "stg")), /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uCD08\uAE30\uD654")), /* @__PURE__ */ React2.createElement("ul", null, /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle }, /* @__PURE__ */ React2.createElement("button", { onClick: handleDeleteHostCookie }, "Host \uC0AD\uC81C")), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle }, /* @__PURE__ */ React2.createElement("button", { onClick: handleDeleteCustomCookie }, "\uCEE4\uC2A4\uD140(x-channel-) \uC0AD\uC81C")), /* @__PURE__ */ React2.createElement("li", { style: menuItemStyle }, /* @__PURE__ */ React2.createElement("button", { onClick: handleDeleteTokenCookie }, "\uD1A0\uD070 \uC0AD\uC81C"))))));
|
|
411
495
|
};
|
|
412
496
|
var menu_panel_default = MenuPanel;
|
|
413
497
|
var globalLogs = [];
|
|
@@ -483,7 +567,7 @@ var LogMessage = ({ entry }) => {
|
|
|
483
567
|
return String(part);
|
|
484
568
|
});
|
|
485
569
|
const style = { ...logMessageStyle, ...logTypeStyles[entry.type] };
|
|
486
|
-
return /* @__PURE__ */
|
|
570
|
+
return /* @__PURE__ */ React2.createElement("pre", { style }, messageParts.join(" "));
|
|
487
571
|
};
|
|
488
572
|
var ConsoleLogPanel = ({ onClose }) => {
|
|
489
573
|
const { logs, clearLogs } = useConsoleLog();
|
|
@@ -501,7 +585,7 @@ var ConsoleLogPanel = ({ onClose }) => {
|
|
|
501
585
|
}
|
|
502
586
|
}, [filteredLogs]);
|
|
503
587
|
const segmentOptions = ["all", "log", "warn", "error"];
|
|
504
|
-
return /* @__PURE__ */
|
|
588
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "Console Logs"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("div", { style: panelToolbarStyle }, /* @__PURE__ */ React2.createElement("div", null, segmentOptions.map((option) => /* @__PURE__ */ React2.createElement("button", { key: option, onClick: () => setFilter(option), disabled: filter === option }, option.charAt(0).toUpperCase() + option.slice(1)))), /* @__PURE__ */ React2.createElement("button", { onClick: clearLogs, style: clearButtonStyle }, "Clear")), /* @__PURE__ */ React2.createElement("div", { style: logListContainerStyle, ref: logContainerRef }, filteredLogs.map((log) => /* @__PURE__ */ React2.createElement("div", { key: log.id, style: logItemStyle }, /* @__PURE__ */ React2.createElement("span", { style: logTimestampStyle }, log.timestamp), /* @__PURE__ */ React2.createElement(LogMessage, { entry: log }))))));
|
|
505
589
|
};
|
|
506
590
|
var console_log_panel_default = ConsoleLogPanel;
|
|
507
591
|
var LoginPanel = ({ onClose, onLogin }) => {
|
|
@@ -546,7 +630,7 @@ var LoginPanel = ({ onClose, onLogin }) => {
|
|
|
546
630
|
useEffect(() => {
|
|
547
631
|
setFormData({});
|
|
548
632
|
}, [selectedType]);
|
|
549
|
-
return /* @__PURE__ */
|
|
633
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uAC04\uD3B8 \uB85C\uADF8\uC778"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("form", { style: loginFormContainerStyle, onSubmit: handleSubmit }, /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("ul", { style: { listStyleType: "circle" } }, /* @__PURE__ */ React2.createElement("li", null, /* @__PURE__ */ React2.createElement("label", { htmlFor: "debug-on" }, "Debug On"), /* @__PURE__ */ React2.createElement("input", { type: "checkbox", id: "debug-on", onChange: handleDebugOn, checked: mode }), /* @__PURE__ */ React2.createElement("ul", { style: { listStyleType: "square", paddingLeft: "20px" } }, /* @__PURE__ */ React2.createElement("li", null, "(\uCFE0\uD0A4\uC5D0 \uC14B\uD305\uB41C \uD1A0\uD070\uAC12\uC73C\uB85C \uD5E4\uB354\uB97C \uC0DD\uC131\uD569\uB2C8\uB2E4. \uAC04\uD3B8\uB85C\uADF8\uC778 \uC0AC\uC6A9\uC2DC \uD544\uC218\uCCB4\uD06C)"))), /* @__PURE__ */ React2.createElement("li", null, /* @__PURE__ */ React2.createElement("label", { htmlFor: "step-validation-off" }, "\uC11C\uC2DD Validation Off"), /* @__PURE__ */ React2.createElement(
|
|
550
634
|
"input",
|
|
551
635
|
{
|
|
552
636
|
type: "checkbox",
|
|
@@ -554,7 +638,7 @@ var LoginPanel = ({ onClose, onLogin }) => {
|
|
|
554
638
|
onChange: handleStepValidationOff,
|
|
555
639
|
checked: stepValidationOff
|
|
556
640
|
}
|
|
557
|
-
), /* @__PURE__ */
|
|
641
|
+
), /* @__PURE__ */ React2.createElement("ul", { style: { listStyleType: "square", paddingLeft: "20px" } }, /* @__PURE__ */ React2.createElement("li", null, "(\uC11C\uC2DD \uB2E8\uACC4 \uC774\uB3D9\uC2DC, validation\uC744 \uB044\uACE0 \uBBF8\uC791\uC131 \uB2E8\uACC4\uB3C4 \uC774\uB3D9\uAC00\uB2A5\uD558\uB3C4\uB85D \uD569\uB2C8\uB2E4.)")))), /* @__PURE__ */ React2.createElement("br", null), " ", /* @__PURE__ */ React2.createElement("br", null), /* @__PURE__ */ React2.createElement("label", { htmlFor: "login-type-select" }, "\uB85C\uADF8\uC778 \uC720\uD615"), /* @__PURE__ */ React2.createElement("select", { id: "login-type-select", value: selectedTypeId, onChange: (e) => setSelectedTypeId(e.target.value) }, loginTypes.map((type) => /* @__PURE__ */ React2.createElement("option", { key: type.id, value: type.id }, type.label)))), selectedType?.fields.map((field) => /* @__PURE__ */ React2.createElement("div", { key: field.name }, /* @__PURE__ */ React2.createElement("label", { htmlFor: field.name }, field.label), /* @__PURE__ */ React2.createElement(
|
|
558
642
|
"input",
|
|
559
643
|
{
|
|
560
644
|
type: field.type,
|
|
@@ -565,7 +649,7 @@ var LoginPanel = ({ onClose, onLogin }) => {
|
|
|
565
649
|
onChange: handleInputChange,
|
|
566
650
|
required: true
|
|
567
651
|
}
|
|
568
|
-
))), /* @__PURE__ */
|
|
652
|
+
))), /* @__PURE__ */ React2.createElement("div", { style: formActionsStyle }, /* @__PURE__ */ React2.createElement("button", { type: "submit" }, "\uB85C\uADF8\uC778")))));
|
|
569
653
|
};
|
|
570
654
|
var login_panel_default = LoginPanel;
|
|
571
655
|
var SEARCH_SECTIONS = [
|
|
@@ -666,9 +750,9 @@ var NetworkLog = ({ onClose }) => {
|
|
|
666
750
|
};
|
|
667
751
|
const renderLogContent = (log) => {
|
|
668
752
|
const logInfo = getLogInfo(log);
|
|
669
|
-
return /* @__PURE__ */
|
|
753
|
+
return /* @__PURE__ */ React2.createElement("pre", null, JSON.stringify(logInfo, null, 2));
|
|
670
754
|
};
|
|
671
|
-
return /* @__PURE__ */
|
|
755
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uB124\uD2B8\uC6CC\uD06C \uB85C\uADF8"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("div", { style: networkLogContainerStyle }, /* @__PURE__ */ React2.createElement("div", { style: searchContainerStyle }, /* @__PURE__ */ React2.createElement("select", { value: searchSection, onChange: (e) => setSearchSection(e.target.value) }, SEARCH_SECTIONS.map((option) => /* @__PURE__ */ React2.createElement("option", { key: option.value, value: option.value }, option.label))), /* @__PURE__ */ React2.createElement(
|
|
672
756
|
"input",
|
|
673
757
|
{
|
|
674
758
|
type: "text",
|
|
@@ -677,7 +761,7 @@ var NetworkLog = ({ onClose }) => {
|
|
|
677
761
|
onChange: (e) => setSearchTerm(e.target.value),
|
|
678
762
|
style: flex1Style
|
|
679
763
|
}
|
|
680
|
-
), /* @__PURE__ */
|
|
764
|
+
), /* @__PURE__ */ React2.createElement("label", null, /* @__PURE__ */ React2.createElement("input", { type: "checkbox", id: "hold-checkbox", checked: isHold, onChange: toggleHold }), "Hold"), /* @__PURE__ */ React2.createElement("button", { onClick: clear }, "clear")), isHold && /* @__PURE__ */ React2.createElement("div", { style: holdButtonsContainerStyle }, /* @__PURE__ */ React2.createElement("button", { onClick: () => playAllRequests() }, "REQ Resolve"), /* @__PURE__ */ React2.createElement("button", { onClick: () => playAllResponses() }, "RES Resolve")), /* @__PURE__ */ React2.createElement("div", { style: logListStyle }, filteredLogs.length === 0 ? /* @__PURE__ */ React2.createElement("p", null, "\uD45C\uC2DC\uD560 \uB85C\uADF8\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4.") : /* @__PURE__ */ React2.createElement("div", null, filteredLogs.map((log, index) => /* @__PURE__ */ React2.createElement("details", { key: index }, /* @__PURE__ */ React2.createElement("summary", { style: logSummaryStyle }, renderLogSummary(log)), /* @__PURE__ */ React2.createElement("div", { style: logContentStyle }, renderLogContent(log)))))))));
|
|
681
765
|
};
|
|
682
766
|
var network_log_default = NetworkLog;
|
|
683
767
|
var URL_MAP = {
|
|
@@ -707,7 +791,7 @@ var PageNavigationPanel = ({ onClose }) => {
|
|
|
707
791
|
setUrl("");
|
|
708
792
|
}
|
|
709
793
|
};
|
|
710
|
-
return /* @__PURE__ */
|
|
794
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uD398\uC774\uC9C0 \uC774\uB3D9"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("div", { style: pageNavigationContentStyle }, /* @__PURE__ */ React2.createElement("select", { onChange: handleUrlTypeChange }, /* @__PURE__ */ React2.createElement("option", null, "\uC120\uD0DD"), /* @__PURE__ */ React2.createElement("option", { value: "FP_1" }, "FP-\uC785\uB825\uB2E8\uACC4_\uC2DC\uC791\uD558\uAE30"), /* @__PURE__ */ React2.createElement("option", { value: "FP_2" }, "FP-\uC785\uB825\uB2E8\uACC4_2"), /* @__PURE__ */ React2.createElement("option", { value: "FP_3" }, "FP-\uC785\uB825\uB2E8\uACC4_3"), /* @__PURE__ */ React2.createElement("option", { value: "FP_4" }, "FP-\uC785\uB825\uB2E8\uACC4_4"), /* @__PURE__ */ React2.createElement("option", { value: "FP_5" }, "FP-\uC785\uB825\uB2E8\uACC4_5"), /* @__PURE__ */ React2.createElement("option", { value: "CUST_1" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_1"), /* @__PURE__ */ React2.createElement("option", { value: "CUST_2" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_2"), /* @__PURE__ */ React2.createElement("option", { value: "CUST_3" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_3"), /* @__PURE__ */ React2.createElement("option", { value: "CUST_4" }, "\uACE0\uAC1D-\uC785\uB825\uB2E8\uACC4_4"), /* @__PURE__ */ React2.createElement("option", { value: "none" }, "\uC9C1\uC811\uC785\uB825")), /* @__PURE__ */ React2.createElement(
|
|
711
795
|
"input",
|
|
712
796
|
{
|
|
713
797
|
type: "text",
|
|
@@ -716,7 +800,7 @@ var PageNavigationPanel = ({ onClose }) => {
|
|
|
716
800
|
placeholder: "\uC774\uB3D9\uD560 URL\uC744 \uC785\uB825\uD558\uC138\uC694 (\uC608: /main)",
|
|
717
801
|
style: flex1Style
|
|
718
802
|
}
|
|
719
|
-
), /* @__PURE__ */
|
|
803
|
+
), /* @__PURE__ */ React2.createElement("button", { onClick: handleNavigate }, "\uC774\uB3D9"))));
|
|
720
804
|
};
|
|
721
805
|
var page_navigation_panel_default = PageNavigationPanel;
|
|
722
806
|
var logTypeStyles2 = {
|
|
@@ -742,7 +826,7 @@ var ResultMessage = ({ log }) => {
|
|
|
742
826
|
});
|
|
743
827
|
const prefix = log.type === "return" ? "\u21A9 " : "";
|
|
744
828
|
const style = { ...logMessageStyle, ...logTypeStyles2[log.type] };
|
|
745
|
-
return /* @__PURE__ */
|
|
829
|
+
return /* @__PURE__ */ React2.createElement("pre", { style }, prefix, messageParts.join(" "));
|
|
746
830
|
};
|
|
747
831
|
var ScriptExecutorPanel = ({ onClose }) => {
|
|
748
832
|
const [code, setCode] = useState('// \uC5EC\uAE30\uC5D0 \uC2E4\uD589\uD560 \uCF54\uB4DC\uB97C \uC785\uB825\uD558\uC138\uC694\nconsole.log("Hello, World!");');
|
|
@@ -789,7 +873,7 @@ var ScriptExecutorPanel = ({ onClose }) => {
|
|
|
789
873
|
const handleClear = () => {
|
|
790
874
|
setResults([]);
|
|
791
875
|
};
|
|
792
|
-
return /* @__PURE__ */
|
|
876
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: { ...debugFeaturePanelStyle, ...scriptExecutorContentStyle } }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, "\uC2A4\uD06C\uB9BD\uD2B8 \uC2E4\uD589"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("div", { style: scriptExecutorContentStyle }, /* @__PURE__ */ React2.createElement("div", { style: scriptInputSectionStyle }, /* @__PURE__ */ React2.createElement(
|
|
793
877
|
"textarea",
|
|
794
878
|
{
|
|
795
879
|
style: scriptTextareaStyle,
|
|
@@ -797,18 +881,18 @@ var ScriptExecutorPanel = ({ onClose }) => {
|
|
|
797
881
|
onChange: (e) => setCode(e.target.value),
|
|
798
882
|
spellCheck: "false"
|
|
799
883
|
}
|
|
800
|
-
), /* @__PURE__ */
|
|
884
|
+
), /* @__PURE__ */ React2.createElement("div", { style: scriptActionsStyle }, /* @__PURE__ */ React2.createElement("button", { onClick: handleExecute }, "\uC2E4\uD589 (\u25B6)"), /* @__PURE__ */ React2.createElement("button", { onClick: handleClear }, "\uACB0\uACFC \uC9C0\uC6B0\uAE30"))), /* @__PURE__ */ React2.createElement("div", { style: scriptOutputSectionStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h3", { style: h3Style }, "\uACB0\uACFC")), /* @__PURE__ */ React2.createElement("div", { style: logListContainerStyle }, results.map((log) => /* @__PURE__ */ React2.createElement("div", { key: log.id, style: logItemStyle }, /* @__PURE__ */ React2.createElement("span", { style: logTimestampStyle }, log.timestamp), /* @__PURE__ */ React2.createElement(ResultMessage, { log }))))))));
|
|
801
885
|
};
|
|
802
886
|
var script_executor_panel_default = ScriptExecutorPanel;
|
|
803
887
|
var ValueDisplay = ({ value }) => {
|
|
804
888
|
try {
|
|
805
889
|
const parsed = JSON.parse(value);
|
|
806
890
|
if (typeof parsed === "object" && parsed !== null) {
|
|
807
|
-
return /* @__PURE__ */
|
|
891
|
+
return /* @__PURE__ */ React2.createElement("pre", { style: logContentStyle }, JSON.stringify(parsed, null, 2));
|
|
808
892
|
}
|
|
809
893
|
} catch (e) {
|
|
810
894
|
}
|
|
811
|
-
return /* @__PURE__ */
|
|
895
|
+
return /* @__PURE__ */ React2.createElement("div", { style: logContentStyle }, value);
|
|
812
896
|
};
|
|
813
897
|
var EditableRow = ({ item, onSave, onRemove }) => {
|
|
814
898
|
const [isEditing, setIsEditing] = useState(false);
|
|
@@ -821,7 +905,7 @@ var EditableRow = ({ item, onSave, onRemove }) => {
|
|
|
821
905
|
setValue(item.value);
|
|
822
906
|
setIsEditing(true);
|
|
823
907
|
};
|
|
824
|
-
return /* @__PURE__ */
|
|
908
|
+
return /* @__PURE__ */ React2.createElement("details", null, /* @__PURE__ */ React2.createElement("summary", null, item.key), /* @__PURE__ */ React2.createElement("div", null, isEditing ? /* @__PURE__ */ React2.createElement("button", { onClick: handleSave }, "Save") : /* @__PURE__ */ React2.createElement("button", { onClick: handleEdit }, "Edit"), /* @__PURE__ */ React2.createElement("button", { onClick: () => onRemove(item.key) }, "Remove"), isEditing ? /* @__PURE__ */ React2.createElement("textarea", { value, onChange: (e) => setValue(e.target.value), style: textareaStyle }) : /* @__PURE__ */ React2.createElement(ValueDisplay, { value: item.value })));
|
|
825
909
|
};
|
|
826
910
|
var StoragePanel = ({ onClose, storageType }) => {
|
|
827
911
|
const { items, setItem, removeItem } = useStorage(storageType);
|
|
@@ -834,7 +918,7 @@ var StoragePanel = ({ onClose, storageType }) => {
|
|
|
834
918
|
(item) => item.key.toLowerCase().includes(filter.toLowerCase()) || item.value.toLowerCase().includes(filter.toLowerCase())
|
|
835
919
|
);
|
|
836
920
|
}, [items, filter]);
|
|
837
|
-
return /* @__PURE__ */
|
|
921
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", { style: modalOverlayStyle, onClick: onClose }), /* @__PURE__ */ React2.createElement("div", { style: debugFeaturePanelStyle }, /* @__PURE__ */ React2.createElement("div", { style: panelHeaderStyle }, /* @__PURE__ */ React2.createElement("h2", { style: h2Style }, storageType === "localStorage" ? "Local Storage" : "Cookies"), /* @__PURE__ */ React2.createElement("button", { onClick: onClose }, "X")), /* @__PURE__ */ React2.createElement("div", { style: panelToolbarStyle }, /* @__PURE__ */ React2.createElement(
|
|
838
922
|
"input",
|
|
839
923
|
{
|
|
840
924
|
type: "text",
|
|
@@ -843,7 +927,7 @@ var StoragePanel = ({ onClose, storageType }) => {
|
|
|
843
927
|
onChange: (e) => setFilter(e.target.value),
|
|
844
928
|
style: storageSearchInputStyle
|
|
845
929
|
}
|
|
846
|
-
)), /* @__PURE__ */
|
|
930
|
+
)), /* @__PURE__ */ React2.createElement("div", { style: storageTableContainerStyle }, filteredItems.map((item) => /* @__PURE__ */ React2.createElement(EditableRow, { key: item.key, item, onSave: setItem, onRemove: removeItem })))));
|
|
847
931
|
};
|
|
848
932
|
var storage_panel_default = StoragePanel;
|
|
849
933
|
|
|
@@ -883,13 +967,13 @@ var menuItems = [
|
|
|
883
967
|
id: "local-storage",
|
|
884
968
|
label: "\uB85C\uCEEC \uC2A4\uD1A0\uB9AC\uC9C0 \uAD00\uB9AC",
|
|
885
969
|
// StoragePanel은 재사용 가능한 컴포넌트이므로, props를 통해 어떤 스토리지를 다룰지 지정합니다.
|
|
886
|
-
component: (props) => /* @__PURE__ */
|
|
970
|
+
component: (props) => /* @__PURE__ */ React2.createElement(storage_panel_default, { ...props, storageType: "localStorage" }),
|
|
887
971
|
display: true
|
|
888
972
|
},
|
|
889
973
|
{
|
|
890
974
|
id: "cookie-management",
|
|
891
975
|
label: "\uCFE0\uD0A4 \uAD00\uB9AC",
|
|
892
|
-
component: (props) => /* @__PURE__ */
|
|
976
|
+
component: (props) => /* @__PURE__ */ React2.createElement(storage_panel_default, { ...props, storageType: "cookie" }),
|
|
893
977
|
display: true
|
|
894
978
|
},
|
|
895
979
|
{
|
|
@@ -965,9 +1049,9 @@ var DebugTool = ({
|
|
|
965
1049
|
);
|
|
966
1050
|
if (activeFeature) {
|
|
967
1051
|
const FeatureComponent = activeFeature;
|
|
968
|
-
return /* @__PURE__ */
|
|
1052
|
+
return /* @__PURE__ */ React2.createElement(FeatureComponent, { onClose: handleCloseFeature, onLogin });
|
|
969
1053
|
}
|
|
970
|
-
return /* @__PURE__ */
|
|
1054
|
+
return /* @__PURE__ */ React2.createElement(
|
|
971
1055
|
"div",
|
|
972
1056
|
{
|
|
973
1057
|
style: {
|
|
@@ -977,8 +1061,8 @@ var DebugTool = ({
|
|
|
977
1061
|
zIndex: 9999
|
|
978
1062
|
}
|
|
979
1063
|
},
|
|
980
|
-
/* @__PURE__ */
|
|
981
|
-
isMenuOpen && /* @__PURE__ */
|
|
1064
|
+
/* @__PURE__ */ React2.createElement(floating_button_default, { onClick: toggleMenu }),
|
|
1065
|
+
isMenuOpen && /* @__PURE__ */ React2.createElement(
|
|
982
1066
|
menu_panel_default,
|
|
983
1067
|
{
|
|
984
1068
|
menuItems: availableMenuItems,
|
|
@@ -1064,10 +1148,14 @@ function addErrorLog(error) {
|
|
|
1064
1148
|
|
|
1065
1149
|
// src/debug-utils.ts
|
|
1066
1150
|
function isDebugStepValidationOff() {
|
|
1067
|
-
const
|
|
1068
|
-
return
|
|
1151
|
+
const debugStepValidationOff = cookieClient.getCookie("Debug-Step-Validation-Off") === "true";
|
|
1152
|
+
return debugStepValidationOff;
|
|
1153
|
+
}
|
|
1154
|
+
function isDebugMode() {
|
|
1155
|
+
const debugMode = cookieClient.getCookie("dsp-debug-mode") === "on";
|
|
1156
|
+
return debugMode;
|
|
1069
1157
|
}
|
|
1070
1158
|
|
|
1071
|
-
export { DebugTool, addErrorLog, addRequestLog, addResponseLog, isDebugStepValidationOff };
|
|
1159
|
+
export { DebugTool, addErrorLog, addRequestLog, addResponseLog, isDebugMode, isDebugStepValidationOff };
|
|
1072
1160
|
//# sourceMappingURL=index.js.map
|
|
1073
1161
|
//# sourceMappingURL=index.js.map
|