pds-dev-kit-web 1.4.37 → 1.4.38

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.
@@ -22,7 +22,7 @@ function ChatTextField(_a) {
22
22
  }
23
23
  };
24
24
  return (react_1.default.createElement(react_1.default.Fragment, null,
25
- react_1.default.createElement(S_FooterContentWrapper, null,
25
+ react_1.default.createElement(S_FooterContentWrapper, { footerIBtn2IconName: footerIBtn2IconName, footerIBtn3IconName: footerIBtn3IconName },
26
26
  footerIBtn3IconName && (react_1.default.createElement(react_1.default.Fragment, null, footerIBtn3Type === 'button' ? (react_1.default.createElement(IconButton_1.IconButton, { iconName: footerIBtn3IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: footerIBtn3State === 'normal'
27
27
  ? 'ui_cpnt_button_icon_primary'
28
28
  : 'ui_cpnt_button_icon_disabled', iconFillType: footerIBtn3IconFillType, iconSize: 24, state: footerIBtn3State, onClick: onClickFooterIBtn3 })) : (react_1.default.createElement(UploadIconButton_1.UploadIconButton, { iconName: footerIBtn3IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: footerIBtn3State === 'normal'
@@ -43,8 +43,10 @@ function ChatTextField(_a) {
43
43
  react_1.default.createElement(IconButton_1.IconButton, { iconName: submitIBtnIconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: isSubmitBtnActive ? 'ui_cpnt_button_icon_primary' : 'ui_cpnt_button_icon_disabled', iconFillType: submitIBtnIconFillType, iconSize: 24, type: "submit", state: isSubmitBtnActive ? 'normal' : 'disabled' }))));
44
44
  }
45
45
  var S_FooterContentWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
46
- var theme = _a.theme;
47
- return theme.spacing.spacingE;
46
+ var theme = _a.theme, footerIBtn2IconName = _a.footerIBtn2IconName, footerIBtn3IconName = _a.footerIBtn3IconName;
47
+ return footerIBtn2IconName || footerIBtn3IconName
48
+ ? "" + theme.spacing.spacingC
49
+ : "" + theme.spacing.spacingE;
48
50
  }, function (_a) {
49
51
  var theme = _a.theme;
50
52
  return theme.spacing.spacingC;
@@ -26,13 +26,13 @@ function Header(_a) {
26
26
  var styleTheme = _a.styleTheme, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, titleStyleTheme = _a.titleStyleTheme, headerDisplayType = _a.headerDisplayType, headerIBtn1IconName = _a.headerIBtn1IconName, headerIBtn1IconFillType = _a.headerIBtn1IconFillType, onClickHeaderIBtn1 = _a.onClickHeaderIBtn1;
27
27
  return (react_1.default.createElement(S_HeaderContentWrapper, null,
28
28
  react_1.default.createElement(S_HeaderLeftBox, null,
29
- titleText && (react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: titleTextColors[styleTheme] })),
29
+ titleText && (react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: titleTextColors[styleTheme], wordBreak: "break_all" })),
30
30
  descText && (react_1.default.createElement(react_1.default.Fragment, null,
31
31
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_c" }),
32
- react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, styleTheme: "body2Regular", colorTheme: "sysTextSecondary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_02' : undefined }))),
32
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, styleTheme: "body2Regular", colorTheme: "sysTextSecondary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_02' : undefined, wordBreak: "break_all" }))),
33
33
  captionText && (react_1.default.createElement(react_1.default.Fragment, null,
34
34
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a" }),
35
- react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextTertiary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_03' : undefined })))),
35
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextTertiary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_03' : undefined, wordBreak: "break_all" })))),
36
36
  headerDisplayType === 'ibtn1' && headerIBtn1IconName && (react_1.default.createElement(IconButton_1.IconButton, { iconName: headerIBtn1IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: iconColors[styleTheme], iconSize: 24, iconFillType: headerIBtn1IconFillType, onClick: onClickHeaderIBtn1 }))));
37
37
  }
38
38
  var S_HeaderContentWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
@@ -22,7 +22,7 @@ function ChatTextField(_a) {
22
22
  }
23
23
  };
24
24
  return (react_1.default.createElement(react_1.default.Fragment, null,
25
- react_1.default.createElement(S_FooterContentWrapper, null,
25
+ react_1.default.createElement(S_FooterContentWrapper, { footerIBtn2IconName: footerIBtn2IconName, footerIBtn3IconName: footerIBtn3IconName },
26
26
  footerIBtn3IconName && (react_1.default.createElement(react_1.default.Fragment, null, footerIBtn3Type === 'button' ? (react_1.default.createElement(IconButton_1.IconButton, { iconName: footerIBtn3IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: footerIBtn3State === 'normal'
27
27
  ? 'ui_cpnt_button_icon_primary'
28
28
  : 'ui_cpnt_button_icon_disabled', iconFillType: footerIBtn3IconFillType, iconSize: 24, state: footerIBtn3State, onClick: onClickFooterIBtn3 })) : (react_1.default.createElement(UploadIconButton_1.UploadIconButton, { iconName: footerIBtn3IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: footerIBtn3State === 'normal'
@@ -43,8 +43,10 @@ function ChatTextField(_a) {
43
43
  react_1.default.createElement(IconButton_1.IconButton, { iconName: submitIBtnIconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: isSubmitBtnActive ? 'ui_cpnt_button_icon_primary' : 'ui_cpnt_button_icon_disabled', iconFillType: submitIBtnIconFillType, iconSize: 24, type: "submit", state: isSubmitBtnActive ? 'normal' : 'disabled' }))));
44
44
  }
45
45
  var S_FooterContentWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
46
- var theme = _a.theme;
47
- return theme.spacing.spacingE;
46
+ var theme = _a.theme, footerIBtn2IconName = _a.footerIBtn2IconName, footerIBtn3IconName = _a.footerIBtn3IconName;
47
+ return footerIBtn2IconName || footerIBtn3IconName
48
+ ? "" + theme.spacing.spacingC
49
+ : "" + theme.spacing.spacingE;
48
50
  }, function (_a) {
49
51
  var theme = _a.theme;
50
52
  return theme.spacing.spacingC;
@@ -26,13 +26,13 @@ function Header(_a) {
26
26
  var styleTheme = _a.styleTheme, titleText = _a.titleText, descText = _a.descText, captionText = _a.captionText, titleStyleTheme = _a.titleStyleTheme, headerDisplayType = _a.headerDisplayType, headerIBtn1IconName = _a.headerIBtn1IconName, headerIBtn1IconFillType = _a.headerIBtn1IconFillType, onClickHeaderIBtn1 = _a.onClickHeaderIBtn1;
27
27
  return (react_1.default.createElement(S_HeaderContentWrapper, null,
28
28
  react_1.default.createElement(S_HeaderLeftBox, null,
29
- titleText && (react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: titleTextColors[styleTheme] })),
29
+ titleText && (react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, styleTheme: titleStyleTheme, colorTheme: titleTextColors[styleTheme], wordBreak: "break_all" })),
30
30
  descText && (react_1.default.createElement(react_1.default.Fragment, null,
31
31
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_c" }),
32
- react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, styleTheme: "body2Regular", colorTheme: "sysTextSecondary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_02' : undefined }))),
32
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: descText, styleTheme: "body2Regular", colorTheme: "sysTextSecondary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_02' : undefined, wordBreak: "break_all" }))),
33
33
  captionText && (react_1.default.createElement(react_1.default.Fragment, null,
34
34
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a" }),
35
- react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextTertiary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_03' : undefined })))),
35
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, styleTheme: "caption1Regular", colorTheme: "sysTextTertiary", colorOverride: styleTheme === 'translucent' ? 'ui_cpnt_list_text_caption_03' : undefined, wordBreak: "break_all" })))),
36
36
  headerDisplayType === 'ibtn1' && headerIBtn1IconName && (react_1.default.createElement(IconButton_1.IconButton, { iconName: headerIBtn1IconName, baseSize: "large", baseColorKey: "ui_cpnt_button_fill_base_transparent", iconColorKey: iconColors[styleTheme], iconSize: 24, iconFillType: headerIBtn1IconFillType, onClick: onClickHeaderIBtn1 }))));
37
37
  }
38
38
  var S_HeaderContentWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n"])), function (_a) {
@@ -55,19 +55,19 @@ function MobileHeaderBar(_a) {
55
55
  if (captionText) {
56
56
  return (react_1.default.createElement(S_CaptionTextBox, null,
57
57
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "height" }),
58
- react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "body2Bold", singleLineMode: "use", textAlign: "center" }),
58
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "body2Bold", singleLineMode: "use", textAlign: "center", wordBreak: "break_all", ellipsisMode: "use", lineLimit: 1 }),
59
59
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "height" }),
60
- react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption2Regular", singleLineMode: "use", textAlign: "center" })));
60
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: captionText, colorTheme: "sysTextTertiary", styleTheme: "caption2Regular", singleLineMode: "use", textAlign: "center", wordBreak: "break_all", ellipsisMode: "use", lineLimit: 1 })));
61
61
  }
