pds-dev-kit-web 0.6.2 → 0.6.3

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 (33) hide show
  1. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +2 -1
  2. package/dist/src/common/styles/colorSet/PaletteColor_light.json +2 -1
  3. package/dist/src/common/styles/colorSet/SemanticColor.json +2 -1
  4. package/dist/src/common/styles/colorSet/UIColor.json +6 -1
  5. package/dist/src/common/styles/colorSet/index.d.ts +191 -183
  6. package/dist/src/common/styles/colorSet/index.js +5 -5
  7. package/dist/src/common/styles/colorSet/ui-type.d.ts +5 -0
  8. package/dist/src/common/styles/index.d.ts +0 -2
  9. package/dist/src/common/styles/theme.d.ts +0 -2
  10. package/dist/src/common/styles/theme.js +2 -4
  11. package/dist/src/common/types/styled-components.d.ts +0 -2
  12. package/dist/src/desktop/components/Chip/Chip.js +6 -6
  13. package/dist/src/desktop/components/DesktopTabBar/DesktopTabBar.js +1 -1
  14. package/dist/src/desktop/components/EditApplyTextField/EditApplyTextField.js +1 -0
  15. package/dist/src/desktop/components/FloatingActionButton/FloatingActionButton.js +2 -2
  16. package/dist/src/desktop/components/MainButton/MainButton.js +1 -1
  17. package/dist/src/desktop/components/ReactionButton/ReactionButton.js +1 -1
  18. package/dist/src/desktop/components/StatusBlock/StatusBlock.js +1 -1
  19. package/dist/src/desktop/components/TextButton/TextButton.js +1 -1
  20. package/dist/src/desktop/components/TextLabel/TextLabel.d.ts +1 -3
  21. package/dist/src/desktop/components/TextLabel/TextLabel.js +7 -8
  22. package/dist/src/desktop/components/UploadMainButton/UploadMainButton.js +1 -1
  23. package/dist/src/desktop/components/UploadTextButton/UploadTextButton.js +1 -1
  24. package/dist/src/mobile/components/Chip/Chip.js +6 -6
  25. package/dist/src/mobile/components/MainButton/MainButton.js +1 -1
  26. package/dist/src/mobile/components/ReactionButton/ReactionButton.js +1 -1
  27. package/dist/src/mobile/components/StatusBlock/StatusBlock.js +1 -1
  28. package/dist/src/mobile/components/TextButton/TextButton.js +1 -1
  29. package/dist/src/mobile/components/TextLabel/TextLabel.d.ts +1 -3
  30. package/dist/src/mobile/components/TextLabel/TextLabel.js +7 -8
  31. package/dist/src/mobile/components/UploadMainButton/UploadMainButton.js +1 -1
  32. package/dist/src/mobile/components/UploadTextButton/UploadTextButton.js +1 -1
  33. package/package.json +1 -1
@@ -124,5 +124,6 @@
124
124
  "sys_widget_green_01": "darkgreen500",
125
125
  "sys_component_base_black_opacity30": "black/opacity30",
126
126
  "sys_area_background": "darkgrey50/opacity65",
127
- "sys_border_white_opacity30": "white/opacity30"
127
+ "sys_border_white_opacity30": "white/opacity30",
128
+ "sys_container_background_wt": "grey950"
128
129
  }
@@ -124,5 +124,6 @@
124
124
  "sys_widget_green_01": "green500",
125
125
  "sys_component_base_black_opacity30": "black/opacity30",
126
126
  "sys_area_background": "darkgrey50/opacity65",
127
- "sys_border_white_opacity30": "white/opacity30"
127
+ "sys_border_white_opacity30": "white/opacity30",
128
+ "sys_container_background_wt": "grey30"
128
129
  }
@@ -51,5 +51,6 @@
51
51
  "navy100": "#6E77A9",
52
52
  "darknavy100": "#7A82B2",
53
53
  "opacity80": "CC",
54
- "opacity50": "80"
54
+ "opacity50": "80",
55
+ "grey30": "#f9fafb"
55
56
  }
@@ -447,5 +447,10 @@
447
447
  "ui_36": "sys_component_base_black_opacity80",
448
448
  "ui_37": "sys_component_base_black_opacity30",
449
449
  "ui_39": "sys_area_background",
450
- "ui_cpnt_divider_white_opacity30": "sys_border_white_opacity30"
450
+ "ui_cpnt_divider_white_opacity30": "sys_border_white_opacity30",
451
+ "ui_pagemenucontainer_background_wt": "sys_container_background_wt",
452
+ "ui_contentscontainer_background_wt": "sys_container_background_wt",
453
+ "ui_pagemenuarea_background_wt": "sys_container_background_01",
454
+ "ui_contentsarea_background_wt": "sys_container_background_01",
455
+ "ui_cpnt_standardbanner_base_default": "sys_component_base_02"
451
456
  }
