pds-dev-kit-web 1.4.7 → 1.4.10

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 (24) hide show
  1. package/dist/src/common/styles/ToneTest/ToneTest.d.ts +3 -0
  2. package/dist/src/common/styles/ToneTest/ToneTest.js +395 -0
  3. package/dist/src/common/styles/ToneTest/index.d.ts +1 -0
  4. package/dist/src/common/styles/ToneTest/index.js +8 -0
  5. package/dist/src/common/styles/theme.d.ts +2 -0
  6. package/dist/src/common/styles/theme.js +3 -1
  7. package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js +1 -1
  8. package/dist/src/desktop/components/DynamicDesktopNavBar/types.d.ts +1 -1
  9. package/dist/src/desktop/components/IconButton/IconButton.js +2 -7
  10. package/dist/src/desktop/components/TextLabel/TextLabel.js +2 -4
  11. package/dist/src/desktop/components/UploadIconButton/UploadIconButton.js +2 -7
  12. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.d.ts +1 -1
  13. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.js +2 -1
  14. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.d.ts +1 -1
  15. package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.js +29 -5
  16. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.d.ts +1 -1
  17. package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.js +8 -4
  18. package/dist/src/hybrid/components/Icon/Icon.js +3 -2
  19. package/dist/src/mobile/common/components/TextFieldBase/TextFieldBase.js +1 -1
  20. package/dist/src/mobile/components/IconButton/IconButton.js +2 -7
  21. package/dist/src/mobile/components/TextLabel/TextLabel.js +2 -4
  22. package/dist/src/mobile/components/UploadIconButton/UploadIconButton.js +2 -7
  23. package/package.json +1 -1
  24. package/release-note.md +13 -9
