@nine-lab/nine-mu 0.1.352 → 0.1.353
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/nine-mu.js +35 -31
- package/dist/nine-mu.js.map +1 -1
- package/dist/nine-mu.umd.js +1 -1
- package/dist/nine-mu.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/components/exception/ExceptionHook.js +28 -28
package/package.json
CHANGED
|
@@ -1,33 +1,32 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
|
|
3
3
|
// ==========================================
|
|
4
|
-
// 1.
|
|
4
|
+
// 1. 터미널 프롬프트 테마 스타일 (줄간격 및 마진 정밀 교정)
|
|
5
5
|
// ==========================================
|
|
6
6
|
export const NineExceptionStyles = {
|
|
7
7
|
container: {
|
|
8
|
-
padding: '
|
|
8
|
+
padding: '25px',
|
|
9
9
|
margin: '20px',
|
|
10
10
|
background: '#121314', // 터미널 다크 블랙 배경
|
|
11
|
-
border: '1px solid #343A40', // 외곽 메탈릭
|
|
11
|
+
border: '1px solid #343A40', // 외곽 메탈릭 테두리
|
|
12
12
|
borderRadius: '6px',
|
|
13
|
-
fontFamily: 'Consolas, Monaco, "Courier New", monospace',
|
|
13
|
+
fontFamily: 'Consolas, Monaco, "Courier New", monospace',
|
|
14
14
|
textAlign: 'left',
|
|
15
15
|
boxShadow: '0 4px 12px rgba(0,0,0,0.3)',
|
|
16
|
-
lineHeight: '1.
|
|
16
|
+
lineHeight: '1.2' // ⭐ 줄간격을 터미널처럼 촘촘하게 제어
|
|
17
17
|
},
|
|
18
18
|
systemError: {
|
|
19
|
-
color: '#E53E3E', //
|
|
19
|
+
color: '#E53E3E', // 터미널 레드 Warning
|
|
20
20
|
fontWeight: 'bold',
|
|
21
21
|
fontSize: '14px',
|
|
22
|
-
margin: '0 0
|
|
22
|
+
margin: '0 0 8px 0', // 하단 마진 축소
|
|
23
23
|
letterSpacing: '0.5px'
|
|
24
24
|
},
|
|
25
|
-
// 내부 테두리 박스를 완전히 제거하고 순수 텍스트만 출력되도록 수정
|
|
26
25
|
pre: {
|
|
27
26
|
background: 'transparent',
|
|
28
27
|
color: '#F8F9FA',
|
|
29
28
|
padding: '0',
|
|
30
|
-
margin: '0 0
|
|
29
|
+
margin: '0 0 12px 0', // 하단 마진 축소하여 다음 라인과 밀착
|
|
31
30
|
border: 'none',
|
|
32
31
|
overflowX: 'auto',
|
|
33
32
|
whiteSpace: 'pre-wrap',
|
|
@@ -37,32 +36,33 @@ export const NineExceptionStyles = {
|
|
|
37
36
|
footer: {
|
|
38
37
|
fontSize: '14px',
|
|
39
38
|
color: '#E2E8F0',
|
|
39
|
+
margin: '0', // 불필요한 공백 제거
|
|
40
40
|
display: 'flex',
|
|
41
41
|
flexDirection: 'column',
|
|
42
|
-
gap: '
|
|
42
|
+
gap: '6px'
|
|
43
43
|
},
|
|
44
44
|
promptRow: {
|
|
45
|
-
display: '
|
|
46
|
-
|
|
47
|
-
gap: '10px'
|
|
45
|
+
display: 'block', // 자연스러운 텍스트 흐름을 위해 block 처리
|
|
46
|
+
margin: '0'
|
|
48
47
|
},
|
|
49
|
-
//
|
|
50
|
-
|
|
48
|
+
// ⭐ y 글자에 직접 바인딩할 터미널 링크 스타일
|
|
49
|
+
cliLink: {
|
|
51
50
|
background: 'transparent',
|
|
52
|
-
color: '#38A169', // 터미널 그린
|
|
51
|
+
color: '#38A169', // 터미널 그린
|
|
53
52
|
border: 'none',
|
|
54
|
-
padding: '0',
|
|
53
|
+
padding: '0 2px',
|
|
55
54
|
fontFamily: 'Consolas, Monaco, monospace',
|
|
56
55
|
fontSize: '14px',
|
|
57
56
|
fontWeight: 'bold',
|
|
58
57
|
cursor: 'pointer',
|
|
59
58
|
textDecoration: 'underline',
|
|
60
|
-
textUnderlineOffset: '
|
|
59
|
+
textUnderlineOffset: '2px',
|
|
60
|
+
display: 'inline'
|
|
61
61
|
}
|
|
62
62
|
};
|
|
63
63
|
|
|
64
64
|
// ==========================================
|
|
65
|
-
// 2. 컴포넌트 본문
|
|
65
|
+
// 2. 컴포넌트 본문
|
|
66
66
|
// ==========================================
|
|
67
67
|
export class NineExceptionHook extends React.Component {
|
|
68
68
|
|
|
@@ -89,7 +89,7 @@ export class NineExceptionHook extends React.Component {
|
|
|
89
89
|
componentDidMount() {
|
|
90
90
|
window.addEventListener('popstate', this.handleLocationChange);
|
|
91
91
|
document.addEventListener('click', this.handleLocationChange, true);
|
|
92
|
-
window.addEventListener('keydown', this.handleKeyDown);
|
|
92
|
+
window.addEventListener('keydown', this.handleKeyDown);
|
|
93
93
|
}
|
|
94
94
|
|
|
95
95
|
componentWillUnmount() {
|
|
@@ -98,7 +98,6 @@ export class NineExceptionHook extends React.Component {
|
|
|
98
98
|
window.removeEventListener('keydown', this.handleKeyDown);
|
|
99
99
|
}
|
|
100
100
|
|
|
101
|
-
// 실제 사용자가 키보드로 'Y' 또는 'y'를 누르면 마우스 클릭과 동일하게 관제탑 전송 실행
|
|
102
101
|
handleKeyDown(e) {
|
|
103
102
|
if (this.state.hasError && this.state.reportStatus === 'idle') {
|
|
104
103
|
if (e.key === 'y' || e.key === 'Y') {
|
|
@@ -149,17 +148,17 @@ export class NineExceptionHook extends React.Component {
|
|
|
149
148
|
style: { ...NineExceptionStyles.container, ...customStyles.container, ...this.props.containerStyle }
|
|
150
149
|
},
|
|
151
150
|
|
|
152
|
-
// 1. 에러 감지
|
|
151
|
+
// 1. 에러 감지 로그
|
|
153
152
|
React.createElement(
|
|
154
153
|
'div',
|
|
155
154
|
{ style: { ...NineExceptionStyles.systemError, ...customStyles.systemError } },
|
|
156
155
|
'[SYSTEM] COMPONENT RENDER ERROR DETECTED'
|
|
157
156
|
),
|
|
158
157
|
|
|
159
|
-
// 2. 에러
|
|
158
|
+
// 2. 에러 내용 (하단 마진을 줄여 다음 줄과 간격을 맞춤)
|
|
160
159
|
React.createElement('pre', { style: { ...NineExceptionStyles.pre, ...customStyles.pre } }, errorMessage),
|
|
161
160
|
|
|
162
|
-
// 3. CLI
|
|
161
|
+
// 3. CLI 프롬프트 및 링크 영역
|
|
163
162
|
React.createElement(
|
|
164
163
|
'div',
|
|
165
164
|
{ style: { ...NineExceptionStyles.footer, ...customStyles.footer } },
|
|
@@ -167,15 +166,16 @@ export class NineExceptionHook extends React.Component {
|
|
|
167
166
|
this.state.reportStatus === 'idle' && React.createElement(
|
|
168
167
|
'div',
|
|
169
168
|
{ style: NineExceptionStyles.promptRow },
|
|
170
|
-
React.createElement('span', null, 'Send error log to Control Tower (
|
|
169
|
+
React.createElement('span', null, 'Send error log to Control Tower ('),
|
|
171
170
|
React.createElement(
|
|
172
171
|
'button',
|
|
173
172
|
{
|
|
174
|
-
style: { ...NineExceptionStyles.
|
|
173
|
+
style: { ...NineExceptionStyles.cliLink, ...customStyles.cliLink },
|
|
175
174
|
onClick: this.handleReport
|
|
176
175
|
},
|
|
177
|
-
'
|
|
178
|
-
)
|
|
176
|
+
'y'
|
|
177
|
+
),
|
|
178
|
+
React.createElement('span', null, '/n)?')
|
|
179
179
|
),
|
|
180
180
|
|
|
181
181
|
this.state.reportStatus === 'sending' && React.createElement(
|