@@ -1,59 +1,4 @@
1
1
  declare const colorSet: {
2
- readonly SemanticColor: {
3
- blue500: string;
4
- blue700: string;
5
- blue300: string;
6
- green700: string;
7
- green500: string;
8
- green300: string;
9
- red500: string;
10
- grey900: string;
11
- grey500: string;
12
- grey400: string;
13
- grey100: string;
14
- grey50: string;
15
- white: string;
16
- black: string;
17
- darkblue500: string;
18
- grey950: string;
19
- darkgrey900: string;
20
- darkgrey500: string;
21
- darkgrey400: string;
22
- darkgrey100: string;
23
- darkgrey50: string;
24
- darkred500: string;
25
- darkgreen700: string;
26
- orange500: string;
27
- darkorange500: string;
28
- opacity00: string;
29
- opacity20: string;
30
- opacity30: string;
31
- opacity65: string;
32
- darkgreen500: string;
33
- grey70: string;
34
- navy500: string;
35
- lightgreen500: string;
36
- pink500: string;
37
- darkgrey70: string;
38
- darknavy500: string;
39
- darkpink500: string;
40
- darklightgreen500: string;
41
- opacity10: string;
42
- grey600: string;
43
- darkgrey600: string;
44
- skyblue500: string;
45
- skyblue300: string;
46
- pink300: string;
47
- lightpink500: string;
48
- darkblue300: string;
49
- darkblue700: string;
50
- darkgreen300: string;
51
- darkskyblue500: string;
52
- navy100: string;
53
- darknavy100: string;
54
- opacity80: string;
55
- opacity50: string;
56
- };
57
2
  readonly PaletteColor_Dark: {
58
3
  sys_container_background_01: string;
59
4
  sys_container_background_02: string;
@@ -181,6 +126,192 @@ declare const colorSet: {
181
126
  sys_component_base_black_opacity30: string;
182
127
  sys_area_background: string;
183
128
  sys_border_white_opacity30: string;
129
+ sys_container_background_wt: string;
130
+ };
131
+ readonly PaletteColor_light: {
132
+ sys_container_background_01: string;
133
+ sys_container_background_02: string;
134
+ sys_container_background_03: string;
135
+ sys_background_dimmed: string;
136
+ sys_text_grey_01: string;
137
+ sys_text_grey_02: string;
138
+ sys_text_grey_03: string;
139
+ sys_text_white: string;
140
+ sys_text_brand_primary: string;
141
+ sys_text_error_01: string;
142
+ sys_widget_grey_01: string;
143
+ sys_widget_grey_02: string;
144
+ sys_widget_grey_03: string;
145
+ sys_widget_primary_01: string;
146
+ sys_widget_error_01: string;
147
+ sys_widget_warning_01: string;
148
+ sys_widget_success_01: string;
149
+ sys_widget_white: string;
150
+ sys_border_area_01: string;
151
+ sys_border_line_01: string;
152
+ sys_border_line_02: string;
153
+ sys_border_line_03: string;
154
+ sys_border_line_04: string;
155
+ sys_border_line_05: string;
156
+ sys_component_base_01: string;
157
+ sys_component_base_02: string;
158
+ sys_component_base_03: string;
159
+ sys_component_base_red: string;
160
+ sys_component_base_white: string;
161
+ sys_component_base_white_opacity00: string;
162
+ sys_on_base_white_opacity00: string;
163
+ sys_on_base_white_opacity30: string;
164
+ sys_on_base_black_opacity20: string;
165
+ usr_brand_primary: string;
166
+ usr_brand_secondary: string;
167
+ usr_brand_secondary_variant: string;
168
+ usr_background: string;
169
+ usr_surface: string;
170
+ usr_border: string;
171
+ usr_on_brand_primary: string;
172
+ usr_on_brand_secondary: string;
173
+ usr_on_background: string;
174
+ usr_on_surface: string;
175
+ sys_widget_status_active_01: string;
176
+ sys_text_success_01: string;
177
+ sys_widget_grey_04: string;
178
+ sys_text_active: string;
179
+ sys_component_base_blue: string;
180
+ sys_on_base_black_opacity65: string;
181
+ sys_component_base_04: string;
182
+ sys_component_base_black: string;
183
+ sys_component_base_black_opacity00: string;
184
+ usr_text_brand_secondary_variant: string;
185
+ usr_text_brand_primary: string;
186
+ usr_text_brand_on_primary: string;
187
+ sys_text_brand_secondary_variant: string;
188
+ sys_component_base_navy: string;
189
+ sys_widget_lightgreen: string;
190
+ sys_border_line_06: string;
191
+ sys_background_dimmed_20: string;
192
+ sys_widget_pink: string;
193
+ sys_widget_primary_opacity20: string;
194
+ sys_widget_secondary_variant_01: string;
195
+ usr_component_base_brand_primary_opacity10: string;
196
+ sys_temp_grey_01: string;
197
+ sys_temp_grey_02: string;
198
+ sys_temp_grey_03: string;
199
+ sys_temp_grey_04: string;
200
+ sys_temp_grey_05: string;
201
+ sys_temp_white: string;
202
+ sys_temp_primary_01: string;
203
+ sys_temp_secondary_01: string;
204
+ sys_temp_red: string;
205
+ sys_temp_white_opacity_00: string;
206
+ sys_temp_dimmed: string;
207
+ sys_temp_black: string;
208
+ sys_temp_primary_02: string;
209
+ sys_temp_primary_03: string;
210
+ sys_temp_secondary_02: string;
211
+ sys_temp_lightgreen_01: string;
212
+ sys_text_grey_04: string;
213
+ sys_papp_post_social_background: string;
214
+ sys_papp_post_notice_background: string;
215
+ sys_papp_post_free_background: string;
216
+ sys_papp_vod_background: string;
217
+ sys_papp_vodplus_background: string;
218
+ sys_papp_live_background: string;
219
+ sys_selcontrols_base_off_disabled: string;
220
+ sys_selcontrols_base_on_disabled: string;
221
+ sys_component_base_blue_opacity10: string;
222
+ sys_component_base_05: string;
223
+ sys_background_dimmed_65: string;
224
+ sys_temp_grey_06: string;
225
+ sys_on_base_white_opacity10: string;
226
+ sys_on_base_black_opacity10: string;
227
+ sys_component_base_05_opacity00: string;
228
+ sys_papp_post_notice_link: string;
229
+ sys_component_base_navy_light: string;
230
+ sys_component_base_orange: string;
231
+ sys_component_base_grey: string;
232
+ sys_component_base_black_opacity80: string;
233
+ sys_text_darkgrey_02: string;
234
+ sys_border_line_darktheme_01: string;
235
+ sys_border_line_darktheme_02: string;
236
+ sys_component_base_darktheme_01: string;
237
+ sys_component_base_darktheme_02: string;
238
+ sys_component_base_darktheme_03: string;
239
+ sys_text_grey_darktheme_01: string;
240
+ sys_text_grey_darktheme_02: string;
241
+ sys_text_grey_darktheme_03: string;
242
+ sys_widget_grey_darktheme_01: string;
243
+ sys_widget_grey_darktheme_02: string;
244
+ sys_widget_grey_darktheme_03: string;
245
+ sys_component_base_green: string;
246
+ sys_text_error_darktheme_01: string;
247
+ sys_border_line_darktheme_03: string;
248
+ sys_border_line_darktheme_04: string;
249
+ usr_widget_brand_primary_darktheme_01: string;
250
+ usr_text_brand_primary_darktheme_01: string;
251
+ sys_component_base_black_opacity50: string;
252
+ sys_component_base_card: string;
253
+ sys_cpnt_textlabel_sys_brand_primary_opacity50: string;
254
+ sys_widget_green_01: string;
255
+ sys_component_base_black_opacity30: string;
256
+ sys_area_background: string;
257
+ sys_border_white_opacity30: string;
258
+ sys_container_background_wt: string;
259
+ };
260
+ readonly SemanticColor: {
261
+ blue500: string;
262
+ blue700: string;
263
+ blue300: string;
264
+ green700: string;
265
+ green500: string;
266
+ green300: string;
267
+ red500: string;
268
+ grey900: string;
269
+ grey500: string;
270
+ grey400: string;
271
+ grey100: string;
272
+ grey50: string;
273
+ white: string;
274
+ black: string;
275
+ darkblue500: string;
276
+ grey950: string;
277
+ darkgrey900: string;
278
+ darkgrey500: string;
279
+ darkgrey400: string;
280
+ darkgrey100: string;
281
+ darkgrey50: string;
282
+ darkred500: string;
283
+ darkgreen700: string;
284
+ orange500: string;
285
+ darkorange500: string;
286
+ opacity00: string;
287
+ opacity20: string;
288
+ opacity30: string;
289
+ opacity65: string;
290
+ darkgreen500: string;
291
+ grey70: string;
292
+ navy500: string;
293
+ lightgreen500: string;
294
+ pink500: string;
295
+ darkgrey70: string;
296
+ darknavy500: string;
297
+ darkpink500: string;
298
+ darklightgreen500: string;
299
+ opacity10: string;
300
+ grey600: string;
301
+ darkgrey600: string;
302
+ skyblue500: string;
303
+ skyblue300: string;
304
+ pink300: string;
305
+ lightpink500: string;
306
+ darkblue300: string;
307
+ darkblue700: string;
308
+ darkgreen300: string;
309
+ darkskyblue500: string;
310
+ navy100: string;
311
+ darknavy100: string;
312
+ opacity80: string;
313
+ opacity50: string;
314
+ grey30: string;
184
315
  };
185
316
  readonly UIColor: {
186
317
  ui_cpnt_button_fill_base_primary: string;
@@ -632,134 +763,11 @@ declare const colorSet: {
632
763
  ui_37: string;
633
764
  ui_39: string;
634
765
  ui_cpnt_divider_white_opacity30: string;
635
- };
636
- readonly PaletteColor_light: {
637
- sys_container_background_01: string;
638
- sys_container_background_02: string;
639
- sys_container_background_03: string;
640
- sys_background_dimmed: string;
641
- sys_text_grey_01: string;
642
- sys_text_grey_02: string;
643
- sys_text_grey_03: string;
644
- sys_text_white: string;
645
- sys_text_brand_primary: string;
646
- sys_text_error_01: string;
647
- sys_widget_grey_01: string;
648
- sys_widget_grey_02: string;
649
- sys_widget_grey_03: string;
650
- sys_widget_primary_01: string;
651
- sys_widget_error_01: string;
652
- sys_widget_warning_01: string;
653
- sys_widget_success_01: string;
654
- sys_widget_white: string;
655
- sys_border_area_01: string;
656
- sys_border_line_01: string;
657
- sys_border_line_02: string;
658
- sys_border_line_03: string;
659
- sys_border_line_04: string;
660
- sys_border_line_05: string;
661
- sys_component_base_01: string;
662
- sys_component_base_02: string;
663
- sys_component_base_03: string;
664
- sys_component_base_red: string;
665
- sys_component_base_white: string;
666
- sys_component_base_white_opacity00: string;
667
- sys_on_base_white_opacity00: string;
668
- sys_on_base_white_opacity30: string;
669
- sys_on_base_black_opacity20: string;
670
- usr_brand_primary: string;
671
- usr_brand_secondary: string;
672
- usr_brand_secondary_variant: string;
673
- usr_background: string;
674
- usr_surface: string;
675
- usr_border: string;
676
- usr_on_brand_primary: string;
677
- usr_on_brand_secondary: string;
678
- usr_on_background: string;
679
- usr_on_surface: string;
680
- sys_widget_status_active_01: string;
681
- sys_text_success_01: string;
682
- sys_widget_grey_04: string;
683
- sys_text_active: string;
684
- sys_component_base_blue: string;
685
- sys_on_base_black_opacity65: string;
686
- sys_component_base_04: string;
687
- sys_component_base_black: string;
688
- sys_component_base_black_opacity00: string;
689
- usr_text_brand_secondary_variant: string;
690
- usr_text_brand_primary: string;
691
- usr_text_brand_on_primary: string;
692
- sys_text_brand_secondary_variant: string;
693
- sys_component_base_navy: string;
694
- sys_widget_lightgreen: string;
695
- sys_border_line_06: string;
696
- sys_background_dimmed_20: string;
697
- sys_widget_pink: string;
698
- sys_widget_primary_opacity20: string;
699
- sys_widget_secondary_variant_01: string;
700
- usr_component_base_brand_primary_opacity10: string;
701
- sys_temp_grey_01: string;
702
- sys_temp_grey_02: string;
703
- sys_temp_grey_03: string;
704
- sys_temp_grey_04: string;
705
- sys_temp_grey_05: string;
706
- sys_temp_white: string;
707
- sys_temp_primary_01: string;
708
- sys_temp_secondary_01: string;
709
- sys_temp_red: string;
710
- sys_temp_white_opacity_00: string;
711
- sys_temp_dimmed: string;
712
- sys_temp_black: string;
713
- sys_temp_primary_02: string;
714
- sys_temp_primary_03: string;
715
- sys_temp_secondary_02: string;
716
- sys_temp_lightgreen_01: string;
717
- sys_text_grey_04: string;
718
- sys_papp_post_social_background: string;
719
- sys_papp_post_notice_background: string;
720
- sys_papp_post_free_background: string;
721
- sys_papp_vod_background: string;
722
- sys_papp_vodplus_background: string;
723
- sys_papp_live_background: string;
724
- sys_selcontrols_base_off_disabled: string;
725
- sys_selcontrols_base_on_disabled: string;
726
- sys_component_base_blue_opacity10: string;
727
- sys_component_base_05: string;
728
- sys_background_dimmed_65: string;
729
- sys_temp_grey_06: string;
730
- sys_on_base_white_opacity10: string;
731
- sys_on_base_black_opacity10: string;
732
- sys_component_base_05_opacity00: string;
733
- sys_papp_post_notice_link: string;
734
- sys_component_base_navy_light: string;
735
- sys_component_base_orange: string;
736
- sys_component_base_grey: string;
737
- sys_component_base_black_opacity80: string;
738
- sys_text_darkgrey_02: string;
739
- sys_border_line_darktheme_01: string;
740
- sys_border_line_darktheme_02: string;
741
- sys_component_base_darktheme_01: string;
742
- sys_component_base_darktheme_02: string;
743
- sys_component_base_darktheme_03: string;
744
- sys_text_grey_darktheme_01: string;
745
- sys_text_grey_darktheme_02: string;
746
- sys_text_grey_darktheme_03: string;
747
- sys_widget_grey_darktheme_01: string;
748
- sys_widget_grey_darktheme_02: string;
749
- sys_widget_grey_darktheme_03: string;
750
- sys_component_base_green: string;
751
- sys_text_error_darktheme_01: string;
752
- sys_border_line_darktheme_03: string;
753
- sys_border_line_darktheme_04: string;
754
- usr_widget_brand_primary_darktheme_01: string;
755
- usr_text_brand_primary_darktheme_01: string;
756
- sys_component_base_black_opacity50: string;
757
- sys_component_base_card: string;
758
- sys_cpnt_textlabel_sys_brand_primary_opacity50: string;
759
- sys_widget_green_01: string;
760
- sys_component_base_black_opacity30: string;
761
- sys_area_background: string;
762
- sys_border_white_opacity30: string;
766
+ ui_pagemenucontainer_background_wt: string;
767
+ ui_contentscontainer_background_wt: string;
768
+ ui_pagemenuarea_background_wt: string;
769
+ ui_contentsarea_background_wt: string;
770
+ ui_cpnt_standardbanner_base_default: string;
763
771
  };
764
772
  };
765
773
  export default colorSet;
@@ -4,14 +4,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
4
4
  };
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
- var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
7
  var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
- var UIColor_json_1 = __importDefault(require("./UIColor.json"));
10
8
  var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
+ var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
10
+ var UIColor_json_1 = __importDefault(require("./UIColor.json"));
11
11
  var colorSet = {
12
- SemanticColor: SemanticColor_json_1.default,
13
12
  PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
- UIColor: UIColor_json_1.default,
15
- PaletteColor_light: PaletteColor_light_json_1.default
13
+ PaletteColor_light: PaletteColor_light_json_1.default,
14
+ SemanticColor: SemanticColor_json_1.default,
15
+ UIColor: UIColor_json_1.default
16
16
  };
17
17
  exports.default = colorSet;
@@ -448,4 +448,9 @@ export interface UITheme {
448
448
  ui_37: string;
449
449
  ui_39: string;
450
450
  ui_cpnt_divider_white_opacity30: string;
451
+ ui_pagemenucontainer_background_wt: string;
452
+ ui_contentscontainer_background_wt: string;
453
+ ui_pagemenuarea_background_wt: string;
454
+ ui_contentsarea_background_wt: string;
455
+ ui_cpnt_standardbanner_base_default: string;
451
456
  }
@@ -29,7 +29,6 @@ export declare const theme: {
29
29
  form2: string;
30
30
  blog1: string;
31
31
  singleLine: string;
32
- btn: string;
33
32
  };
34
33
  mobileFontSize: {
35
34
  displayHeading: string;
@@ -57,7 +56,6 @@ export declare const theme: {
57
56
  form2: string;
58
57
  blog1: string;
59
58
  singleLine: string;
60
- btn: string;
61
59
  };
62
60
  uiColors: import("..").UITheme;
63
61
  };
@@ -29,7 +29,6 @@ export declare const desktopLineHeight: {
29
29
  form2: string;
30
30
  blog1: string;
31
31
  singleLine: string;
32
- btn: string;
33
32
  };
34
33
  export declare const mobileFontSize: {
35
34
  displayHeading: string;
@@ -57,7 +56,6 @@ export declare const mobileLineHeight: {
57
56
  form2: string;
58
57
  blog1: string;
59
58
  singleLine: string;
60
- btn: string;
61
59
  };
62
60
  export declare const boxShadow: {
63
61
  elevation0: string;
@@ -42,8 +42,7 @@ exports.desktopLineHeight = {
42
42
  form1: '1.6',
43
43
  form2: '1.6',
44
44
  blog1: '1.6',
45
- singleLine: 'normal',
46
- btn: '1'
45
+ singleLine: '1'
47
46
  };
48
47
  exports.mobileFontSize = {
49
48
  displayHeading: '32px',
@@ -70,8 +69,7 @@ exports.mobileLineHeight = {
70
69
  form1: '1.6',
71
70
  form2: '1.6',
72
71
  blog1: '1.6',
73
- singleLine: 'normal',
74
- btn: '1'
72
+ singleLine: '1'
75
73
  };
76
74
  exports.boxShadow = {
77
75
  elevation0: '0 0 0 0 #0003',
@@ -30,7 +30,6 @@ export interface PdsDevKitTheme {
30
30
  form2: string;
31
31
  blog1: string;
32
32
  singleLine: string;
33
- btn: string;
34
33
  };
35
34
  mobileFontSize: {
36
35
  displayHeading: string;
@@ -58,7 +57,6 @@ export interface PdsDevKitTheme {
58
57
  form2: string;
59
58
  blog1: string;
60
59
  singleLine: string;
61
- btn: string;
62
60
  };
63
61
  boxShadow: {
64
62
  elevation0: string;
@@ -29,21 +29,21 @@ function Chip(_a) {
29
29
  return (react_1.default.createElement(S_CategoryChoiceChip, { isActive: chipId === activeChipId, onClick: handleClick },
30
30
  chipId !== activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
31
31
  react_1.default.createElement(Icon_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }))),
32
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
32
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
33
33
  chipId === activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
34
34
  react_1.default.createElement(Icon_1.Icon, { size: 12, fillType: "line", iconName: "ic_xmark", colorKey: "ui_cpnt_chip_fill_icon_active_01" })))));
35
35
  case 'information':
36
36
  return (react_1.default.createElement(S_InfoChip, { onClick: handleClick },
37
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", btnMode: "use", colorTheme: "sysTextPrimary" })));
37
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary" })));
38
38
  case 'label':
39
39
  return (react_1.default.createElement(S_LabelChip, { onClick: handleClick },
40
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextTertiary" })));
40
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary" })));
41
41
  case 'time':
42
42
  return (react_1.default.createElement(S_TimeChip, { onClick: handleClick },
43
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextWhite" })));
43
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite" })));
44
44
  case 'removable':
45
45
  return (react_1.default.createElement(S_RemovableChip, { onClick: handleClick },
46
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: "sysTextSecondary" }),
46
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary" }),
47
47
  react_1.default.createElement(S_XIconWrapper, { onClick: handleClickXMarkIcon },
48
48
  react_1.default.createElement(Icon_1.Icon, { size: 12, iconName: "ic_xmark", fillType: "line", colorKey: "ui_cpnt_chip_fill_icon_inactive" }))));
49
49
  default:
@@ -52,7 +52,7 @@ function Chip(_a) {
52
52
  react_1.default.createElement(Icon_1.Icon, { fillType: iconFillType, iconName: iconName, size: 16, colorKey: chipId === activeChipId
53
53
  ? 'ui_cpnt_chip_fill_icon_active_01'
54
54
  : 'ui_cpnt_chip_line_icon_02' }))),
55
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
55
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
56
56
  }
57
57
  };
58
58
  return react_1.default.createElement(S_ChipWrapper, null, chipType());
@@ -41,7 +41,7 @@ function DesktopTabBar(_a) {
41
41
  };
42
42
  var textLabel = function (value, isSubText) {
43
43
  if (isSubText) {
44
- return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', btnMode: "use" }));
44
+ return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
45
45
  }
46
46
  if (styleTheme === 'content') {
47
47
  return (react_1.default.createElement(TextLabel_1.TextLabel, { text: value.title, styleTheme: pathname === value.path ? 'caption1Bold' : 'caption1Regular', colorTheme: pathname === value.path ? 'sysTextPrimary' : 'sysTextSecondary', singleLineMode: "use" }));
@@ -101,6 +101,7 @@ function EditApplyTextField(_a) {
101
101
  }
102
102
  var handleKeyUp = function (e) {
103
103
  if (textLineType === 'single' && e.key === 'Enter') {
104
+ e.preventDefault();
104
105
  e.target.blur();
105
106
  handleSubmit();
106
107
  }
@@ -59,11 +59,11 @@ function FloatingActionButton(_a) {
59
59
  displayType === 'icon_only' && (react_1.default.createElement(S_ButtonIconOnly, { size: size, fontWeight: fontWeight, colorTheme: colorTheme, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
60
60
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' ? 20 : 24, colorKey: iconColor(), fillType: iconFillType }))),
61
61
  displayType !== 'icon_only' && (react_1.default.createElement(S_Button, { size: size, fontWeight: fontWeight, colorTheme: colorTheme, state: state, disabled: state === 'disabled', onClick: handleClick, onMouseDown: handleMouseDown },
62
- displayType === 'text_only' && (react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })),
62
+ displayType === 'text_only' && (react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })),
63
63
  displayType === 'icon_text' && (react_1.default.createElement(react_1.default.Fragment, null,
64
64
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: 20, colorKey: iconColor(), fillType: iconFillType }),
65
65
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_b", spacingType: "width" }),
66
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })))))));
66
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "body1Bold", singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandOnPrimary', colorOverride: state === 'disabled' ? 'ui_cpnt_button_text_darktheme_disabled' : undefined })))))));
67
67
  }
