palette-mcp 1.1.0 → 1.1.1

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.
Files changed (69) hide show
  1. package/package.json +14 -3
  2. package/dist/components/OrderManagementGuide.d.ts +0 -6
  3. package/dist/components/OrderManagementGuide.js +0 -266
  4. package/dist/index-simple.d.ts +0 -2
  5. package/dist/index-simple.js +0 -139
  6. package/dist/requests/1762927928451-ajgna9b/SomaComponent.html +0 -63
  7. package/dist/requests/1762927928451-ajgna9b/SomaComponent.tsx +0 -913
  8. package/dist/requests/1762927928451-ajgna9b/metadata.json +0 -9
  9. package/dist/requests/1762931214963-cqlwvxn/SomaComponent.html +0 -63
  10. package/dist/requests/1762931214963-cqlwvxn/SomaComponent.tsx +0 -525
  11. package/dist/requests/1762931214963-cqlwvxn/metadata.json +0 -9
  12. package/dist/requests/1762932805663-m5wkk3a/SomaComponent.html +0 -248
  13. package/dist/requests/1762932805663-m5wkk3a/SomaComponent.tsx +0 -1050
  14. package/dist/requests/1762932805663-m5wkk3a/metadata.json +0 -9
  15. package/dist/requests/1762934645710-b67ldow/SomaComponent.html +0 -193
  16. package/dist/requests/1762934645710-b67ldow/SomaComponent.tsx +0 -307
  17. package/dist/requests/1762934645710-b67ldow/metadata.json +0 -9
  18. package/dist/requests/1762934961257-wwnmpvx/SomaComponent.html +0 -193
  19. package/dist/requests/1762934961257-wwnmpvx/SomaComponent.tsx +0 -932
  20. package/dist/requests/1762934961257-wwnmpvx/metadata.json +0 -9
  21. package/dist/requests/1762935126549-yjdcezr/SomaComponent.html +0 -193
  22. package/dist/requests/1762935126549-yjdcezr/SomaComponent.tsx +0 -847
  23. package/dist/requests/1762935126549-yjdcezr/metadata.json +0 -9
  24. package/dist/requests/1762935353759-fuokdeu/SomaComponent.html +0 -193
  25. package/dist/requests/1762935353759-fuokdeu/SomaComponent.tsx +0 -334
  26. package/dist/requests/1762935353759-fuokdeu/metadata.json +0 -9
  27. package/dist/requests/1762935378891-ckwbabn/SomaComponent.html +0 -193
  28. package/dist/requests/1762935378891-ckwbabn/SomaComponent.tsx +0 -256
  29. package/dist/requests/1762935378891-ckwbabn/metadata.json +0 -9
  30. package/dist/requests/1762935418352-181zqu4/SomaComponent.html +0 -193
  31. package/dist/requests/1762935418352-181zqu4/SomaComponent.tsx +0 -45
  32. package/dist/requests/1762935418352-181zqu4/metadata.json +0 -9
  33. package/dist/requests/1762935438157-vzkcbwy/SomaComponent.html +0 -193
  34. package/dist/requests/1762935438157-vzkcbwy/SomaComponent.tsx +0 -238
  35. package/dist/requests/1762935438157-vzkcbwy/metadata.json +0 -9
  36. package/dist/requests/1762935529749-ukzmiu3/SomaComponent.html +0 -193
  37. package/dist/requests/1762935529749-ukzmiu3/SomaComponent.tsx +0 -138
  38. package/dist/requests/1762935529749-ukzmiu3/metadata.json +0 -9
  39. package/dist/requests/1762935556527-jxelwj4/SomaComponent.html +0 -193
  40. package/dist/requests/1762935556527-jxelwj4/SomaComponent.tsx +0 -138
  41. package/dist/requests/1762935556527-jxelwj4/metadata.json +0 -9
  42. package/dist/requests/1762935579673-g39fqly/SomaComponent.html +0 -193
  43. package/dist/requests/1762935579673-g39fqly/SomaComponent.tsx +0 -138
  44. package/dist/requests/1762935579673-g39fqly/metadata.json +0 -9
  45. package/dist/requests/1762935613556-ogvsekd/SomaComponent.html +0 -193
  46. package/dist/requests/1762935613556-ogvsekd/SomaComponent.tsx +0 -150
  47. package/dist/requests/1762935613556-ogvsekd/metadata.json +0 -9
  48. package/dist/requests/1762935943631-hb2drgf/SomaComponent.html +0 -193
  49. package/dist/requests/1762935943631-hb2drgf/SomaComponent.tsx +0 -150
  50. package/dist/requests/1762935943631-hb2drgf/metadata.json +0 -9
  51. package/dist/requests/1762935954110-m7jb9m7/SomaComponent.html +0 -193
  52. package/dist/requests/1762935954110-m7jb9m7/SomaComponent.tsx +0 -150
  53. package/dist/requests/1762935954110-m7jb9m7/metadata.json +0 -9
  54. package/dist/requests/1762936003095-0jnmlga/SomaComponent.html +0 -193
  55. package/dist/requests/1762936003095-0jnmlga/SomaComponent.tsx +0 -150
  56. package/dist/requests/1762936003095-0jnmlga/metadata.json +0 -9
  57. package/dist/requests/1762937044748-7ubrrua/SomaComponent.html +0 -193
  58. package/dist/requests/1762937044748-7ubrrua/SomaComponent.tsx +0 -138
  59. package/dist/requests/1762937044748-7ubrrua/metadata.json +0 -9
  60. package/dist/test-figma-tools.d.ts +0 -2
  61. package/dist/test-figma-tools.js +0 -55
  62. package/dist/test-mcp-servers.d.ts +0 -2
  63. package/dist/test-mcp-servers.js +0 -166
  64. package/dist/test.d.ts +0 -2
  65. package/dist/test.js +0 -76
  66. package/src/components/OrderManagementGuide.tsx +0 -459
  67. package/src/test-figma-tools.ts +0 -72
  68. package/src/test-mcp-servers.ts +0 -180
  69. package/src/test.ts +0 -89
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "palette-mcp",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "MCP server for converting Figma designs to React/Vue components using design system",
5
5
  "main": "dist/index.js",
