palette-mcp 1.1.0 → 1.1.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/services/code-generator.d.ts +1 -0
- package/dist/services/code-generator.js +14 -1
- package/package.json +17 -4
- package/src/services/code-generator.ts +15 -1
- package/dist/components/OrderManagementGuide.d.ts +0 -6
- package/dist/components/OrderManagementGuide.js +0 -266
- package/dist/index-simple.d.ts +0 -2
- package/dist/index-simple.js +0 -139
- package/dist/requests/1762927928451-ajgna9b/SomaComponent.html +0 -63
- package/dist/requests/1762927928451-ajgna9b/SomaComponent.tsx +0 -913
- package/dist/requests/1762927928451-ajgna9b/metadata.json +0 -9
- package/dist/requests/1762931214963-cqlwvxn/SomaComponent.html +0 -63
- package/dist/requests/1762931214963-cqlwvxn/SomaComponent.tsx +0 -525
- package/dist/requests/1762931214963-cqlwvxn/metadata.json +0 -9
- package/dist/requests/1762932805663-m5wkk3a/SomaComponent.html +0 -248
- package/dist/requests/1762932805663-m5wkk3a/SomaComponent.tsx +0 -1050
- package/dist/requests/1762932805663-m5wkk3a/metadata.json +0 -9
- package/dist/requests/1762934645710-b67ldow/SomaComponent.html +0 -193
- package/dist/requests/1762934645710-b67ldow/SomaComponent.tsx +0 -307
- package/dist/requests/1762934645710-b67ldow/metadata.json +0 -9
- package/dist/requests/1762934961257-wwnmpvx/SomaComponent.html +0 -193
- package/dist/requests/1762934961257-wwnmpvx/SomaComponent.tsx +0 -932
- package/dist/requests/1762934961257-wwnmpvx/metadata.json +0 -9
- package/dist/requests/1762935126549-yjdcezr/SomaComponent.html +0 -193
- package/dist/requests/1762935126549-yjdcezr/SomaComponent.tsx +0 -847
- package/dist/requests/1762935126549-yjdcezr/metadata.json +0 -9
- package/dist/requests/1762935353759-fuokdeu/SomaComponent.html +0 -193
- package/dist/requests/1762935353759-fuokdeu/SomaComponent.tsx +0 -334
- package/dist/requests/1762935353759-fuokdeu/metadata.json +0 -9
- package/dist/requests/1762935378891-ckwbabn/SomaComponent.html +0 -193
- package/dist/requests/1762935378891-ckwbabn/SomaComponent.tsx +0 -256
- package/dist/requests/1762935378891-ckwbabn/metadata.json +0 -9
- package/dist/requests/1762935418352-181zqu4/SomaComponent.html +0 -193
- package/dist/requests/1762935418352-181zqu4/SomaComponent.tsx +0 -45
- package/dist/requests/1762935418352-181zqu4/metadata.json +0 -9
- package/dist/requests/1762935438157-vzkcbwy/SomaComponent.html +0 -193
- package/dist/requests/1762935438157-vzkcbwy/SomaComponent.tsx +0 -238
- package/dist/requests/1762935438157-vzkcbwy/metadata.json +0 -9
- package/dist/requests/1762935529749-ukzmiu3/SomaComponent.html +0 -193
- package/dist/requests/1762935529749-ukzmiu3/SomaComponent.tsx +0 -138
- package/dist/requests/1762935529749-ukzmiu3/metadata.json +0 -9
- package/dist/requests/1762935556527-jxelwj4/SomaComponent.html +0 -193
- package/dist/requests/1762935556527-jxelwj4/SomaComponent.tsx +0 -138
- package/dist/requests/1762935556527-jxelwj4/metadata.json +0 -9
- package/dist/requests/1762935579673-g39fqly/SomaComponent.html +0 -193
- package/dist/requests/1762935579673-g39fqly/SomaComponent.tsx +0 -138
- package/dist/requests/1762935579673-g39fqly/metadata.json +0 -9
- package/dist/requests/1762935613556-ogvsekd/SomaComponent.html +0 -193
- package/dist/requests/1762935613556-ogvsekd/SomaComponent.tsx +0 -150
- package/dist/requests/1762935613556-ogvsekd/metadata.json +0 -9
- package/dist/requests/1762935943631-hb2drgf/SomaComponent.html +0 -193
- package/dist/requests/1762935943631-hb2drgf/SomaComponent.tsx +0 -150
- package/dist/requests/1762935943631-hb2drgf/metadata.json +0 -9
- package/dist/requests/1762935954110-m7jb9m7/SomaComponent.html +0 -193
- package/dist/requests/1762935954110-m7jb9m7/SomaComponent.tsx +0 -150
- package/dist/requests/1762935954110-m7jb9m7/metadata.json +0 -9
- package/dist/requests/1762936003095-0jnmlga/SomaComponent.html +0 -193
- package/dist/requests/1762936003095-0jnmlga/SomaComponent.tsx +0 -150
- package/dist/requests/1762936003095-0jnmlga/metadata.json +0 -9
- package/dist/requests/1762937044748-7ubrrua/SomaComponent.html +0 -193
- package/dist/requests/1762937044748-7ubrrua/SomaComponent.tsx +0 -138
- package/dist/requests/1762937044748-7ubrrua/metadata.json +0 -9
- package/dist/test-figma-tools.d.ts +0 -2
- package/dist/test-figma-tools.js +0 -55
- package/dist/test-mcp-servers.d.ts +0 -2
- package/dist/test-mcp-servers.js +0 -166
- package/dist/test.d.ts +0 -2
- package/dist/test.js +0 -76
- package/src/components/OrderManagementGuide.tsx +0 -459
- package/src/test-figma-tools.ts +0 -72
- package/src/test-mcp-servers.ts +0 -180
- package/src/test.ts +0 -89
|
@@ -1,248 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="ko">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>SomaComponent - Preview</title>
|
|
7
|
-
<script crossorigin src="https://unpkg.com/react@19/umd/react.production.min.js" onload="window.reactLoaded = true"></script>
|
|
8
|
-
<script crossorigin src="https://unpkg.com/react-dom@19/umd/react-dom.production.min.js" onload="window.reactDomLoaded = true"></script>
|
|
9
|
-
<script src="https://unpkg.com/@babel/standalone/babel.min.js" onload="window.babelLoaded = true"></script>
|
|
10
|
-
<style>
|
|
11
|
-
body {
|
|
12
|
-
margin: 0;
|
|
13
|
-
padding: 20px;
|
|
14
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
|
|
15
|
-
background-color: #f5f5f5;
|
|
16
|
-
}
|
|
17
|
-
.container {
|
|
18
|
-
max-width: 1200px;
|
|
19
|
-
margin: 0 auto;
|
|
20
|
-
background: white;
|
|
21
|
-
padding: 20px;
|
|
22
|
-
border-radius: 8px;
|
|
23
|
-
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
|
24
|
-
}
|
|
25
|
-
.preview {
|
|
26
|
-
margin-top: 30px;
|
|
27
|
-
padding: 20px;
|
|
28
|
-
border: 2px dashed #dee2e6;
|
|
29
|
-
border-radius: 4px;
|
|
30
|
-
background: #fff;
|
|
31
|
-
min-height: 200px;
|
|
32
|
-
}
|
|
33
|
-
.error {
|
|
34
|
-
color: red;
|
|
35
|
-
padding: 10px;
|
|
36
|
-
background: #ffe6e6;
|
|
37
|
-
border: 1px solid #ff9999;
|
|
38
|
-
border-radius: 4px;
|
|
39
|
-
margin: 10px 0;
|
|
40
|
-
}
|
|
41
|
-
</style>
|
|
42
|
-
</head>
|
|
43
|
-
<body>
|
|
44
|
-
<div class="container">
|
|
45
|
-
<h1>SomaComponent - React 컴포넌트 미리보기</h1>
|
|
46
|
-
<div class="preview">
|
|
47
|
-
<div id="root"></div>
|
|
48
|
-
</div>
|
|
49
|
-
</div>
|
|
50
|
-
<script type="text/babel">
|
|
51
|
-
// React와 ReactDOM이 로드될 때까지 기다림
|
|
52
|
-
function initApp() {
|
|
53
|
-
// 모든 스크립트가 로드되었는지 확인
|
|
54
|
-
if (typeof React === 'undefined' || typeof ReactDOM === 'undefined' || typeof Babel === 'undefined') {
|
|
55
|
-
setTimeout(initApp, 100);
|
|
56
|
-
return;
|
|
57
|
-
}
|
|
58
|
-
// 모의 Design System 컴포넌트 정의
|
|
59
|
-
const Button = ({ children, size, ...props }) => {
|
|
60
|
-
const sizeStyle = size === 'small' ? { padding: '4px 8px', fontSize: '12px' } :
|
|
61
|
-
size === 'large' ? { padding: '12px 24px', fontSize: '16px' } :
|
|
62
|
-
{ padding: '8px 16px', fontSize: '14px' };
|
|
63
|
-
return React.createElement('button', {
|
|
64
|
-
style: { ...sizeStyle, background: '#007bff', color: 'white', border: 'none', borderRadius: '4px', cursor: 'pointer', margin: '2px' },
|
|
65
|
-
...props
|
|
66
|
-
}, children);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
const LayerPopup = ({ children, isOpen, onClose, ...props }) => {
|
|
70
|
-
if (isOpen === false) return null;
|
|
71
|
-
return React.createElement('div', {
|
|
72
|
-
style: { position: 'relative', background: 'white', padding: '20px', borderRadius: '8px', margin: '4px' },
|
|
73
|
-
...props
|
|
74
|
-
}, children);
|
|
75
|
-
};
|
|
76
|
-
|
|
77
|
-
const Tab = ({ children, tabs, activeTab, onTabChange, ...props }) => {
|
|
78
|
-
return React.createElement('div', { style: { borderBottom: '1px solid #ddd', margin: '4px 0' }, ...props }, children);
|
|
79
|
-
};
|
|
80
|
-
|
|
81
|
-
const Text = ({ children, variant, size, ...props }) => {
|
|
82
|
-
const style = {
|
|
83
|
-
fontSize: size === 'small' ? '12px' : size === 'large' ? '18px' : '14px',
|
|
84
|
-
fontWeight: variant === 'heading' ? 'bold' : 'normal',
|
|
85
|
-
display: 'inline-block',
|
|
86
|
-
margin: '2px'
|
|
87
|
-
};
|
|
88
|
-
return React.createElement('span', { style, ...props }, children);
|
|
89
|
-
};
|
|
90
|
-
|
|
91
|
-
const LabeledText = ({ label, value, children, ...props }) => {
|
|
92
|
-
return React.createElement('div', { style: { margin: '4px 0' }, ...props },
|
|
93
|
-
React.createElement('span', { style: { fontWeight: 'bold', marginRight: '8px' } }, label || ''),
|
|
94
|
-
React.createElement('span', {}, value || children || '')
|
|
95
|
-
);
|
|
96
|
-
};
|
|
97
|
-
|
|
98
|
-
const Input = ({ placeholder, value, onChange, ...props }) => {
|
|
99
|
-
return React.createElement('input', {
|
|
100
|
-
type: 'text',
|
|
101
|
-
placeholder: placeholder || '',
|
|
102
|
-
value: value || '',
|
|
103
|
-
onChange: onChange || (() => {}),
|
|
104
|
-
style: { padding: '8px', border: '1px solid #ddd', borderRadius: '4px', margin: '4px', width: '200px' },
|
|
105
|
-
...props
|
|
106
|
-
});
|
|
107
|
-
};
|
|
108
|
-
|
|
109
|
-
const Chip = ({ children, variant, size, onDelete, ...props }) => {
|
|
110
|
-
return React.createElement('span', {
|
|
111
|
-
style: {
|
|
112
|
-
display: 'inline-block',
|
|
113
|
-
padding: '4px 8px',
|
|
114
|
-
background: variant === 'filled' ? '#007bff' : '#f0f0f0',
|
|
115
|
-
color: variant === 'filled' ? 'white' : 'black',
|
|
116
|
-
borderRadius: '16px',
|
|
117
|
-
margin: '2px',
|
|
118
|
-
fontSize: size === 'small' ? '12px' : '14px'
|
|
119
|
-
},
|
|
120
|
-
...props
|
|
121
|
-
}, children, onDelete && React.createElement('button', {
|
|
122
|
-
onClick: onDelete,
|
|
123
|
-
style: { marginLeft: '8px', background: 'none', border: 'none', cursor: 'pointer' }
|
|
124
|
-
}, '×'));
|
|
125
|
-
};
|
|
126
|
-
|
|
127
|
-
const Switch = ({ checked, onChange, label, children, ...props }) => {
|
|
128
|
-
return React.createElement('label', { style: { display: 'flex', alignItems: 'center', margin: '4px' }, ...props },
|
|
129
|
-
React.createElement('input', {
|
|
130
|
-
type: 'checkbox',
|
|
131
|
-
checked: checked || false,
|
|
132
|
-
onChange: onChange || (() => {}),
|
|
133
|
-
style: { marginRight: '8px' }
|
|
134
|
-
}),
|
|
135
|
-
(label || children) && React.createElement('span', {}, label || children)
|
|
136
|
-
);
|
|
137
|
-
};
|
|
138
|
-
|
|
139
|
-
const ArrowPagination = ({ currentPage, totalPages, onPageChange, children, ...props }) => {
|
|
140
|
-
return React.createElement('div', { style: { display: 'flex', alignItems: 'center', margin: '4px' }, ...props }, children);
|
|
141
|
-
};
|
|
142
|
-
|
|
143
|
-
const Accordion = ({ title, children, defaultExpanded, disabled, ...props }) => {
|
|
144
|
-
const [expanded, setExpanded] = React.useState(defaultExpanded || false);
|
|
145
|
-
if (disabled) return null;
|
|
146
|
-
return React.createElement('div', { style: { border: '1px solid #ddd', borderRadius: '4px', margin: '4px' }, ...props },
|
|
147
|
-
React.createElement('div', {
|
|
148
|
-
onClick: () => setExpanded(!expanded),
|
|
149
|
-
style: { padding: '8px', cursor: 'pointer', background: '#f5f5f5', fontWeight: 'bold' }
|
|
150
|
-
}, title || 'Accordion'),
|
|
151
|
-
expanded && React.createElement('div', { style: { padding: '8px' } }, children)
|
|
152
|
-
);
|
|
153
|
-
};
|
|
154
|
-
|
|
155
|
-
// 컴포넌트 코드 정리 및 수정
|
|
156
|
-
const originalCode = `
|
|
157
|
-
const SomaComponent = (props) => {
|
|
158
|
-
return (
|
|
159
|
-
<div className="document-0:0">
|
|
160
|
-
<div style={{ padding: '20px' }}>
|
|
161
|
-
<h2>필터</h2>
|
|
162
|
-
<div style={{ marginTop: '16px' }}>
|
|
163
|
-
<Button size="small">상품정보</Button>
|
|
164
|
-
<Button size="small">정렬</Button>
|
|
165
|
-
<Button size="small">카테고리</Button>
|
|
166
|
-
<Button size="small">색상</Button>
|
|
167
|
-
<Button size="small">스타일</Button>
|
|
168
|
-
<Button size="small">가격</Button>
|
|
169
|
-
<Button size="small">제조국</Button>
|
|
170
|
-
</div>
|
|
171
|
-
<div style={{ marginTop: '16px' }}>
|
|
172
|
-
<LabeledText label="상품정보" value="선택된 항목" />
|
|
173
|
-
<LabeledText label="정렬" value="기본순" />
|
|
174
|
-
<LabeledText label="카테고리" value="전체" />
|
|
175
|
-
</div>
|
|
176
|
-
<div style={{ marginTop: '16px' }}>
|
|
177
|
-
<Input placeholder="매장을 검색해주세요." />
|
|
178
|
-
<Button size="medium">검색</Button>
|
|
179
|
-
</div>
|
|
180
|
-
<div style={{ marginTop: '16px' }}>
|
|
181
|
-
<Chip>매장명</Chip>
|
|
182
|
-
<Chip>매장명</Chip>
|
|
183
|
-
<Chip>매장명</Chip>
|
|
184
|
-
</div>
|
|
185
|
-
<div style={{ marginTop: '16px' }}>
|
|
186
|
-
<Text>주문상태</Text>
|
|
187
|
-
<Chip>주문접수</Chip>
|
|
188
|
-
<Chip>주문확인</Chip>
|
|
189
|
-
<Chip>포장완료</Chip>
|
|
190
|
-
</div>
|
|
191
|
-
<div style={{ marginTop: '16px' }}>
|
|
192
|
-
<Text>기간</Text>
|
|
193
|
-
<Button size="small">3일</Button>
|
|
194
|
-
<Button size="small">1주일</Button>
|
|
195
|
-
<Button size="small">1개월</Button>
|
|
196
|
-
<Button size="small">3개월</Button>
|
|
197
|
-
</div>
|
|
198
|
-
<div style={{ marginTop: '16px' }}>
|
|
199
|
-
<Text>건물</Text>
|
|
200
|
-
<Switch label="가나다순" />
|
|
201
|
-
<Text>동대문</Text>
|
|
202
|
-
<Text>남대문</Text>
|
|
203
|
-
<Text>부산</Text>
|
|
204
|
-
</div>
|
|
205
|
-
<div style={{ marginTop: '16px' }}>
|
|
206
|
-
<Button size="medium">초기화</Button>
|
|
207
|
-
<Button size="medium">적용</Button>
|
|
208
|
-
</div>
|
|
209
|
-
</div>
|
|
210
|
-
</div>
|
|
211
|
-
);
|
|
212
|
-
};`;
|
|
213
|
-
|
|
214
|
-
try {
|
|
215
|
-
// React와 ReactDOM이 로드되었는지 확인
|
|
216
|
-
if (typeof React === 'undefined') {
|
|
217
|
-
throw new Error('React가 로드되지 않았습니다.');
|
|
218
|
-
}
|
|
219
|
-
if (typeof ReactDOM === 'undefined') {
|
|
220
|
-
throw new Error('ReactDOM이 로드되지 않았습니다.');
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
const transformedCode = Babel.transform(originalCode, { presets: ['react'] }).code;
|
|
224
|
-
eval(transformedCode);
|
|
225
|
-
|
|
226
|
-
const root = ReactDOM.createRoot(document.getElementById('root'));
|
|
227
|
-
root.render(React.createElement(SomaComponent, {}));
|
|
228
|
-
} catch (error) {
|
|
229
|
-
console.error('렌더링 오류:', error);
|
|
230
|
-
const errorDiv = document.getElementById('root');
|
|
231
|
-
if (errorDiv) {
|
|
232
|
-
errorDiv.innerHTML = '<div class="error"><strong>렌더링 오류:</strong><br>' +
|
|
233
|
-
error.message + '<br><br><strong>스택:</strong><br>' +
|
|
234
|
-
(error.stack || '스택 정보 없음') + '</div>';
|
|
235
|
-
}
|
|
236
|
-
}
|
|
237
|
-
}
|
|
238
|
-
|
|
239
|
-
// 페이지 로드 후 또는 스크립트 로드 후 초기화
|
|
240
|
-
if (document.readyState === 'loading') {
|
|
241
|
-
document.addEventListener('DOMContentLoaded', initApp);
|
|
242
|
-
} else {
|
|
243
|
-
// 이미 로드된 경우 즉시 실행
|
|
244
|
-
setTimeout(initApp, 100);
|
|
245
|
-
}
|
|
246
|
-
</script>
|
|
247
|
-
</body>
|
|
248
|
-
</html>
|