68
68
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 24px;\n height: 48px;\n width: 48px;\n"], ["\n border-radius: 24px;\n height: 48px;\n width: 48px;\n"])));
69
69
  var xlarge = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: 32px;\n height: 64px;\n width: 64px;\n"], ["\n border-radius: 32px;\n height: 64px;\n width: 64px;\n"])));
@@ -98,7 +98,7 @@ function MainButton(_a) {
98
98
  size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
99
99
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
100
100
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
101
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[fillType], colorOverride: selectTextThemeColor() }),
101
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[fillType], colorOverride: selectTextThemeColor() }),
102
102
  size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
103
103
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
104
104
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
@@ -100,7 +100,7 @@ function ReactionButton(_a) {
100
100
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
101
101
  react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "fill", iconName: iconName, colorKey: colorTheme === 'none' ? IconColorByStatus() : IconColorByColorByTheme() }),
102
102
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
103
- react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Regular", btnMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() })));
103
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Regular", singleLineMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() })));
104
104
  }
105
105
  var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: 'pointer';\n display: flex;\n justify-content: center;\n padding: 0;\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n cursor: 'pointer';\n display: flex;\n justify-content: center;\n padding: 0;\n"])));
106
106
  var S_ReactionButton = styled_components_1.default.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), ReactionButtonStyle);