62
62
  return (react_1.default.createElement(S_TextTypeBox, null,
63
- react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "body2Bold", singleLineMode: "use", textAlign: "center" })));
63
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "body2Bold", singleLineMode: "use", textAlign: "center", wordBreak: "break_all", ellipsisMode: "use", lineLimit: 1 })));
64
64
  }
65
65
  case 'profile': {
66
66
  return (react_1.default.createElement(S_ProfileWrapper, null,
67
67
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b" }),
68
68
  react_1.default.createElement(hybrid_1.ImageView, { src: imageSrc, shapeType: "circular", width: 40, ratio: "1_1", scaleType: "cover", borderMode: "use" }),
69
69
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a" }),
70
- react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "caption1Regular", singleLineMode: "use" }),
70
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: titleText, colorTheme: "sysTextPrimary", styleTheme: "caption1Regular", singleLineMode: "use", wordBreak: "break_all", ellipsisMode: "use", lineLimit: 1 }),
71
71
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_d" })));
72
72
  }
73
73
  case 'image': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.4.37",
3
+ "version": "1.4.38",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,6 +1,9 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.4.37]
2
+ ## [v1.4.38]
3
3
 
4
- ### Layout
5
- * WTU_1
6
- * Container2 좌측 라인 추가
4
+ ### Component
5
+ * ChatList
6
+ * Header부분 text들에 wordBreak='break_all'을 추가
7
+ * footer 부분 좌측에 버튼이 있을 경우 간격을 12px로 변경
8
+ * MobileHeaderBar
9
+ * titleText와 captionText이 1줄 이상 표시되지 않도록 수정