6
6
  "module": "src/smithery.ts",
@@ -10,8 +10,19 @@
10
10
  "palette-mcp": "./dist/index.js"
11
11
  },
12
12
  "files": [
13
- "dist/**/*",
14
- "src/**/*",
13
+ "dist/index.js",
14
+ "dist/index.d.ts",
15
+ "dist/server.js",
16
+ "dist/server.d.ts",
17
+ "dist/smithery.js",
18
+ "dist/smithery.d.ts",
19
+ "dist/services/**/*",
20
+ "dist/utils/**/*",
21
+ "src/index.ts",
22
+ "src/server.ts",
23
+ "src/smithery.ts",
24
+ "src/services/**/*",
25
+ "src/utils/**/*",
15
26
  "README.md",
16
27
  "LICENSE",
17
28
  "smithery.yaml"
@@ -1,6 +0,0 @@
1
- /**
2
- * 주문 관리 안내 컴포넌트
3
- * 주문관리 화면에서 매장주문을 더욱 쉽게 확인하고 관리할 수 있도록 안내하는 모달 컴포넌트
4
- * Design System 컴포넌트를 사용하여 구현
5
- */
6
- export default function OrderManagementGuide(): import("react/jsx-runtime").JSX.Element;
@@ -1,266 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import React from 'react';
3
- // Design System 컴포넌트 import
4
- import { Button } from '@dealicious/design-system-react/src/components/ssm-button';
5
- import { Check } from '@dealicious/design-system-react/src/components/ssm-check';
6
- import { Chip } from '@dealicious/design-system-react/src/components/ssm-chip';
7
- import { Tag } from '@dealicious/design-system-react/src/components/ssm-tag';
8
- import { Text } from '@dealicious/design-system-react/src/components/ssm-text';
9
- import { Icon } from '@dealicious/design-system-react/src/components/ssm-icon';
10
- // 이미지 상수 정의
11
- const imgComThumb80X80 = "http://localhost:3845/assets/a23a50ac4b0c21068425b9fbad7b10871c10708b.png";
12
- const imgComThumb80X81 = "http://localhost:3845/assets/e7dd647a3f3a4b3b8333554648daac78edc8f0a8.png";
13
- const imgComThumb80X82 = "http://localhost:3845/assets/428b26e10d3dccc7b39edb320853f5a5a9343bc7.png";
14
- const imgComThumb80X83 = "http://localhost:3845/assets/2d8cebb7a930eb4beb026cf183bb70f432d00fe8.png";
15
- const imgComThumb80X84 = "http://localhost:3845/assets/04789514f16aa28956a4a0c7d58b66d0ad9d03a6.png";
16
- const imgComThumb80X85 = "http://localhost:3845/assets/ec6280d9d0c6cf7bd10ca6ba39cf132d15790a08.png";
17
- const imgComThumb80X86 = "http://localhost:3845/assets/6006ff448e6770595c456de983e6af596bc9ecf2.png";
18
- const imgComThumb80X87 = "http://localhost:3845/assets/5c335464e980f216e60ce1339fc1da90325ddce8.png";
19
- const imgComThumb80X88 = "http://localhost:3845/assets/d06db60f0ce3d1a8a913812f3a977e24895e72ef.png";
20
- const imgComThumb80X89 = "http://localhost:3845/assets/cf9069016fa2f8e1515a0dbabfe7fd88cb5c1d5a.png";
21
- const imgComThumb80X90 = "http://localhost:3845/assets/fe4632a583f8225edd00b4ca191577b33eafbeff.png";
22
- const imgComThumb80X91 = "http://localhost:3845/assets/daf12b453c04aa7032b812bba199d0d9a71fae1f.png";
23
- const imgComThumb80X92 = "http://localhost:3845/assets/b226fd351bdd04b5dd222a331275c7cd2650b4a5.png";
24
- const img = "http://localhost:3845/assets/f6843e9d48c5f4efce619a1dd1a4ac585682c746.svg";
25
- const img1 = "http://localhost:3845/assets/cfdcad20a987a42a3a82975b10558672c6989679.svg";
26
- const img2 = "http://localhost:3845/assets/02fb25fdf55c3329cb12788dda06eb81c93a6c97.svg";
27
- const img3 = "http://localhost:3845/assets/a996cd8d306819476ae2b46cf48c5b05582487a0.svg";
28
- const img4 = "http://localhost:3845/assets/9fc03fee616256d57ccf3c58c9348e5a2995aeb2.svg";
29
- const img5 = "http://localhost:3845/assets/f9c30996c34ac82743f76638e5ffa7124a4fcac3.svg";
30
- const img6 = "http://localhost:3845/assets/2e89ee11cc0020affd12b24169b5a1c75f41b507.svg";
31
- /**
32
- * 주문 관리 안내 컴포넌트
33
- * 주문관리 화면에서 매장주문을 더욱 쉽게 확인하고 관리할 수 있도록 안내하는 모달 컴포넌트
34
- * Design System 컴포넌트를 사용하여 구현
35
- */
36
- export default function OrderManagementGuide() {
37
- const [dontShowAgain, setDontShowAgain] = React.useState(false);
38
- // 필터 옵션
39
- const orderStatusOptions = [
40
- { value: 'all', label: '전체' },
41
- { value: 'received', label: '주문접수' },
42
- { value: 'processing', label: '처리중' },
43
- { value: 'completed', label: '완료' },
44
- ];
45
- const periodOptions = [
46
- { value: '1month', label: '1개월' },
47
- { value: '3months', label: '3개월' },
48
- { value: '6months', label: '6개월' },
49
- { value: '1year', label: '1년' },
50
- ];
51
- return (_jsxs("div", { style: {
52
- backgroundColor: '#ffffff',
53
- display: 'flex',
54
- flexDirection: 'column',
55
- alignItems: 'flex-start',
56
- borderRadius: '10px',
57
- width: '100%',
58
- maxWidth: '360px'
59
- }, children: [_jsx("div", { style: {
60
- backgroundColor: '#ffffff',
61
- display: 'flex',
62
- gap: '16px',
63
- alignItems: 'center',
64
- padding: '20px',
65
- borderTopLeftRadius: '10px',
66
- borderTopRightRadius: '10px',
67
- width: '100%'
68
- }, children: _jsx(Text, { variant: "heading", size: "large", children: "\uC8FC\uBB38 \uAD00\uB9AC \uC548\uB0B4" }) }), _jsxs("div", { style: {
69
- display: 'flex',
70
- flexDirection: 'column',
71
- gap: '8px',
72
- alignItems: 'center',
73
- padding: '4px 16px 24px 16px',
74
- width: '100%'
75
- }, children: [_jsxs("div", { style: {
76
- display: 'flex',
77
- gap: '8px',
78
- alignItems: 'flex-start',
79
- width: '100%'
80
- }, children: [_jsx("div", { style: { height: '18px', width: '3px' }, children: _jsx("img", { alt: "", src: img, style: { width: '100%', height: '100%' } }) }), _jsx(Text, { variant: "body", size: "small", color: "#686e7b", children: "\uC8FC\uBB38\uAD00\uB9AC \uD654\uBA74\uC5D0\uC11C \uB9E4\uC7A5\uC8FC\uBB38\uC744 \uB354\uC6B1 \uC27D\uAC8C \uD655\uC778\uD558\uACE0 \uAD00\uB9AC\uD560 \uC218 \uC788\uC5B4\uC694." })] }), _jsx("div", { style: {
81
- backgroundColor: '#f5f6fb',
82
- display: 'flex',
83
- flexDirection: 'column',
84
- alignItems: 'center',
85
- justifyContent: 'center',
86
- padding: '16px 12px',
87
- borderRadius: '6px',
88
- width: '100%'
89
- }, children: _jsxs("div", { style: {
90
- backgroundColor: '#ffffff',
91
- display: 'flex',
92
- flexDirection: 'column',
93
- alignItems: 'center',
94
- borderRadius: '6px',
95
- width: '100%'
96
- }, children: [_jsxs("div", { style: {
97
- display: 'flex',
98
- flexDirection: 'column',
99
- alignItems: 'flex-start',
100
- width: '100%'
101
- }, children: [_jsxs("div", { style: {
102
- backgroundColor: '#ffffff',
103
- display: 'flex',
104
- flexDirection: 'column',
105
- alignItems: 'flex-start',
106
- width: '100%'
107
- }, children: [_jsxs("div", { style: {
108
- display: 'flex',
109
- gap: '2.5px',
110
- alignItems: 'center',
111
- padding: '7.5px 10px',
112
- width: '100%'
113
- }, children: [_jsxs("div", { style: {
114
- display: 'flex',
115
- gap: '2.5px',
116
- alignItems: 'center',
117
- flex: 1
118
- }, children: [_jsxs(Chip, { variant: "outlined", size: "small", children: ["\uC8FC\uBB38\uC0C1\uD0DC", _jsx(Icon, { name: "arrow-down", size: "small" })] }), _jsxs(Chip, { variant: "outlined", size: "small", children: ["3\uAC1C\uC6D4", _jsx(Icon, { name: "arrow-down", size: "small" })] })] }), _jsx(Chip, { variant: "outlined", size: "small", children: _jsx(Icon, { name: "filter", size: "small" }) })] }), _jsx("div", { style: {
119
- backgroundColor: '#ebeef6',
120
- height: '1px',
121
- width: '100%'
122
- } })] }), _jsxs("div", { style: {
123
- display: 'flex',
124
- gap: '5px',
125
- alignItems: 'flex-start',
126
- padding: '8.8px 9.4px',
127
- width: '100%'
128
- }, children: [_jsx(Text, { variant: "body", size: "small", children: "\uAC70\uB798\uC644\uB8CC \uC694\uCCAD" }), _jsx(Text, { variant: "heading", size: "small", children: "3" })] })] }), _jsxs("div", { style: {
129
- display: 'flex',
130
- flexDirection: 'column',
131
- alignItems: 'center',
132
- width: '100%'
133
- }, children: [_jsx("div", { style: {
134
- backgroundColor: '#ebeef6',
135
- height: '1px',
136
- width: '100%'
137
- } }), _jsxs("div", { style: {
138
- display: 'flex',
139
- flexDirection: 'column',
140
- gap: '10px',
141
- alignItems: 'flex-start',
142
- padding: '10px',
143
- width: '100%'
144
- }, children: [_jsxs("div", { style: {
145
- display: 'flex',
146
- flexDirection: 'column',
147
- gap: '7.5px',
148
- alignItems: 'flex-start',
149
- width: '100%'
150
- }, children: [_jsxs("div", { style: {
151
- display: 'flex',
152
- gap: '2.5px',
153
- alignItems: 'center'
154
- }, children: [_jsx(Tag, { variant: "error", size: "small", children: "\uC8FC\uBB38\uC811\uC218" }), _jsx(Tag, { variant: "default", size: "small", children: "\uC0AC\uC785\uC0AC \uBC29\uBB38" }), _jsx(Tag, { variant: "default", size: "small", children: "\uD604\uC7A5 \uACB0\uC81C" })] }), _jsxs("div", { style: {
155
- display: 'flex',
156
- gap: '7.5px',
157
- alignItems: 'center',
158
- width: '100%'
159
- }, children: [_jsx("div", { style: {
160
- border: '0.3px solid rgba(0,0,0,0.05)',
161
- borderRadius: '6px',
162
- width: '45px',
163
- height: '45px',
164
- position: 'relative'
165
- }, children: _jsx("img", { alt: "\uC0C1\uD488 \uC774\uBBF8\uC9C0", src: imgComThumb80X80, style: {
166
- width: '100%',
167
- height: '100%',
168
- objectFit: 'cover',
169
- borderRadius: '6px'
170
- } }) }), _jsxs("div", { style: {
171
- display: 'flex',
172
- flexDirection: 'column',
173
- gap: '5px',
174
- flex: 1
175
- }, children: [_jsxs("div", { style: {
176
- display: 'flex',
177
- flexDirection: 'column',
178
- gap: '1.3px'
179
- }, children: [_jsx(Text, { variant: "heading", size: "small", children: "\uC2E0\uC0C1\uD50C\uB798\uB2DB" }), _jsx(Text, { variant: "body", size: "small", color: "#686e7b", children: "\uBCA0\uC2A4\uD2B8 \uAC80\uC815 \uB2C8\uD2B8" })] }), _jsxs("div", { style: {
180
- display: 'flex',
181
- alignItems: 'center',
182
- gap: '2.5px'
183
- }, children: [_jsx(Text, { variant: "heading", size: "small", children: "\u20A930,000" }), _jsxs("div", { style: { display: 'flex', gap: '2.5px', alignItems: 'center' }, children: [_jsx("img", { alt: "", src: img4, style: { width: '16px', height: '16px' } }), _jsx("img", { alt: "", src: img5, style: { width: '16px', height: '16px' } })] })] })] })] })] }), _jsx(Button, { variant: "secondary", size: "medium", style: { width: '100%' }, children: "\uC8FC\uBB38\uCDE8\uC18C" })] }), _jsx("div", { style: {
184
- backgroundColor: '#ebeef6',
185
- height: '1px',
186
- width: '100%'
187
- } }), _jsx("div", { style: {
188
- display: 'flex',
189
- flexDirection: 'column',
190
- gap: '10px',
191
- alignItems: 'flex-start',
192
- padding: '10px',
193
- width: '100%'
194
- }, children: _jsxs("div", { style: {
195
- display: 'flex',
196
- flexDirection: 'column',
197
- gap: '7.5px',
198
- alignItems: 'flex-start',
199
- width: '100%'
200
- }, children: [_jsxs("div", { style: {
201
- display: 'flex',
202
- gap: '2.5px',
203
- alignItems: 'center'
204
- }, children: [_jsx(Tag, { variant: "warning", size: "small", children: "\uD3EC\uC7A5\uC644\uB8CC" }), _jsx(Tag, { variant: "default", size: "small", children: "\uC9C1\uC811 \uC218\uB839" }), _jsx(Tag, { variant: "default", size: "small", children: "\uD604\uC7A5 \uACB0\uC81C" })] }), _jsxs("div", { style: {
205
- display: 'flex',
206
- gap: '7.5px',
207
- alignItems: 'center',
208
- width: '100%'
209
- }, children: [_jsx("div", { style: {
210
- border: '0.3px solid rgba(0,0,0,0.05)',
211
- borderRadius: '6px',
212
- width: '45px',
213
- height: '45px',
214
- position: 'relative'
215
- }, children: _jsx("img", { alt: "\uC0C1\uD488 \uC774\uBBF8\uC9C0", src: imgComThumb80X80, style: {
216
- width: '100%',
217
- height: '100%',
218
- objectFit: 'cover',
219
- borderRadius: '6px'
220
- } }) }), _jsxs("div", { style: {
221
- display: 'flex',
222
- flexDirection: 'column',
223
- gap: '5px',
224
- flex: 1
225
- }, children: [_jsxs("div", { style: {
226
- display: 'flex',
227
- flexDirection: 'column',
228
- gap: '1.3px'
229
- }, children: [_jsxs("div", { style: { display: 'flex', gap: '2.5px', alignItems: 'center' }, children: [_jsx(Text, { variant: "heading", size: "small", children: "\uC2E0\uC0C1\uB7A9" }), _jsx("div", { style: {
230
- backgroundColor: '#fb4760',
231
- borderRadius: '11px',
232
- width: '6px',
233
- height: '6px',
234
- display: 'flex',
235
- alignItems: 'center',
236
- justifyContent: 'center'
237
- }, children: _jsx("img", { alt: "", src: img6, style: { width: '4px', height: '4px' } }) })] }), _jsx(Text, { variant: "body", size: "small", color: "#686e7b", children: "\uB370\uC77C\uB9AC \uD2F0\uC154\uCE20 \uC678 2\uAC74" })] }), _jsxs("div", { style: {
238
- display: 'flex',
239
- alignItems: 'center',
240
- gap: '2.5px'
241
- }, children: [_jsx(Text, { variant: "heading", size: "small", children: "\u20A956,000" }), _jsxs("div", { style: { display: 'flex', gap: '2.5px', alignItems: 'center' }, children: [_jsx("img", { alt: "", src: img4, style: { width: '16px', height: '16px' } }), _jsx("img", { alt: "", src: img5, style: { width: '16px', height: '16px' } })] })] })] })] })] }) })] })] }) }), _jsx("div", { style: {
242
- display: 'flex',
243
- gap: '4px',
244
- alignItems: 'flex-start',
245
- width: '100%'
246
- }, children: _jsx(Check, { checked: dontShowAgain, onChange: (checked) => setDontShowAgain(checked), label: "\uB2E4\uC2DC \uBCF4\uC9C0 \uC54A\uAE30" }) })] }), _jsxs("div", { style: {
247
- backgroundColor: '#ffffff',
248
- display: 'flex',
249
- flexDirection: 'column',
250
- alignItems: 'flex-start',
251
- borderBottomLeftRadius: '10px',
252
- borderBottomRightRadius: '10px',
253
- width: '100%'
254
- }, children: [_jsx("div", { style: {
255
- backgroundColor: '#ebeef6',
256
- height: '1px',
257
- width: '100%'
258
- } }), _jsx("div", { style: {
259
- display: 'flex',
260
- gap: '8px',
261
- alignItems: 'center',
262
- justifyContent: 'center',
263
- padding: '20px',
264
- width: '100%'
265
- }, children: _jsx(Button, { variant: "primary", size: "medium", style: { flex: 1 }, children: "\uD655\uC778" }) })] })] }));
266
- }
@@ -1,2 +0,0 @@
1
- #!/usr/bin/env node
2
- export {};
@@ -1,139 +0,0 @@
1
- #!/usr/bin/env node
2
- import { Server } from '@modelcontextprotocol/sdk/server/index.js';
3
- import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
4
- import { CallToolRequestSchema, ListToolsRequestSchema, } from '@modelcontextprotocol/sdk/types.js';
5
- // MCP 서버 초기화
6
- const server = new Server({
7
- name: 'palette',
8
- version: '1.0.0',
9
- });
10
- // 사용 가능한 도구 목록
11
- const tools = [
12
- {
13
- name: 'convert_figma_to_react',
14
- description: 'Convert Figma design to React component using existing design system',
15
- inputSchema: {
16
- type: 'object',
17
- properties: {
18
- figmaUrl: {
19
- type: 'string',
20
- description: 'Figma file URL or file ID',
21
- },
22
- componentName: {
23
- type: 'string',
24
- description: 'Name for the generated component',
25
- },
26
- },
27
- required: ['figmaUrl', 'componentName'],
28
- },
29
- },
30
- {
31
- name: 'convert_figma_to_vue',
32
- description: 'Convert Figma design to Vue component using existing design system',
33
- inputSchema: {
34
- type: 'object',
35
- properties: {
36
- figmaUrl: {
37
- type: 'string',
38
- description: 'Figma file URL or file ID',
39
- },
40
- componentName: {
41
- type: 'string',
42
- description: 'Name for the generated component',
43
- },
44
- },
45
- required: ['figmaUrl', 'componentName'],
46
- },
47
- },
48
- ];
49
- // 도구 목록 핸들러
50
- server.setRequestHandler(ListToolsRequestSchema, async () => {
51
- return { tools };
52
- });
53
- // 도구 실행 핸들러
54
- server.setRequestHandler(CallToolRequestSchema, async (request) => {
55
- const { name, arguments: args } = request.params;
56
- try {
57
- switch (name) {
58
- case 'convert_figma_to_react': {
59
- const { figmaUrl, componentName } = args;
60
- // 간단한 React 컴포넌트 생성
61
- const reactCode = `import React from 'react';
62
-
63
- interface ${componentName}Props {
64
- // Add your props here
65
- }
66
-
67
- const ${componentName}: React.FC<${componentName}Props> = (props) => {
68
- return (
69
- <div className="${componentName.toLowerCase()}">
70
- <h1>Generated from Figma: ${figmaUrl}</h1>
71
- <p>This component was generated from your Figma design.</p>
72
- </div>
73
- );
74
- };
75
-
76
- export default ${componentName};`;
77
- return {
78
- content: [
79
- {
80
- type: 'text',
81
- text: `# React Component Generated\n\n\`\`\`tsx\n${reactCode}\n\`\`\``,
82
- },
83
- ],
84
- };
85
- }
86
- case 'convert_figma_to_vue': {
87
- const { figmaUrl, componentName } = args;
88
- // 간단한 Vue 컴포넌트 생성
89
- const vueCode = `<template>
90
- <div class="${componentName.toLowerCase()}">
91
- <h1>Generated from Figma: ${figmaUrl}</h1>
92
- <p>This component was generated from your Figma design.</p>
93
- </div>
94
- </template>
95
-
96
- <script setup lang="ts">
97
- // Add your reactive data and methods here
98
- </script>
99
-
100
- <style scoped>
101
- .${componentName.toLowerCase()} {
102
- /* Add your styles here */
103
- }
104
- </style>`;
105
- return {
106
- content: [
107
- {
108
- type: 'text',
109
- text: `# Vue Component Generated\n\n\`\`\`vue\n${vueCode}\n\`\`\``,
110
- },
111
- ],
112
- };
113
- }
114
- default:
115
- throw new Error(`Unknown tool: ${name}`);
116
- }
117
- }
118
- catch (error) {
119
- return {
120
- content: [
121
- {
122
- type: 'text',
123
- text: `Error: ${error instanceof Error ? error.message : 'Unknown error'}`,
124
- },
125
- ],
126
- isError: true,
127
- };
128
- }
129
- });
130
- // 서버 시작
131
- async function main() {
132
- const transport = new StdioServerTransport();
133
- await server.connect(transport);
134
- console.error('Palette server running on stdio');
135
- }
136
- main().catch((error) => {
137
- console.error('Server error:', error);
138
- process.exit(1);
139
- });
@@ -1,63 +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"></script>
8
- <script crossorigin src="https://unpkg.com/react-dom@19/umd/react-dom.production.min.js"></script>
9
- <script src="https://unpkg.com/@babel/standalone/babel.min.js"></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
- }
32
- </style>
33
- </head>
34
- <body>
35
- <div class="container">
36
- <h1>SomaComponent - React 컴포넌트 미리보기</h1>
37
- <div class="preview">
38
- <div id="root"></div>
39
- </div>
40
- </div>
41
- <script type="text/babel">
42
- // 모의 Design System 컴포넌트는 여기에 추가됩니다
43
- // 실제 Design System 패키지 설치가 필요합니다
44
-
45
- const cleanCode = "// Design System Components from GitHub:\n// React: https://github.com/dealicious-inc/ssm-web/tree/master/packages/design-system-react\n// Vue: https://github.com/dealicious-inc/ssm-web/tree/master/packages/design-system\n// \n// To use these components, install the packages:\n// npm install @dealicious/design-system-react @dealicious/design-system\n// or\n// yarn add @dealicious/design-system-react @dealicious/design-system\n\nimport { Button } from '@dealicious/design-system-react/src/components/ssm-button';\nimport { LabeledText } from '@dealicious/design-system-react/src/components/ssm-labeled-text';\nimport { Tab } from '@dealicious/design-system-react/src/components/ssm-tab';\nimport { Text } from '@dealicious/design-system-react/src/components/ssm-text';\nimport { Badge } from '@dealicious/design-system-react/src/components/ssm-badge';\nimport { Chip } from '@dealicious/design-system-react/src/components/ssm-chip';\nimport { Icon } from '@dealicious/design-system-react/src/components/ssm-icon';\nimport { Tag } from '@dealicious/design-system-react/src/components/ssm-tag';\nimport { TextLink } from '@dealicious/design-system-react/src/components/ssm-text-link';\nimport { Check } from '@dealicious/design-system-react/src/components/ssm-check';\nimport { Accordion } from '@dealicious/design-system-react/src/components/ssm-accordion';\n\nimport React from 'react';\n\ninterface SomaComponentProps {\n // Add your props here\n}\n\nconst SomaComponent: React.FC<SomaComponentProps> = (props) => {\n return (\n <div className=\"document-0:0\">\n <Button>\n <Button>\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button >주문 관리 안내 size=\"small\">\n 주문 관리 안내\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button size=\"large\">\n <LabeledText>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n </Button>\n <Button >주문관리 화면에서 매장주문을 더욱 쉽게 확인하고 관리할 수 있어요. size=\"medium\">\n 주문관리 화면에서 매장주문을 더욱 쉽게 확인하고 관리할 수 있어요.\n </Button>\n </LabeledText>\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button >{도매 매장명} 거래내역 size=\"small\">\n {도매 매장명} 거래내역\n </Button>\n </Button>\n <Button size=\"small\">\n <Tab>\n <Text>\n <Button size=\"small\">\n <LabeledText>\n 매장주문\n </LabeledText>\n <Button size=\"small\">\n </Button>\n </Button>\n </Text>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Tab>\n <Tab>\n <Tab>\n <Button size=\"small\">\n <LabeledText>\n 신상배송\n </LabeledText>\n <Button size=\"small\">\n </Button>\n </Button>\n </Tab>\n <Button size=\"small\">\n </Button>\n </Tab>\n <Tab>\n <Tab>\n <Button size=\"small\">\n <LabeledText>\n 주문닷컴\n </LabeledText>\n <Button size=\"small\">\n </Button>\n </Button>\n </Tab>\n <Button size=\"small\">\n </Button>\n </Tab>\n <Button size=\"small\">\n <Tab>\n <Button size=\"small\">\n <LabeledText>\n Text\n </LabeledText>\n <Button size=\"small\">\n </Button>\n </Button>\n </Tab>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Tab>\n <Button size=\"small\">\n <LabeledText>\n Text\n </LabeledText>\n <Badge>\n </Badge>\n </Button>\n </Tab>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Tab>\n <Button size=\"small\">\n <LabeledText>\n Text\n </LabeledText>\n <Badge>\n </Badge>\n </Button>\n </Tab>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button size=\"medium\">\n <Chip>\n <Chip>\n <Button size=\"small\">\n <Chip>\n 매장\n </Chip>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n <Chip>\n <Chip>\n 주문상태\n </Chip>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Chip>\n <Chip>\n <Chip>\n 3개월\n </Chip>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Chip>\n <Button size=\"small\">\n <Chip>\n 건물\n </Chip>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Chip>\n <Button size=\"medium\">\n </Button>\n <Button size=\"small\">\n <Chip>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Chip>\n <Button size=\"small\">\n <Badge>\n 99\n </Badge>\n </Button>\n </Button>\n </Chip>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button >거래완료 요청 size=\"small\">\n 거래완료 요청\n </Button>\n <Button >3 size=\"small\">\n 3\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button >신상배송 이용 안내 size=\"small\">\n 신상배송 이용 안내\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Icon>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Icon>\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Text>\n 전체읽음\n </Text>\n </Button>\n </Button>\n </Button>\n <Button size=\"large\">\n <Button size=\"small\">\n </Button>\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Tag>\n <Button size=\"small\">\n <Tag>\n <Button size=\"small\">\n <Tag>\n <Button >주문접수 size=\"small\">\n 주문접수\n </Button>\n </Tag>\n <Tag>\n <Button >사입사 방문 size=\"small\">\n 사입사 방문\n </Button>\n </Tag>\n <Tag>\n <Button >현장 결제 size=\"small\">\n 현장 결제\n </Button>\n </Tag>\n </Button>\n </Tag>\n </Button>\n <Button size=\"small\">\n <Button >20250104900639 size=\"small\">\n 20250104900639\n </Button>\n <Button size=\"small\">\n <TextLink>\n <Text>\n 주문서 보기\n </Text>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </TextLink>\n </Button>\n </Button>\n </Tag>\n <Button size=\"medium\">\n <Button size=\"medium\">\n </Button>\n <Button size=\"medium\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button >신상플래닛 size=\"small\">\n 신상플래닛\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Icon>\n <Button size=\"small\">\n </Button>\n </Icon>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button >일본 size=\"small\">\n 일본 \n </Button>\n </Button>\n </Button>\n </Button>\n <Button >베스트 검정 니트 size=\"small\">\n 베스트 검정 니트\n </Button>\n </Button>\n <Button size=\"small\">\n <Button >₩30,000 size=\"small\">\n ₩30,000\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button >12 size=\"small\">\n 12\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n <TextLink>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button >12 size=\"small\">\n 12\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </TextLink>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button >주문취소 size=\"small\">\n 주문취소\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button >배송조회 size=\"small\">\n 배송조회\n </Button>\n </Button>\n <Button size=\"large\">\n </Button>\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"large\">\n <Button size=\"large\">\n <Tag>\n <Button size=\"small\">\n <Tag>\n <Button size=\"small\">\n <Tag>\n <Button >포장완료 size=\"small\">\n 포장완료\n </Button>\n </Tag>\n <Tag>\n <Button >직접 수령 size=\"small\">\n 직접 수령\n </Button>\n </Tag>\n <Tag>\n <Button >현장 결제 size=\"small\">\n 현장 결제\n </Button>\n </Tag>\n </Button>\n <Button size=\"small\">\n <TextLink>\n <Text>\n 주문서 보기\n </Text>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </TextLink>\n </Button>\n </Tag>\n </Button>\n </Tag>\n <Button size=\"medium\">\n <Button size=\"medium\">\n </Button>\n <Button size=\"medium\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button >신상랩 size=\"small\">\n 신상랩\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Icon>\n <Button size=\"small\">\n </Button>\n </Icon>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button >일본 size=\"small\">\n 일본 \n </Button>\n </Button>\n </Button>\n </Button>\n <Button >데일리 티셔츠 외 2건 size=\"small\">\n 데일리 티셔츠 외 2건\n </Button>\n </Button>\n <Button size=\"small\">\n <Button >₩56,000 size=\"small\">\n ₩56,000\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button >0 size=\"small\">\n 0\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n <TextLink>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button >12 size=\"small\">\n 12\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n </TextLink>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Button>\n <Button >배송조회 size=\"small\">\n 배송조회\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Check>\n <Check>\n <Check>\n <Button size=\"small\">\n </Button>\n </Check>\n </Check>\n <Text>\n <Text>\n 다시 보지 않기\n </Text>\n </Text>\n </Check>\n </Button>\n <Button size=\"large\">\n <Button size=\"small\">\n </Button>\n <Button size=\"large\">\n <Button size=\"medium\">\n <Button >확인 size=\"small\">\n 확인\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"large\">\n <Button size=\"medium\">\n <Button size=\"small\">\n <Button >거래완료 요청 size=\"small\">\n 거래완료 요청\n </Button>\n <Button >3 size=\"small\">\n 3\n </Button>\n </Button>\n <Button size=\"medium\">\n <Button size=\"medium\">\n </Button>\n <Button >신상배송 이용 안내 size=\"medium\">\n 신상배송 이용 안내\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Icon>\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n <Button size=\"small\">\n </Button>\n <Button size=\"small\">\n </Button>\n </Button>\n </Icon>\n </Button>\n </Button>\n </Button>\n <Button size=\"small\">\n <Text>\n 전체읽음\n </Text>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n </Button>\n <Button>\n </Button>\n <Button>\n </Button>\n <Accordion>\n </Accordion>\n <Button>\n </Button>\n <Button>\n </Button>\n <Button>\n </Button>\n <Tab>\n </Tab>\n <Tab>\n </Tab>\n <Button>\n </Button>\n <Button>\n </Button>\n <Button>\n </Button>\n <Button>\n </Button>\n <Button>\n </Button>\n <Accordion>\n </Accordion>\n </Button>\n </div>\n );\n};\n\nexport default SomaComponent;\n"
46
- .replace(/import[^;]+;/g, '')
47
- .replace(///[^\n]*/g, '')
48
- .replace(/interface[^\{]*\{[^\}]*\}/g, '')
49
- .replace(/React\.FC<[^>]*>/g, '')
50
- .replace(/export default SomaComponent;/g, '')
51
- .replace(new RegExp(`const SomaComponent:.*?=`, 'g'), `const SomaComponent = `);
52
-
53
- try {
54
- const transformedCode = Babel.transform(cleanCode, { presets: ['react'] }).code;
55
- eval(transformedCode);
56
- const root = ReactDOM.createRoot(document.getElementById('root'));
57
- root.render(React.createElement(SomaComponent, {}));
58
- } catch (error) {
59
- document.getElementById('root').innerHTML = '<p style="color: red;">렌더링 오류: ' + error.message + '</p>';
60
- }
61
- </script>
62
- </body>
63
- </html>