@@ -37,7 +37,7 @@ function StatusBlock(_a) {
37
37
  small: 'body2Bold'
38
38
  };
39
39
  return (react_1.default.createElement(S_StatusBlock, { size: size, state: state, "$width": width },
40
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textLabelStyleThemeObj[size], textAlign: "center", btnMode: "use", colorTheme: "sysTextWhite" })));
40
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textLabelStyleThemeObj[size], textAlign: "center", singleLineMode: "use", colorTheme: "sysTextWhite" })));
41
41
  }
42
42
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 8px;\n height: 48px;\n"], ["\n border-radius: 8px;\n height: 48px;\n"])));
43
43
  var medium = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: 8px;\n height: 40px;\n"], ["\n border-radius: 8px;\n height: 40px;\n"])));
@@ -68,7 +68,7 @@ function TextButton(_a) {
68
68
  xsmall: 'caption1Regular'
69
69
  };
70
70
  return (react_1.default.createElement(S_Button, __assign({}, rest, { size: size, responsiveMode: responsiveMode, onClick: handleClick, type: type, fontWeight: fontWeight, disabled: state === 'disabled' }),
71
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', btnMode: "use" })));
71
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', singleLineMode: "use" })));
72
72
  }
73
73
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 48px;\n ", ";\n"], ["\n height: 48px;\n ", ";\n"])), function (_a) {
74
74
  var size = _a.size;
@@ -10,7 +10,6 @@ export declare type TextLabelProps = {
10
10
  singleLineMode?: 'none' | 'use';
11
11
  ellipsisMode?: 'none' | 'use';
12
12
  lineLimit?: number;
13
- btnMode?: 'none' | 'use';
14
13
  };
15
14
  export declare type TextStyleProps = {
16
15
  textAlign?: 'left' | 'center' | 'right';
@@ -21,7 +20,6 @@ export declare type TextStyleProps = {
21
20
  singleLineMode?: 'none' | 'use';
22
21
  ellipsisMode?: 'none' | 'use';
23
22
  lineLimit?: number;
24
- btnMode?: 'none' | 'use';
25
23
  };
26
- declare function TextLabel({ text, textAlign, styleTheme, colorOverride, colorTheme, underline, singleLineMode, ellipsisMode, lineLimit, btnMode }: TextLabelProps): JSX.Element;
24
+ declare function TextLabel({ text, textAlign, styleTheme, colorOverride, colorTheme, underline, singleLineMode, ellipsisMode, lineLimit }: TextLabelProps): JSX.Element;
27
25
  export default TextLabel;
@@ -30,8 +30,8 @@ var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
31
  var common_1 = require("../../../common");
32
32
  function TextLabel(_a) {
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.underline, underline = _e === void 0 ? 'none' : _e, _f = _a.singleLineMode, singleLineMode = _f === void 0 ? 'none' : _f, _g = _a.ellipsisMode, ellipsisMode = _g === void 0 ? 'none' : _g, lineLimit = _a.lineLimit, _h = _a.btnMode, btnMode = _h === void 0 ? 'none' : _h;
34
- return (react_1.default.createElement(S_TextLabel, { textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, underline: underline, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, btnMode: btnMode }, text));
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.underline, underline = _e === void 0 ? 'none' : _e, _f = _a.singleLineMode, singleLineMode = _f === void 0 ? 'none' : _f, _g = _a.ellipsisMode, ellipsisMode = _g === void 0 ? 'none' : _g, lineLimit = _a.lineLimit;
34
+ return (react_1.default.createElement(S_TextLabel, { textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, underline: underline, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit }, text));
35
35
  }
36
36
  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) {
37
37
  var theme = _a.theme;
@@ -251,7 +251,7 @@ var ellipsisStyle = (0, styled_components_1.css)(templateObject_29 || (templateO
251
251
  var lineLimit = _a.lineLimit;
252
252
  return lineLimit;
253
253
  });
254
- var S_TextLabel = styled_components_1.default.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"], ["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (_a) {
254
+ var S_TextLabel = styled_components_1.default.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"], ["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (_a) {
255
255
  var textAlign = _a.textAlign;
256
256
  return textAlign;
257
257
  }, function (_a) {
@@ -295,11 +295,10 @@ var S_TextLabel = styled_components_1.default.div(templateObject_30 || (template
295
295
  usrTextBrandOnPrimary: usrTextBrandOnPrimary
296
296
  }[colorTheme];
297
297
  }, function (_a) {
298
- var singleLineMode = _a.singleLineMode, theme = _a.theme;
299
- return singleLineMode === 'use' && "line-height: " + theme.desktopLineHeight.singleLine;
300
- }, function (_a) {
301
- var btnMode = _a.btnMode, theme = _a.theme;
302
- return btnMode === 'use' && "line-height: " + theme.desktopLineHeight.btn;
298
+ var singleLineMode = _a.singleLineMode, ellipsisMode = _a.ellipsisMode, theme = _a.theme;
299
+ return singleLineMode === 'use' &&
300
+ ellipsisMode === 'none' &&
301
+ "line-height: " + theme.desktopLineHeight.singleLine;
303
302
  }, function (_a) {
304
303
  var ellipsisMode = _a.ellipsisMode, lineLimit = _a.lineLimit;
305
304
  return ellipsisMode === 'use' && lineLimit && ellipsisStyle;
@@ -64,7 +64,7 @@ function UploadMainButton(_a) {
64
64
  size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
65
65
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
66
66
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
67
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : types_1.textColors[fillType], colorOverride: selectTextThemeColor() }),
67
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : types_1.textColors[fillType], colorOverride: selectTextThemeColor() }),
68
68
  size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
69
69
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
70
70
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
@@ -45,7 +45,7 @@ function UploadTextButton(_a) {
45
45
  };
46
46
  return (react_1.default.createElement(S_UploadTextButton, { size: size, responsiveMode: responsiveMode, fontWeight: fontWeight, disabled: state === 'disabled' },
47
47
  react_1.default.createElement("input", { type: "file", hidden: true, disabled: state === 'disabled', accept: accept, multiple: multipleMode === 'use', onChange: handleClick }),
48
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', btnMode: "use" })));
48
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', singleLineMode: "use" })));
49
49
  }
50
50
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 48px;\n width: ", ";\n"], ["\n height: 48px;\n width: ", ";\n"])), function (_a) {
51
51
  var size = _a.size;
@@ -29,21 +29,21 @@ function Chip(_a) {
29
29
  return (react_1.default.createElement(S_CategoryChoiceChip, { isActive: chipId === activeChipId, onClick: handleClick },
30
30
  chipId !== activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
31
31
  react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "line", iconName: "ic_filter", colorKey: "ui_cpnt_chip_line_icon_01" }))),
32
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
32
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextPrimary' }),
33
33
  chipId === activeChipId && (react_1.default.createElement(S_CategoryIconWrapper, { isActive: chipId === activeChipId },
34
34
  react_1.default.createElement(hybrid_1.Icon, { size: 12, fillType: "line", iconName: "ic_xmark", colorKey: "ui_cpnt_chip_fill_icon_active_01" })))));