package/dist/src/common/styles/ToneTest/ToneTest.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ declare function ToneTest(): JSX.Element;
3
+ export default ToneTest;
package/dist/src/common/styles/ToneTest/ToneTest.js ADDED
@@ -0,0 +1,395 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
+ }) : (function(o, m, k, k2) {
6
+ if (k2 === undefined) k2 = k;
7
+ o[k2] = m[k];
8
+ }));
9
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
10
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
11
+ }) : function(o, v) {
12
+ o["default"] = v;
13
+ });
14
+ var __importStar = (this && this.__importStar) || function (mod) {
15
+ if (mod && mod.__esModule) return mod;
16
+ var result = {};
17
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
18
+ __setModuleDefault(result, mod);
19
+ return result;
20
+ };
21
+ Object.defineProperty(exports, "__esModule", { value: true });
22
+ var react_1 = __importStar(require("react"));
23
+ var styled_components_1 = require("styled-components");
24
+ var desktop_1 = require("../../../desktop");
25
+ var components_1 = require("../../../desktop/components");
26
+ var hybrid_1 = require("../../../hybrid");
27
+ var theme_1 = require("../theme");
28
+ var mocks = [
29
+ {
30
+ conversionLinkSrc: 'https://www.naver.com/',
31
+ iconSrc: '',
32
+ menuItemType: 'WEB_LINK',
33
+ name: 'Default VOD',
34
+ iconName: 'ic_language',
35
+ pAppCode: 'C00001',
36
+ parsedNodes: [
37
+ {
38
+ conversionLinkSrc: '',
39
+ iconSrc: '',
40
+ menuItemType: 'NAV_P_APP',
41
+ name: 'Timeline is Timeline but Timeline',
42
+ pAppCode: 'A00001',
43
+ parsedNodes: [],
44
+ type: 'GENERAL_NODE',
45
+ visibilityLevel: 'SUBSCRIBER'
46
+ },
47
+ {
48
+ conversionLinkSrc: '',
49
+ iconSrc: '',
50
+ menuItemType: 'NAV_P_APP',
51
+ name: 'Notice',
52
+ pAppCode: 'A00002',
53
+ parsedNodes: [],
54
+ type: 'GENERAL_NODE',
55
+ visibilityLevel: 'SUBSCRIBER'
56
+ }
57
+ ],
58
+ type: 'GENERAL_NODE',
59
+ visibilityLevel: 'SUBSCRIBER'
60
+ },
61
+ {
62
+ conversionLinkSrc: '',
63
+ iconSrc: '',
64
+ iconName: 'ic_chat',
65
+ menuItemType: 'NAV_P_APP',
66
+ name: 'Free Board',
67
+ pAppCode: 'A00003',
68
+ parsedNodes: [
69
+ {
70
+ conversionLinkSrc: '',
71
+ iconSrc: '',
72
+ menuItemType: 'NAV_P_APP',
73
+ name: 'Event Live',
74
+ pAppCode: 'C00005',
75
+ parsedNodes: [],
76
+ type: 'GENERAL_NODE',
77
+ visibilityLevel: 'SUBSCRIBER'
78
+ },
79
+ {
80
+ conversionLinkSrc: '',
81
+ iconSrc: '',
82
+ menuItemType: 'NAV_P_APP',
83
+ name: 'Polleeee',
84
+ pAppCode: 'A00007',
85
+ parsedNodes: [],
86
+ type: 'GENERAL_NODE',
87
+ visibilityLevel: 'SUBSCRIBER'
88
+ }
89
+ ],
90
+ type: 'GENERAL_NODE',
91
+ visibilityLevel: 'SUBSCRIBER'
92
+ },
93
+ {
94
+ conversionLinkSrc: '',
95
+ iconSrc: '',
96
+ iconName: 'ic_camera',
97
+ menuItemType: 'NAV_P_APP',
98
+ name: 'Class VOD',
99
+ pAppCode: 'C00007',
100
+ parsedNodes: [
101
+ {
102
+ conversionLinkSrc: '',
103
+ iconSrc: '',
104
+ menuItemType: 'NAV_P_APP',
105
+ name: '이것은30자팹네임입니다.팹팹팹팹팹팹팹팹팹팹팹팹팹팹팹팹팹',
106
+ pAppCode: 'C00006',
107
+ parsedNodes: [],
108
+ type: 'GENERAL_NODE',
109
+ visibilityLevel: 'SUBSCRIBER'
110
+ },
111
+ {
112
+ conversionLinkSrc: '',
113
+ iconSrc: '',
114
+ menuItemType: 'NAV_P_APP',
115
+ name: 'Inquiry Board',
116
+ pAppCode: 'A00005',
117
+ parsedNodes: [],
118
+ type: 'GENERAL_NODE',
119
+ visibilityLevel: 'SUBSCRIBER'
120
+ }
121
+ ],
122
+ type: 'GENERAL_NODE',
123
+ visibilityLevel: 'SUBSCRIBER'
124
+ },
125
+ {
126
+ conversionLinkSrc: '',
127
+ iconSrc: '',
128
+ menuItemType: 'NAV_P_APP',
129
+ name: 'Welcome Page',
130
+ pAppCode: 'B00006',
131
+ parsedNodes: [],
132
+ type: 'GENERAL_NODE',
133
+ visibilityLevel: 'SUBSCRIBER'
134
+ },
135
+ {
136
+ conversionLinkSrc: '',
137
+ iconSrc: '',
138
+ menuItemType: 'NAV_P_APP',
139
+ name: 'Photobook',
140
+ pAppCode: 'B00005',
141
+ parsedNodes: [
142
+ {
143
+ conversionLinkSrc: '',
144
+ iconSrc: '',
145
+ menuItemType: 'NAV_P_APP',
146
+ name: 'Book a consultation',
147
+ pAppCode: 'E00001',
148
+ parsedNodes: [],
149
+ type: 'GENERAL_NODE',
150
+ visibilityLevel: 'SUBSCRIBER'
151
+ }
152
+ ],
153
+ type: 'GENERAL_NODE',
154
+ visibilityLevel: 'SUBSCRIBER'
155
+ },
156
+ {
157
+ conversionLinkSrc: '',
158
+ iconSrc: '',
159
+ menuItemType: 'NAV_P_APP',
160
+ name: 'OTT Type VOD',
161
+ pAppCode: 'C00002',
162
+ parsedNodes: [],
163
+ type: 'GENERAL_NODE',
164
+ visibilityLevel: 'SUBSCRIBER'
165
+ },
166
+ {
167
+ conversionLinkSrc: '',
168
+ iconSrc: '',
169
+ menuItemType: 'NAV_P_APP',
170
+ name: 'Outlink pApp',
171
+ pAppCode: 'B00002',
172
+ parsedNodes: [
173
+ {
174
+ conversionLinkSrc: '',
175
+ iconSrc: '',
176
+ menuItemType: 'NAV_P_APP',
177
+ name: 'OTT Type VR VOD',
178
+ pAppCode: 'C00013',
179
+ parsedNodes: [],
180
+ type: 'GENERAL_NODE',
181
+ visibilityLevel: 'SUBSCRIBER'
182
+ }
183
+ ],
184
+ type: 'GENERAL_NODE',
185
+ visibilityLevel: 'SUBSCRIBER'
186
+ },
187
+ {
188
+ conversionLinkSrc: '',
189
+ iconSrc: '',
190
+ menuItemType: 'NAV_P_APP',
191
+ name: 'Outlink pApp',
192
+ pAppCode: 'B00002',
193
+ parsedNodes: [
194
+ {
195
+ conversionLinkSrc: '',
196
+ iconSrc: '',
197
+ menuItemType: 'NAV_P_APP',
198
+ name: 'OTT Type VR VOD',
199
+ pAppCode: 'C00013',
200
+ parsedNodes: [],
201
+ type: 'GENERAL_NODE',
202
+ visibilityLevel: 'SUBSCRIBER'
203
+ }
204
+ ],
205
+ type: 'GENERAL_NODE',
206
+ visibilityLevel: 'SUBSCRIBER'
207
+ },
208
+ {
209
+ conversionLinkSrc: '',
210
+ iconSrc: '',
211
+ menuItemType: 'NAV_P_APP',
212
+ name: 'Outlink pApp',
213
+ pAppCode: 'B00002',
214
+ parsedNodes: [
215
+ {
216
+ conversionLinkSrc: '',
217
+ iconSrc: '',
218
+ menuItemType: 'NAV_P_APP',
219
+ name: 'OTT Type VR VOD',
220
+ pAppCode: 'C00013',
221
+ parsedNodes: [],
222
+ type: 'GENERAL_NODE',
223
+ visibilityLevel: 'SUBSCRIBER'
224
+ }
225
+ ],
226
+ type: 'GENERAL_NODE',
227
+ visibilityLevel: 'SUBSCRIBER'
228
+ },
229
+ {
230
+ conversionLinkSrc: '',
231
+ iconSrc: '',
232
+ menuItemType: 'NAV_P_APP',
233
+ name: 'Outlink pApp',
234
+ pAppCode: 'B00002',
235
+ parsedNodes: [
236
+ {
237
+ conversionLinkSrc: '',
238
+ iconSrc: '',
239
+ menuItemType: 'NAV_P_APP',
240
+ name: 'OTT Type VR VOD',
241
+ pAppCode: 'C00013',
242
+ parsedNodes: [],
243
+ type: 'GENERAL_NODE',
244
+ visibilityLevel: 'SUBSCRIBER'
245
+ }
246
+ ],
247
+ type: 'GENERAL_NODE',
248
+ visibilityLevel: 'SUBSCRIBER'
249
+ },
250
+ {
251
+ conversionLinkSrc: '',
252
+ iconSrc: '',
253
+ menuItemType: 'NAV_P_APP',
254
+ name: 'Outlink pApp',
255
+ pAppCode: 'B00002',
256
+ parsedNodes: [
257
+ {
258
+ conversionLinkSrc: '',
259
+ iconSrc: '',
260
+ menuItemType: 'NAV_P_APP',
261
+ name: 'OTT Type VR VOD',
262
+ pAppCode: 'C00013',
263
+ parsedNodes: [],
264
+ type: 'GENERAL_NODE',
265
+ visibilityLevel: 'SUBSCRIBER'
266
+ }
267
+ ],
268
+ type: 'GENERAL_NODE',
269
+ visibilityLevel: 'SUBSCRIBER'
270
+ },
271
+ {
272
+ conversionLinkSrc: '',
273
+ iconSrc: '',
274
+ menuItemType: 'NAV_P_APP',
275
+ name: 'Outlink pApp',
276
+ pAppCode: 'B00002',
277
+ parsedNodes: [
278
+ {
279
+ conversionLinkSrc: '',
280
+ iconSrc: '',
281
+ menuItemType: 'NAV_P_APP',
282
+ name: 'OTT Type VR VOD',
283
+ pAppCode: 'C00013',
284
+ parsedNodes: [],
285
+ type: 'GENERAL_NODE',
286
+ visibilityLevel: 'SUBSCRIBER'
287
+ }
288
+ ],
289
+ type: 'GENERAL_NODE',
290
+ visibilityLevel: 'SUBSCRIBER'
291
+ },
292
+ {
293
+ conversionLinkSrc: '',
294
+ iconSrc: '',
295
+ menuItemType: 'NAV_P_APP',
296
+ name: 'Outlink pApp',
297
+ pAppCode: 'B00002',
298
+ parsedNodes: [
299
+ {
300
+ conversionLinkSrc: '',
301
+ iconSrc: '',
302
+ menuItemType: 'NAV_P_APP',
303
+ name: 'OTT Type VR VOD',
304
+ pAppCode: 'C00013',
305
+ parsedNodes: [],
306
+ type: 'GENERAL_NODE',
307
+ visibilityLevel: 'SUBSCRIBER'
308
+ }
309
+ ],
310
+ type: 'GENERAL_NODE',
311
+ visibilityLevel: 'SUBSCRIBER'
312
+ },
313
+ {
314
+ conversionLinkSrc: '',
315
+ iconSrc: '',
316
+ menuItemType: 'NAV_P_APP',
317
+ name: 'Outlink pApp',
318
+ pAppCode: 'B00002',
319
+ parsedNodes: [
320
+ {
321
+ conversionLinkSrc: '',
322
+ iconSrc: '',
323
+ menuItemType: 'NAV_P_APP',
324
+ name: 'OTT Type VR VOD',
325
+ pAppCode: 'C00013',
326
+ parsedNodes: [],
327
+ type: 'GENERAL_NODE',
328
+ visibilityLevel: 'SUBSCRIBER'
329
+ }
330
+ ],
331
+ type: 'GENERAL_NODE',
332
+ visibilityLevel: 'SUBSCRIBER'
333
+ },
334
+ {
335
+ conversionLinkSrc: '',
336
+ iconSrc: '',
337
+ menuItemType: 'NAV_P_APP',
338
+ name: 'Outlink pApp',
339
+ pAppCode: 'B00002',
340
+ parsedNodes: [
341
+ {
342
+ conversionLinkSrc: '',
343
+ iconSrc: '',
344
+ menuItemType: 'NAV_P_APP',
345
+ name: 'OTT Type VR VOD',
346
+ pAppCode: 'C00013',
347
+ parsedNodes: [],
348
+ type: 'GENERAL_NODE',
349
+ visibilityLevel: 'SUBSCRIBER'
350
+ }
351
+ ],
352
+ type: 'GENERAL_NODE',
353
+ visibilityLevel: 'SUBSCRIBER'
354
+ }
355
+ ];
356
+ function ToneTest() {
357
+ var _a = (0, react_1.useState)('LIGHT'), customTone = _a[0], setTone = _a[1];
358
+ var changeTone = function () {
359
+ if (customTone === 'LIGHT') {
360
+ setTone('DARK');
361
+ }
362
+ else {
363
+ setTone('LIGHT');
364
+ }
365
+ };
366
+ return (react_1.default.createElement("div", null,
367
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
368
+ react_1.default.createElement(components_1.MainButton, { iconName: "ic_arrow_round_left", text: "Toggle Tone", onClick: changeTone, styleTheme: "secondary" }),
369
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
370
+ react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 toggled\uB41C tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
371
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
372
+ react_1.default.createElement(styled_components_1.ThemeProvider, { theme: (0, theme_1.themeByGivenTone)(customTone) },
373
+ react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
374
+ src: 'http://i.imgur.com/zVKjblJ.png',
375
+ text: 'PEPSI',
376
+ href: '/'
377
+ }, userProfile: {
378
+ src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
379
+ href: '/'
380
+ }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })),
381
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_e" }),
382
+ react_1.default.createElement(hybrid_1.Divider, null),
383
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
384
+ react_1.default.createElement(components_1.TextLabel, { text: "\uC774\uACF3\uC740 \uAE30\uBCF8 tone\uC744 \uB530\uB974\uB294 \uBD80\uBD84\uC785\uB2C8\uB2E4." }),
385
+ react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" }),
386
+ react_1.default.createElement(desktop_1.D_DynamicDesktopNavBar, { isPreview: true, brandLogo: {
387
+ src: 'http://i.imgur.com/zVKjblJ.png',
388
+ text: 'PEPSI',
389
+ href: '/'
390
+ }, userProfile: {
391
+ src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSL5qfISvgI8p95f3w5lZN9XNwYh1mRiIqEaQ&usqp=CAU',
392
+ href: '/'
393
+ }, primaryMenus: mocks, secondaryMenus: mocks, template: "W1_0005", basePath: "/channels/invitation" })));
394
+ }
395
+ exports.default = ToneTest;
package/dist/src/common/styles/ToneTest/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export { default as ToneTest } from './ToneTest';
package/dist/src/common/styles/ToneTest/index.js ADDED
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.ToneTest = void 0;
7
+ var ToneTest_1 = require("./ToneTest");
8
+ Object.defineProperty(exports, "ToneTest", { enumerable: true, get: function () { return __importDefault(ToneTest_1).default; } });
package/dist/src/common/styles/theme.d.ts CHANGED
@@ -82,4 +82,6 @@ export declare const spacing: {
82
82
  spacingN: string;
83
83
  };
