pds-dev-kit-web 1.3.12 → 1.3.13

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.
@@ -124,9 +124,10 @@ function AdminListItem(_a) {
124
124
  react_1.default.createElement(S_SelectionColumn, { rowSize: rowSize }, selectionMode === 'multi' && (react_1.default.createElement(S_Selection, null,
125
125
  react_1.default.createElement(Checkbox_1.Checkbox, { name: id.toString(), state: selectedState === 'maintain' ? 'disabled' : 'normal' })))),
126
126
  react_1.default.createElement(S_ImageColumn, { rowSize: rowSize },
127
- column2Type === 'image_text' && (rowSize === 'high' || rowSize === 'medium') && (react_1.default.createElement(S_ImageWrapper, null,
127
+ column2Type === 'image_text' && (rowSize === 'high' || rowSize === 'medium') && (react_1.default.createElement(S_ImageWrapper, { rowSize: rowSize },
128
128
  react_1.default.createElement(hybrid_1.ImageView, { src: imageSrc, shapeType: imageShapeType, width: imageShapeType === 'circular' ? 64 : 120, ratio: imageRatio, scaleType: "cover", radius: imageShapeType === 'round' ? imageRadius : undefined }))),
129
- (rowSize === 'low' || rowSize === 'medium') && (react_1.default.createElement(TextLabel_1.TextLabel, { text: column2Text, styleTheme: "body2Bold", colorTheme: "sysTextPrimary", ellipsisMode: "use", lineLimit: 2 })),
129
+ (rowSize === 'low' || rowSize === 'medium') && (react_1.default.createElement(S_Column, null,
130
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: column2Text, styleTheme: "body2Bold", colorTheme: "sysTextPrimary", ellipsisMode: "use", lineLimit: 2 }))),
130
131
  rowSize === 'high' && (react_1.default.createElement(S_TextWrapper, { ref: contentRef, hasScroll: hasScroll },
131
132
  react_1.default.createElement(TextLabel_1.TextLabel, { text: column2Text, styleTheme: "body2Bold", colorTheme: "sysTextPrimary" })))),
132
133
  column3Text && (react_1.default.createElement(S_Column, { columnSize: column3TextWidth },
@@ -180,11 +181,14 @@ var S_QuickActionButton = styled_components_1.default.div(templateObject_12 || (
180
181
  return (disabled ? 'default' : 'pointer');
181
182
  });
182
183
  var S_Selection = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"], ["\n align-items: center;\n display: flex;\n height: 40px;\n justify-content: center;\n width: 40px;\n"])));
183
- var S_ImageWrapper = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n margin-right: ", ";\n"], ["\n margin-right: ", ";\n"])), function (_a) {
184
+ var S_ImageWrapper = styled_components_1.default.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n margin-right: ", ";\n\n ", "\n"], ["\n margin-right: ", ";\n\n ", "\n"])), function (_a) {
184
185
  var theme = _a.theme;
185
186
  return theme.spacing.spacingD;
187
+ }, function (_a) {
188
+ var rowSize = _a.rowSize;
189
+ return rowSize === 'high' && (0, styled_components_1.css)(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 100%;\n "], ["\n align-items: center;\n display: flex;\n height: 100%;\n "])));
186
190
  });
187
- var S_ImageColumn = styled_components_1.default.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n flex: 1;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"], ["\n flex: 1;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"])), function (_a) {
191
+ var S_ImageColumn = styled_components_1.default.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n flex: 1;\n overflow: auto;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"], ["\n flex: 1;\n overflow: auto;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n\n ", "\n"])), function (_a) {
188
192
  var theme = _a.theme, rowSize = _a.rowSize;
189
193
  return (rowSize === 'high' || rowSize === 'medium') && theme.spacing.spacingC;
190
194
  }, function (_a) {
@@ -199,14 +203,13 @@ var S_ImageColumn = styled_components_1.default.div(templateObject_17 || (templa
199
203
  }, function (_a) {
200
204
  var rowSize = _a.rowSize;
201
205
  return rowSize === 'high'
202
- ? (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n box-sizing: border-box;\n height: 200px;\n "], ["\n box-sizing: border-box;\n height: 200px;\n "]))) : (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
206
+ ? (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n height: 200px;\n "], ["\n box-sizing: border-box;\n display: flex;\n height: 200px;\n "]))) : (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
203
207
  });
204
- var S_TextWrapper = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n height: 100%;\n\n ", "\n"], ["\n height: 100%;\n\n ", "\n"])), function (_a) {
208
+ var S_TextWrapper = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n height: 100%;\n overflow: auto;\n\n ", "\n"], ["\n height: 100%;\n overflow: auto;\n\n ", "\n"])), function (_a) {
205
209
  var hasScroll = _a.hasScroll;
206
- return hasScroll
207
- ? (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n & > div {\n height: 100%;\n overflow-y: auto;\n }\n "], ["\n & > div {\n height: 100%;\n overflow-y: auto;\n }\n "]))) : (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
210
+ return !hasScroll && (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
208
211
  });
209
- var S_Column = styled_components_1.default.div(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding: ", ";\n\n ", ";\n ", ";\n"], ["\n align-items: center;\n display: flex;\n padding: ", ";\n\n ", ";\n ", ";\n"])), function (_a) {
212
+ var S_Column = styled_components_1.default.div(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n overflow: auto;\n padding: ", ";\n\n ", ";\n ", ";\n"], ["\n align-items: center;\n display: flex;\n overflow: auto;\n padding: ", ";\n\n ", ";\n ", ";\n"])), function (_a) {
210
213
  var theme = _a.theme;
211
214
  return theme.spacing.spacingC;
212
215
  }, function (_a) {
@@ -37,7 +37,7 @@ function TextLabel(_a) {
37
37
  text,
38
38
  tooltipText && (react_1.default.createElement(S_TooltipBox, { styleTheme: styleTheme },
39
39
  react_1.default.createElement(S_IconWrapper, { onMouseEnter: function () { return handleTooltipToggle(true); }, onMouseLeave: function () { return handleTooltipToggle(false); } },
40
- react_1.default.createElement(hybrid_1.Icon, { iconName: "ic_question", size: 16, fillType: "line" })),
40
+ react_1.default.createElement(hybrid_1.Icon, { iconName: "ic_question", size: 16, fillType: "fill", colorKey: "ui_cpnt_icon_sys_grey_03" })),
41
41
  react_1.default.createElement(S_TooltipWrapper, { className: "TooltipWrapper", isTooltipOpen: isTooltipOpen, tooltipPosition: tooltipPosition }, "" + tooltipText)))));
42
42
  }
43
43
  var displayBold = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n"], ["\n font-size: ", ";\n line-height: ", ";\n font-weight: ", ";\n"])), function (_a) {
@@ -17,6 +17,6 @@ var LayoutWS = function (_a) {
17
17
  };
18
18
  var S_LayoutWS = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n height: 100vh;\n width: 100vw;\n min-width: 1200px;\n"], ["\n display: flex;\n height: 100vh;\n width: 100vw;\n min-width: 1200px;\n"])));
19
19
  var S_LeftWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100%;\n"], ["\n height: 100%;\n"])));
20
- var S_RightWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n /* width: calc(100% - 240px); */\n width: 100%;\n"], ["\n /* width: calc(100% - 240px); */\n width: 100%;\n"])));
20
+ var S_RightWrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n flex: 1;\n overflow: hidden;\n"], ["\n flex: 1;\n overflow: hidden;\n"])));
21
21
  exports.default = LayoutWS;
22
22
  var templateObject_1, templateObject_2, templateObject_3;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.3.12",
3
+ "version": "1.3.13",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,20 +1,12 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.3.12]
2
+ ## [v1.3.13]
3
3
 
4
+ ### Layout
5
+ * WS
6
+ * LayoutWS의 우측부분이 너비를 제대로 잡을 수 있도록 수정 (width: 100%; -> flex: 1; overflow: hidden;)
4
7
  ### Component
5
- * Icon
6
- * ic_requirement(line) 추가
7
- * ic_question(fill) 추가
8
- * TextLabel
9
- * textDecorationType prop 추가
10
- * DesktopTabBar
11
- * itemArray prop 추가 (onClick과 isActive를 통해 TabBar를 핸들링 할 수 있습니다.)
12
- * 텍스트 중심 안맞고, 시각적 변동이 일어나던 부분 수정
13
- * UserDesktopTabBar
14
- * itemArray prop 추가 (onClick과 isActive를 통해 TabBar를 핸들링 할 수 있습니다.)
15
- * 텍스트 중심 안맞고, 시각적 변동이 일어나던 부분 수정
16
- * MobileTabBar
17
- * itemArray prop 추가 (onClick과 isActive를 통해 TabBar를 핸들링 할 수 있습니다.)
18
-
19
- ### Color
20
- * 컬러 키 값 22.05.10 14시 10분 기준 싱크
8
+ * D_AdminListItem
9
+ * 각 컬럼에 overflow: auto; 추가 (내용의 길이가 길어지면 타 칼럼을 침범하는 경우가 있음)
10
+ * rowSize가 high일때 깨지는 부분 해결
11
+ * D_ TextLabel
12
+ * tooltipText 사용시 뜨는 아이콘의 fillType과 color 수정