35
35
  case 'information':
36
36
  return (react_1.default.createElement(S_InfoChip, { onClick: handleClick },
37
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", btnMode: "use", colorTheme: "sysTextPrimary" })));
37
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Regular", singleLineMode: "use", colorTheme: "sysTextPrimary" })));
38
38
  case 'label':
39
39
  return (react_1.default.createElement(S_LabelChip, { onClick: handleClick },
40
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextTertiary" })));
40
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextTertiary" })));
41
41
  case 'time':
42
42
  return (react_1.default.createElement(S_TimeChip, { onClick: handleClick },
43
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", btnMode: "use", colorTheme: "sysTextWhite" })));
43
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption2Bold", singleLineMode: "use", colorTheme: "sysTextWhite" })));
44
44
  case 'removable':
45
45
  return (react_1.default.createElement(S_RemovableChip, { onClick: handleClick },
46
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: "sysTextSecondary" }),
46
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: "sysTextSecondary" }),
47
47
  react_1.default.createElement(S_XIconWrapper, { onClick: handleClickXMarkIcon },
48
48
  react_1.default.createElement(hybrid_1.Icon, { size: 12, iconName: "ic_xmark", fillType: "line", colorKey: "ui_cpnt_chip_fill_icon_inactive" }))));
49
49
  default:
@@ -52,7 +52,7 @@ function Chip(_a) {
52
52
  react_1.default.createElement(hybrid_1.Icon, { fillType: iconFillType, iconName: iconName, size: 16, colorKey: chipId === activeChipId
53
53
  ? 'ui_cpnt_chip_fill_icon_active_01'
54
54
  : 'ui_cpnt_chip_line_icon_02' }))),
55
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", btnMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
55
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: "caption1Regular", singleLineMode: "use", colorTheme: chipId === activeChipId ? 'usrTextBrandOnPrimary' : 'sysTextSecondary' })));
56
56
  }