84
84
  declare const theme: DefaultTheme;
85
+ declare type ToneType = 'DARK' | 'LIGHT';
86
+ export declare const themeByGivenTone: (tone: ToneType) => any;
85
87
  export default theme;
package/dist/src/common/styles/theme.js CHANGED
@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
13
  Object.defineProperty(exports, "__esModule", { value: true });
14
- exports.spacing = exports.boxShadow = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
14
+ exports.themeByGivenTone = exports.spacing = exports.boxShadow = exports.mobileLineHeight = exports.mobileFontSize = exports.desktopLineHeight = exports.desktopFontSize = exports.fontWeight = void 0;
15
15
  var ui_colors_1 = require("./ui-colors");
16
16
  exports.fontWeight = {
17
17
  normal: '500',
@@ -96,4 +96,6 @@ exports.spacing = {
96
96
  spacingN: '320px'
97
97
  };
98
98
  var theme = __assign({ fontWeight: exports.fontWeight, desktopFontSize: exports.desktopFontSize, desktopLineHeight: exports.desktopLineHeight, mobileFontSize: exports.mobileFontSize, mobileLineHeight: exports.mobileLineHeight, boxShadow: exports.boxShadow, spacing: exports.spacing }, (0, ui_colors_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {}));
99
+ var themeByGivenTone = function (tone) { return (__assign(__assign({}, (0, ui_colors_1.customTheme)(tone)), { fontWeight: exports.fontWeight, desktopFontSize: exports.desktopFontSize, desktopLineHeight: exports.desktopLineHeight, mobileFontSize: exports.mobileFontSize, mobileLineHeight: exports.mobileLineHeight, boxShadow: exports.boxShadow, spacing: exports.spacing })); };
100
+ exports.themeByGivenTone = themeByGivenTone;
99
101
  exports.default = theme;
package/dist/src/desktop/common/components/TextFieldBase/TextFieldBase.js CHANGED
@@ -151,7 +151,7 @@ function TextFieldBase(_a) {
151
151
  textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
152
152
  }, []);