57
57
  };
58
58
  return react_1.default.createElement(S_ChipWrapper, null, chipType());
@@ -98,7 +98,7 @@ function MainButton(_a) {
98
98
  size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
99
99
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
100
100
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
101
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[fillType], colorOverride: selectTextThemeColor() }),
101
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : textColor[fillType], colorOverride: selectTextThemeColor() }),
102
102
  size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
103
103
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
104
104
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
@@ -100,7 +100,7 @@ function ReactionButton(_a) {
100
100
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
101
101
  react_1.default.createElement(hybrid_1.Icon, { size: 16, fillType: "fill", iconName: iconName, colorKey: colorTheme === 'none' ? IconColorByStatus() : IconColorByColorByTheme() }),
102
102
  react_1.default.createElement(hybrid_1.Spacing, { size: "spacing_a", spacingType: "width" }),
103
- react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Regular", btnMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() })));
103
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: convertFormatHelper(text), styleTheme: "body2Regular", singleLineMode: "use", colorTheme: TextLabelColorBySelect(), colorOverride: TextLabelColorByByColorTheme() })));
104
104
  }
105
105
  var ReactionButtonStyle = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n background-color: transparent;\n border: none;\n display: flex;\n justify-content: center;\n padding: 0;\n"], ["\n align-items: center;\n background-color: transparent;\n border: none;\n display: flex;\n justify-content: center;\n padding: 0;\n"])));
106
106
  var S_ReactionButton = styled_components_1.default.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), ReactionButtonStyle);
@@ -37,7 +37,7 @@ function StatusBlock(_a) {
37
37
  small: 'body2Bold'
38
38
  };
39
39
  return (react_1.default.createElement(S_StatusBlock, { size: size, state: state, "$width": width },
40
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textLabelStyleThemeObj[size], textAlign: "center", btnMode: "use", colorTheme: "sysTextWhite" })));
40
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textLabelStyleThemeObj[size], textAlign: "center", singleLineMode: "use", colorTheme: "sysTextWhite" })));
41
41
  }
42
42
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-radius: 8px;\n height: 48px;\n"], ["\n border-radius: 8px;\n height: 48px;\n"])));
43
43
  var medium = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n border-radius: 8px;\n height: 40px;\n"], ["\n border-radius: 8px;\n height: 40px;\n"])));
@@ -68,7 +68,7 @@ function TextButton(_a) {
68
68
  xsmall: 'caption1Regular'
69
69
  };
70
70
  return (react_1.default.createElement(S_Button, __assign({}, rest, { size: size, responsiveMode: responsiveMode, onClick: handleClick, type: type, fontWeight: fontWeight, disabled: state === 'disabled' }),
71
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', btnMode: "use" })));
71
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', singleLineMode: "use" })));
72
72
  }
73
73
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 48px;\n ", ";\n"], ["\n height: 48px;\n ", ";\n"])), function (_a) {
74
74
  var size = _a.size;
@@ -10,7 +10,6 @@ export declare type TextLabelProps = {
10
10
  singleLineMode?: 'none' | 'use';
11
11
  ellipsisMode?: 'none' | 'use';
12
12
  lineLimit?: number;
13
- btnMode?: 'none' | 'use';
14
13
  };
15
14
  export declare type TextStyleProps = {
16
15
  textAlign?: 'left' | 'center' | 'right';
@@ -21,7 +20,6 @@ export declare type TextStyleProps = {
21
20
  singleLineMode?: 'none' | 'use';
22
21
  ellipsisMode?: 'none' | 'use';
23
22
  lineLimit?: number;
24
- btnMode?: 'none' | 'use';
25
23
  };
26
- declare function TextLabel({ text, textAlign, styleTheme, colorOverride, colorTheme, underline, singleLineMode, ellipsisMode, lineLimit, btnMode }: TextLabelProps): JSX.Element;
24
+ declare function TextLabel({ text, textAlign, styleTheme, colorOverride, colorTheme, underline, singleLineMode, ellipsisMode, lineLimit }: TextLabelProps): JSX.Element;
27
25
  export default TextLabel;
@@ -30,8 +30,8 @@ var react_1 = __importDefault(require("react"));
30
30
  var styled_components_1 = __importStar(require("styled-components"));
31
31
  var common_1 = require("../../../common");
32
32
  function TextLabel(_a) {
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.underline, underline = _e === void 0 ? 'none' : _e, _f = _a.singleLineMode, singleLineMode = _f === void 0 ? 'none' : _f, _g = _a.ellipsisMode, ellipsisMode = _g === void 0 ? 'none' : _g, lineLimit = _a.lineLimit, _h = _a.btnMode, btnMode = _h === void 0 ? 'none' : _h;
34
- return (react_1.default.createElement(S_TextLabel, { textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, underline: underline, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit, btnMode: btnMode }, text));
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.underline, underline = _e === void 0 ? 'none' : _e, _f = _a.singleLineMode, singleLineMode = _f === void 0 ? 'none' : _f, _g = _a.ellipsisMode, ellipsisMode = _g === void 0 ? 'none' : _g, lineLimit = _a.lineLimit;
34
+ return (react_1.default.createElement(S_TextLabel, { textAlign: textAlign, styleTheme: styleTheme, colorOverride: colorOverride, colorTheme: colorTheme, underline: underline, singleLineMode: singleLineMode, ellipsisMode: ellipsisMode, lineLimit: lineLimit }, text));
35
35
  }
36
36
  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) {
37
37
  var theme = _a.theme;
@@ -251,7 +251,7 @@ var ellipsisStyle = (0, styled_components_1.css)(templateObject_29 || (templateO
251
251
  var lineLimit = _a.lineLimit;
252
252
  return lineLimit;
253
253
  });
254
- var S_TextLabel = styled_components_1.default.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"], ["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (_a) {
254
+ var S_TextLabel = styled_components_1.default.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"], ["\n box-sizing: border-box;\n text-align: ", ";\n text-decoration: ", ";\n white-space: pre-wrap;\n word-break: break-all;\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (_a) {
255
255
  var textAlign = _a.textAlign;
256
256
  return textAlign;
257
257
  }, function (_a) {
@@ -295,11 +295,10 @@ var S_TextLabel = styled_components_1.default.div(templateObject_30 || (template
295
295
  usrTextBrandOnPrimary: usrTextBrandOnPrimary
296
296
  }[colorTheme];
297
297
  }, function (_a) {
298
- var singleLineMode = _a.singleLineMode, theme = _a.theme;
299
- return singleLineMode === 'use' && "line-height: " + theme.desktopLineHeight.singleLine;
300
- }, function (_a) {
301
- var btnMode = _a.btnMode, theme = _a.theme;
302
- return btnMode === 'use' && "line-height: " + theme.desktopLineHeight.btn;
298
+ var singleLineMode = _a.singleLineMode, ellipsisMode = _a.ellipsisMode, theme = _a.theme;
299
+ return singleLineMode === 'use' &&
300
+ ellipsisMode === 'none' &&
301
+ "line-height: " + theme.desktopLineHeight.singleLine;
303
302
  }, function (_a) {
304
303
  var ellipsisMode = _a.ellipsisMode, lineLimit = _a.lineLimit;
305
304
  return ellipsisMode === 'use' && lineLimit && ellipsisStyle;
@@ -64,7 +64,7 @@ function UploadMainButton(_a) {
64
64
  size !== 'xsmall' && iconMode === 'left' && (react_1.default.createElement(react_1.default.Fragment, null,
65
65
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType }),
66
66
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }))),
67
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], btnMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : types_1.textColors[fillType], colorOverride: selectTextThemeColor() }),
67
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: types_1.textStyles[size], singleLineMode: "use", colorTheme: state === 'disabled' ? 'sysTextTertiary' : types_1.textColors[fillType], colorOverride: selectTextThemeColor() }),
68
68
  size !== 'xsmall' && iconMode === 'right' && (react_1.default.createElement(react_1.default.Fragment, null,
69
69
  react_1.default.createElement(hybrid_1.Spacing, { size: size === 'large' || size === 'rlarge' ? 'spacing_b' : 'spacing_a', spacingType: "width" }),
70
70
  react_1.default.createElement(hybrid_1.Icon, { iconName: iconName, size: size === 'large' || size === 'rlarge' ? 20 : 16, colorKey: iconColor(), fillType: iconFillType })))));
@@ -45,7 +45,7 @@ function UploadTextButton(_a) {
45
45
  };
46
46
  return (react_1.default.createElement(S_UploadTextButton, { size: size, responsiveMode: responsiveMode, fontWeight: fontWeight, disabled: state === 'disabled' },
47
47
  react_1.default.createElement("input", { type: "file", hidden: true, disabled: state === 'disabled', accept: accept, multiple: multipleMode === 'use', onChange: handleClick }),
48
- react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', btnMode: "use" })));
48
+ react_1.default.createElement(TextLabel_1.TextLabel, { text: text, styleTheme: textStyle[size], colorTheme: state === 'disabled' ? 'sysTextTertiary' : 'usrTextBrandPrimary', singleLineMode: "use" })));
49
49
  }
50
50
  var large = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n height: 48px;\n width: ", ";\n"], ["\n height: 48px;\n width: ", ";\n"])), function (_a) {
51
51
  var size = _a.size;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "0.6.2",
3
+ "version": "0.6.3",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",