153
153
  function deleteValue() {
154
- setValue(name, '');
154
+ setValue(name, '', { shouldDirty: true });
155
155
  }
156
156
  // NOTE: input의 type이 number일때, e나 E의 경우 숫자로 취급되어 입력이 가능하지만, publ의 기획상 막아야하기 때문에 생성한 함수
157
157
  var preventEKeyword = function (e) {
package/dist/src/desktop/components/DynamicDesktopNavBar/types.d.ts CHANGED
@@ -5,7 +5,7 @@ export declare type ParsedNode = {
5
5
  name: string;
6
6
  iconSrc?: string;
7
7
  iconName?: PDSIconType;
8
- visibilityLevel: boolean;
8
+ visibilityLevel: string;
9
9
  pAppCode?: string;
10
10
  conversionLinkSrc?: string;
11
11
  parsedNodes: Array<ParsedNode>;
package/dist/src/desktop/components/IconButton/IconButton.js CHANGED
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
- var common_1 = require("../../../common");
32
31
  var hybrid_1 = require("../../../hybrid");
33
32
  function IconButton(_a) {
34
33
  var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
@@ -76,9 +75,7 @@ var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObj
76
75
  });
77
76
  var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"], ["\n background-color: ", ";\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"])), function (_a) {
78
77
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
79
- return baseColorKey
80
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[baseColorKey]
81
- : theme.ui_cpnt_button_fill_base_primary;
78
+ return baseColorKey ? theme[baseColorKey] : theme.ui_cpnt_button_fill_base_primary;
82
79
  }, function (_a) {
83
80
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
84
81
  return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
@@ -105,9 +102,7 @@ var line = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 =
105
102
  return theme.ui_cpnt_button_line_base_default;
106
103
  }, function (_a) {
107
104
  var theme = _a.theme, borderColorKey = _a.borderColorKey;
108
- return borderColorKey
109
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[borderColorKey]
110
- : theme.ui_cpnt_button_line_border_enabled;
105
+ return borderColorKey ? theme[borderColorKey] : theme.ui_cpnt_button_line_border_enabled;
111
106
  }, function (_a) {
112
107
  var colorTheme = _a.colorTheme;
113
108
  switch (colorTheme) {
package/dist/src/desktop/components/TextLabel/TextLabel.js CHANGED
@@ -25,7 +25,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
26
  var react_1 = __importStar(require("react"));
27
27
  var styled_components_1 = __importStar(require("styled-components"));
28
- var common_1 = require("../../../common");
29
28
  var hybrid_1 = require("../../../hybrid");
30
29
  function TextLabel(_a) {
31
30
  var text = _a.text, tooltipText = _a.tooltipText, _b = _a.tooltipPosition, tooltipPosition = _b === void 0 ? 'right_bottom' : _b, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, _d = _a.styleTheme, styleTheme = _d === void 0 ? 'body2Bold' : _d, colorOverride = _a.colorOverride, _e = _a.colorTheme, colorTheme = _e === void 0 ? 'sysTextPrimary' : _e, _f = _a.singleLineMode, singleLineMode = _f === void 0 ? 'none' : _f, _g = _a.ellipsisMode, ellipsisMode = _g === void 0 ? 'none' : _g, lineLimit = _a.lineLimit, _h = _a.userSelectMode, userSelectMode = _h === void 0 ? 'none' : _h, customFontSize = _a.customFontSize, customFontWeight = _a.customFontWeight, _j = _a.textDecorationType, textDecorationType = _j === void 0 ? 'none' : _j, _k = _a.requirementMode, requirementMode = _k === void 0 ? 'none' : _k, _l = _a.bulletPointMode, bulletPointMode = _l === void 0 ? 'none' : _l, _m = _a.wordBreak, wordBreak = _m === void 0 ? 'keep_all' : _m;
@@ -261,9 +260,8 @@ var customFontStyle = (0, styled_components_1.css)(templateObject_28 || (templat
261
260
  return customFontWeight === 'bold' ? theme.fontWeight.bold : theme.fontWeight.normal;
262
261
  });
263
262
  var colorOverrideStyle = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
264
- var colorOverride = _a.colorOverride;
265
- return colorOverride &&
266
- (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[colorOverride];
263
+ var colorOverride = _a.colorOverride, theme = _a.theme;
264
+ return colorOverride && theme[colorOverride];
267
265
  });
268
266
  var ellipsisStyle = (0, styled_components_1.css)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n -webkit-box-orient: vertical;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n -webkit-box-orient: vertical;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (_a) {
269
267
  var lineLimit = _a.lineLimit;
package/dist/src/desktop/components/UploadIconButton/UploadIconButton.js CHANGED
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
- var common_1 = require("../../../common");
32
31
  var hybrid_1 = require("../../../hybrid");
33
32
  var types_1 = require("./types");
34
33
  function UploadIconButton(_a) {
@@ -62,9 +61,7 @@ var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObj
62
61
  });
63
62
  var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n &:hover:not([disabled]) {\n ", "\n }\n\n &:active:not([disabled]) {\n background-image: ", ";\n }\n\n ", ";\n"], ["\n background-color: ", ";\n\n &:hover:not([disabled]) {\n ", "\n }\n\n &:active:not([disabled]) {\n background-image: ", ";\n }\n\n ", ";\n"])), function (_a) {
64
63
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
65
- return baseColorKey
66
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[baseColorKey]
67
- : theme.ui_cpnt_button_fill_base_primary;
64
+ return baseColorKey ? theme[baseColorKey] : theme.ui_cpnt_button_fill_base_primary;
68
65
  }, function (_a) {
69
66
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
70
67
  return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
@@ -99,9 +96,7 @@ var line = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 =
99
96
  return theme.ui_cpnt_button_line_base_default;
100
97
  }, function (_a) {
101
98
  var theme = _a.theme, borderColorKey = _a.borderColorKey;
102
- return borderColorKey
103
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[borderColorKey]
104
- : theme.ui_cpnt_button_line_border_enabled;
99
+ return borderColorKey ? theme[borderColorKey] : theme.ui_cpnt_button_line_border_enabled;
105
100
  }, function (_a) {
106
101
  var colorTheme = _a.colorTheme;
107
102
  switch (colorTheme) {
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.d.ts CHANGED
@@ -2,7 +2,7 @@ import { MutableRefObject } from 'react';
2
2
  export declare type ContentsContainerProps = {
3
3
  content1?: JSX.Element;
4
4
  content2?: JSX.Element;
5
- layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTQ_1' | 'WTS_1';
5
+ layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTQ_1' | 'WTS_1' | 'WTS_2';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
8
  container1Ref?: MutableRefObject<HTMLDivElement | null>;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/ContentsContainer.js CHANGED
@@ -45,7 +45,8 @@ var ContentsContainer = function (_a) {
45
45
  WTO_1: (react_1.default.createElement(variation_1.WTO, { layoutType: "WTO_1", content1: content1, containerColor: containerColor, areaColor: areaColor })),
46
46
  WTP_1: (react_1.default.createElement(variation_1.WTP, { layoutType: "WTP_1", content1: content1, containerColor: containerColor, areaColor: areaColor })),
47
47
  WTQ_1: (react_1.default.createElement(variation_1.WTQ, { layoutType: "WTQ_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor })),
48
- WTS_1: (react_1.default.createElement(variation_1.WTS, { layoutType: "WTS_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, container1Ref: container1Ref }))
48
+ WTS_1: (react_1.default.createElement(variation_1.WTS, { layoutType: "WTS_1", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, container1Ref: container1Ref })),
49
+ WTS_2: (react_1.default.createElement(variation_1.WTS, { layoutType: "WTS_2", content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, container1Ref: container1Ref }))
49
50
  }[layoutType]));
50
51
  };
51
52
  exports.default = ContentsContainer;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.d.ts CHANGED
@@ -2,7 +2,7 @@ import { MutableRefObject } from 'react';
2
2
  export declare type WTSProps = {
3
3
  content1?: JSX.Element;
4
4
  content2?: JSX.Element;
5
- layoutType: 'WTS_1';
5
+ layoutType: 'WTS_1' | 'WTS_2';
6
6
  containerColor?: string;
7
7
  areaColor?: string;
8
8
  container1Ref?: MutableRefObject<HTMLDivElement | null>;
package/dist/src/desktop/layout/LayoutWT/Containers/ContentsContainer/variation/WTS.js CHANGED
@@ -3,12 +3,31 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
3
3
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
4
  return cooked;
5
5
  };
6
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
7
+ if (k2 === undefined) k2 = k;
8
+ Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
6
25
  var __importDefault = (this && this.__importDefault) || function (mod) {
7
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
8
27
  };
9
28
  Object.defineProperty(exports, "__esModule", { value: true });
10
29
  var react_1 = __importDefault(require("react"));
11
- var styled_components_1 = __importDefault(require("styled-components"));
30
+ var styled_components_1 = __importStar(require("styled-components"));
12
31
  var hybrid_1 = require("../../../../../../hybrid");
13
32
  var WTS = function (_a) {
14
33
  var content1 = _a.content1, content2 = _a.content2, containerColor = _a.containerColor, areaColor = _a.areaColor, layoutType = _a.layoutType, container1Ref = _a.container1Ref;
@@ -30,12 +49,17 @@ var S_ContentsArea1 = styled_components_1.default.div(templateObject_2 || (templ
30
49
  var areaColor = _a.areaColor;
31
50
  return "background-color: " + areaColor;
32
51
  });
33
- var S_ContentsArea2 = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n box-sizing: border-box;\n padding-left: 24px;\n padding-right: 24px;\n padding-top: 24px;\n max-width: 1400px;\n min-width: 1200px;\n width: 100%;\n ", ";\n"], ["\n box-sizing: border-box;\n padding-left: 24px;\n padding-right: 24px;\n padding-top: 24px;\n max-width: 1400px;\n min-width: 1200px;\n width: 100%;\n ", ";\n"])), function (_a) {
52
+ var WTS_1ContentsArea2 = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding-bottom: 88px;\n padding-left: 24px;\n padding-right: 24px;\n padding-top: 24px;\n max-width: 1400px;\n min-width: 1200px;\n"], ["\n padding-bottom: 88px;\n padding-left: 24px;\n padding-right: 24px;\n padding-top: 24px;\n max-width: 1400px;\n min-width: 1200px;\n"])));
53
+ var WTS_2ContentsArea2 = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n padding-bottom: 88px;\n padding-top: 24px;\n width: 960px;\n"], ["\n padding-bottom: 88px;\n padding-top: 24px;\n width: 960px;\n"])));
54
+ var S_ContentsArea2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n box-sizing: border-box;\n width: 100%;\n ", ";\n ", ";\n"], ["\n box-sizing: border-box;\n width: 100%;\n ", ";\n ", ";\n"])), function (_a) {
55
+ var layoutType = _a.layoutType;
56
+ return ({ WTS_1: WTS_1ContentsArea2, WTS_2: WTS_2ContentsArea2 }[layoutType]);
57
+ }, function (_a) {
34
58
  var areaColor = _a.areaColor;
35
59
  return "background-color: " + areaColor;
36
60
  });
37
61
  // TODO: 철학에 위배되지만, 히어로 배너를 쓰지 않을 경우를 위해 임시로 제거 상태. 추후 조치 필요
38
- var S_Content1 = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n /* min-height: 480px; */\n"], ["\n /* min-height: 480px; */\n"])));
39
- var S_Content2 = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
62
+ var S_Content1 = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n /* min-height: 480px; */\n"], ["\n /* min-height: 480px; */\n"])));
63
+ var S_Content2 = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
40
64
  exports.default = WTS;
41
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
65
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import React, { MutableRefObject } from 'react';
2
2
  export declare type ContainersBoxProps = {
3
- layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTQ_1' | 'WTS_1';
3
+ layoutType: 'WTA_1' | 'WTA_2' | 'WTA_3' | 'WTB_1' | 'WTC_1' | 'WTD_1' | 'WTD_2' | 'WTD_3' | 'WTD_4' | 'WTD_5' | 'WTD_6' | 'WTE_1' | 'WTF_1' | 'WTF_2' | 'WTF_3' | 'WTF_4' | 'WTF_5' | 'WTF_6' | 'WTG_1' | 'WTH_1' | 'WTH_2' | 'WTH_3' | 'WTI_1' | 'WTI_2' | 'WTJ_1' | 'WTK_1' | 'WTK_2' | 'WTK_3' | 'WTL_1' | 'WTM_1' | 'WTM_2' | 'WTN_1' | 'WTN_2' | 'WTN_3' | 'WTO_1' | 'WTP_1' | 'WTQ_1' | 'WTS_1' | 'WTS_2';
4
4
  pageMenuContent?: JSX.Element;
5
5
  tabMenuContent?: JSX.Element;
6
6
  subMenuContent?: JSX.Element;
package/dist/src/desktop/layout/LayoutWT/ContainersBox/ContainersBox.js CHANGED
@@ -70,7 +70,8 @@ var ContainersBox = function (_a) {
70
70
  WTO_1: react_1.default.createElement(react_1.default.Fragment, null),
71
71
  WTP_1: react_1.default.createElement(react_1.default.Fragment, null),
72
72
  WTQ_1: react_1.default.createElement(react_1.default.Fragment, null),
73
- WTS_1: react_1.default.createElement(react_1.default.Fragment, null)
73
+ WTS_1: react_1.default.createElement(react_1.default.Fragment, null),
74
+ WTS_2: react_1.default.createElement(react_1.default.Fragment, null)
74
75
  }[layoutType],
75
76
  react_1.default.createElement(S_RightBox, null,
76
77
  {
@@ -111,7 +112,8 @@ var ContainersBox = function (_a) {
111
112
  WTO_1: (react_1.default.createElement(Containers_1.PageMenuContainer, { pageMenuType: "top_page_menu", pageMenuContent: pageMenuContent, containerColor: containerColor, areaColor: areaColor })),
112
113
  WTP_1: react_1.default.createElement(react_1.default.Fragment, null),
113
114
  WTQ_1: react_1.default.createElement(react_1.default.Fragment, null),
114
- WTS_1: react_1.default.createElement(react_1.default.Fragment, null)
115
+ WTS_1: react_1.default.createElement(react_1.default.Fragment, null),
116
+ WTS_2: react_1.default.createElement(react_1.default.Fragment, null)
115
117
  }[layoutType],
116
118
  {
117
119
  WTA_1: react_1.default.createElement(react_1.default.Fragment, null),
@@ -151,7 +153,8 @@ var ContainersBox = function (_a) {
151
153
  WTO_1: react_1.default.createElement(react_1.default.Fragment, null),
152
154
  WTP_1: react_1.default.createElement(react_1.default.Fragment, null),
153
155
  WTQ_1: react_1.default.createElement(react_1.default.Fragment, null),
154
- WTS_1: react_1.default.createElement(react_1.default.Fragment, null)
156
+ WTS_1: react_1.default.createElement(react_1.default.Fragment, null),
157
+ WTS_2: react_1.default.createElement(react_1.default.Fragment, null)
155
158
  }[layoutType],
156
159
  react_1.default.createElement(S_BottomWrapper, { layoutType: layoutType },
157
160
  {
@@ -192,7 +195,8 @@ var ContainersBox = function (_a) {
192
195
  WTO_1: (react_1.default.createElement(Containers_1.SubMenuContainer, { subMenuType: "left_sub_menu", subMenuContent: subMenuContent })),
193
196
  WTP_1: (react_1.default.createElement(Containers_1.SubMenuContainer, { subMenuType: "left_sub_menu", subMenuContent: subMenuContent })),
194
197
  WTQ_1: '',
195
- WTS_1: ''
198
+ WTS_1: '',
199
+ WTS_2: ''
196
200
  }[layoutType],
197
201
  react_1.default.createElement(Containers_1.ContentsContainer, { layoutType: layoutType, content1: content1, content2: content2, containerColor: containerColor, areaColor: areaColor, container1Ref: container1Ref })))));
198
202
  };
package/dist/src/hybrid/components/Icon/Icon.js CHANGED
@@ -4,14 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  var react_1 = __importDefault(require("react"));
7
- var common_1 = require("../../../common");
7
+ var styled_components_1 = require("styled-components");
8
8
  var fill_1 = __importDefault(require("../../../common/assets/icons/fill"));
9
9
  var line_1 = __importDefault(require("../../../common/assets/icons/line"));
10
10
  var Icon = function (_a) {
11
11
  var _b = _a.iconName, iconName = _b === void 0 ? 'ic_unavailable' : _b, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.colorKey, colorKey = _d === void 0 ? 'ui_cpnt_icon_sys_grey_01' : _d, _e = _a.fillType, fillType = _e === void 0 ? 'line' : _e;
12
+ var theme = (0, styled_components_1.useTheme)();
12
13
  var SelectedIcon = fillType === 'line'
13
14
  ? line_1.default[iconName] || fill_1.default[iconName]
14
15
  : fill_1.default[iconName] || line_1.default[iconName];
15
- return (react_1.default.createElement(SelectedIcon, { color: (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[colorKey], size: size, style: { minWidth: size, minHeight: size } }));
16
+ return (react_1.default.createElement(SelectedIcon, { color: theme[colorKey], size: size, style: { minWidth: size, minHeight: size } }));
16
17
  };
17
18
  exports.default = Icon;
package/dist/src/mobile/common/components/TextFieldBase/TextFieldBase.js CHANGED
@@ -151,7 +151,7 @@ function TextFieldBase(_a) {
151
151
  textAreaRef.current.style.height = textAreaRef.current.scrollHeight + "px";
152
152
  }, []);
153
153
  function deleteValue() {
154
- setValue(name, '');
154
+ setValue(name, '', { shouldDirty: true });
155
155
  }
156
156
  // NOTE: input의 type이 number일때, e나 E의 경우 숫자로 취급되어 입력이 가능하지만, publ의 기획상 막아야하기 때문에 생성한 함수
157
157
  var preventEKeyword = function (e) {
package/dist/src/mobile/components/IconButton/IconButton.js CHANGED
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
- var ui_colors_1 = require("../../../common/styles/ui-colors");
32
31
  var hybrid_1 = require("../../../hybrid");
33
32
  function IconButton(_a) {
34
33
  var _b = _a.fillType, fillType = _b === void 0 ? 'fill' : _b, _c = _a.shapeType, shapeType = _c === void 0 ? 'rectangle' : _c, _d = _a.baseSize, baseSize = _d === void 0 ? 'small' : _d, baseColorKey = _a.baseColorKey, borderColorKey = _a.borderColorKey, _e = _a.iconSize, iconSize = _e === void 0 ? 24 : _e, _f = _a.iconFillType, iconFillType = _f === void 0 ? 'line' : _f, iconName = _a.iconName, iconColorKey = _a.iconColorKey, _g = _a.shadow, shadow = _g === void 0 ? 'hidden' : _g, _h = _a.colorTheme, colorTheme = _h === void 0 ? 'none' : _h, _j = _a.type, type = _j === void 0 ? 'button' : _j, _k = _a.state, state = _k === void 0 ? 'normal' : _k, tabIndex = _a.tabIndex, onClick = _a.onClick, onMouseDown = _a.onMouseDown;
@@ -76,9 +75,7 @@ var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObj
76
75
  });
77
76
  var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"], ["\n background-color: ", ";\n\n &:active:enabled {\n ", "\n }\n\n ", ";\n"])), function (_a) {
78
77
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
79
- return baseColorKey
80
- ? (0, ui_colors_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[baseColorKey]
81
- : theme.ui_cpnt_button_fill_base_primary;
78
+ return baseColorKey ? theme[baseColorKey] : theme.ui_cpnt_button_fill_base_primary;
82
79
  }, function (_a) {
83
80
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
84
81
  return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
@@ -100,9 +97,7 @@ var line = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 =
100
97
  return theme.ui_cpnt_button_line_base_default;
101
98
  }, function (_a) {
102
99
  var theme = _a.theme, borderColorKey = _a.borderColorKey;
103
- return borderColorKey
104
- ? (0, ui_colors_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[borderColorKey]
105
- : theme.ui_cpnt_button_line_border_enabled;
100
+ return borderColorKey ? theme[borderColorKey] : theme.ui_cpnt_button_line_border_enabled;
106
101
  }, function (_a) {
107
102
  var colorTheme = _a.colorTheme;
108
103
  switch (colorTheme) {
package/dist/src/mobile/components/TextLabel/TextLabel.js CHANGED
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
- var common_1 = require("../../../common");
32
31
  var hybrid_1 = require("../../../hybrid");
33
32
  function TextLabel(_a) {
34
33
  var text = _a.text, _b = _a.textAlign, textAlign = _b === void 0 ? 'left' : _b, _c = _a.styleTheme, styleTheme = _c === void 0 ? 'body2Bold' : _c, colorOverride = _a.colorOverride, _d = _a.colorTheme, colorTheme = _d === void 0 ? 'sysTextPrimary' : _d, _e = _a.singleLineMode, singleLineMode = _e === void 0 ? 'none' : _e, _f = _a.ellipsisMode, ellipsisMode = _f === void 0 ? 'none' : _f, lineLimit = _a.lineLimit, _g = _a.userSelectMode, userSelectMode = _g === void 0 ? 'none' : _g, customFontSize = _a.customFontSize, customFontWeight = _a.customFontWeight, _h = _a.textDecorationType, textDecorationType = _h === void 0 ? 'none' : _h, _j = _a.requirementMode, requirementMode = _j === void 0 ? 'none' : _j, _k = _a.bulletPointMode, bulletPointMode = _k === void 0 ? 'none' : _k, _l = _a.wordBreak, wordBreak = _l === void 0 ? 'keep_all' : _l;
@@ -256,9 +255,8 @@ var customFontStyle = (0, styled_components_1.css)(templateObject_28 || (templat
256
255
  return customFontWeight === 'bold' ? theme.fontWeight.bold : theme.fontWeight.normal;
257
256
  });
258
257
  var colorOverrideStyle = (0, styled_components_1.css)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
259
- var colorOverride = _a.colorOverride;
260
- return colorOverride &&
261
- (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[colorOverride];
258
+ var colorOverride = _a.colorOverride, theme = _a.theme;
259
+ return colorOverride && theme[colorOverride];
262
260
  });
263
261
  var ellipsisStyle = (0, styled_components_1.css)(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n -webkit-box-orient: vertical;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n -webkit-box-orient: vertical;\n display: -webkit-box;\n -webkit-line-clamp: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n"])), function (_a) {
264
262
  var lineLimit = _a.lineLimit;
package/dist/src/mobile/components/UploadIconButton/UploadIconButton.js CHANGED
@@ -28,7 +28,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
- var common_1 = require("../../../common");
32
31
  var hybrid_1 = require("../../../hybrid");
33
32
  var types_1 = require("./types");
34
33
  function UploadIconButton(_a) {
@@ -62,9 +61,7 @@ var fillDisabled = (0, styled_components_1.css)(templateObject_1 || (templateObj
62
61
  });
63
62
  var fill = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: ", ";\n\n &:active:not([disabled]) {\n background-image: ", ";\n }\n\n ", ";\n"], ["\n background-color: ", ";\n\n &:active:not([disabled]) {\n background-image: ", ";\n }\n\n ", ";\n"])), function (_a) {
64
63
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
65
- return baseColorKey
66
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[baseColorKey]
67
- : theme.ui_cpnt_button_fill_base_primary;
64
+ return baseColorKey ? theme[baseColorKey] : theme.ui_cpnt_button_fill_base_primary;
68
65
  }, function (_a) {
69
66
  var theme = _a.theme, baseColorKey = _a.baseColorKey;
70
67
  return baseColorKey === 'ui_cpnt_button_fill_base_transparent'
@@ -94,9 +91,7 @@ var line = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 =
94
91
  return theme.ui_cpnt_button_line_base_default;
95
92
  }, function (_a) {
96
93
  var theme = _a.theme, borderColorKey = _a.borderColorKey;
97
- return borderColorKey
98
- ? (0, common_1.customTheme)(window.PdsUtils ? window.PdsUtils.tone : 'DARK', window.PdsUtils ? window.PdsUtils.palette : {})[borderColorKey]
99
- : theme.ui_cpnt_button_line_border_enabled;
94
+ return borderColorKey ? theme[borderColorKey] : theme.ui_cpnt_button_line_border_enabled;
100
95
  }, function (_a) {
101
96
  var colorTheme = _a.colorTheme;
102
97
  switch (colorTheme) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.4.7",
3
+ "version": "1.4.10",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,12 +1,16 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.4.7]
2
+ ## [v1.4.10]
3
3
 
4
- ### Component
5
- * Chip
6
- * Category유형일때 아이콘이 쏠려보이던 현상 수정
7
- * TextButton
8
- * colorTheme이 white일 경우 hover나 press했을때 색상 변경
9
- * UserDesktopSideTab 생성
4
+ ### Package
5
+ * 스토리북 정렬 순서 알파벳순으로 변경
6
+ * theme과 따로 쓸 수 있는 themeByGivenTone 생성
10
7
 
11
- ### Color
12
- * 컬러 키 값 22.06.16 12시 10분 기준 싱크
8
+ ### Component
9
+ * IconButton
10
+ * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
11
+ * TextLabel
12
+ * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
13
+ * UploadIconButton
14
+ * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)
15
+ * Icon
16
+ * 내부에서 사용하던 customTheme제거(theme을 사용하도록 수정)