pds-dev-kit-web 1.9.19 → 1.9.21

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 (14) hide show
  1. package/dist/src/common/styles/colorSet/PaletteColor_Dark.json +9 -1
  2. package/dist/src/common/styles/colorSet/PaletteColor_light.json +9 -1
  3. package/dist/src/common/styles/colorSet/SemanticColor.json +6 -1
  4. package/dist/src/common/styles/colorSet/UIColor.json +10 -1
  5. package/dist/src/common/styles/colorSet/index.d.ts +32 -2
  6. package/dist/src/common/styles/colorSet/index.js +4 -4
  7. package/dist/src/common/styles/colorSet/ui-type.d.ts +9 -0
  8. package/dist/src/desktop/components/AdminList/AdminList.d.ts +1 -1
  9. package/dist/src/desktop/components/AdminList/HeaderRow.d.ts +1 -1
  10. package/dist/src/desktop/components/AdminList/HeaderRow.js +10 -9
  11. package/dist/src/desktop/components/AdminListItem/AdminListItem.d.ts +1 -1
  12. package/dist/src/desktop/components/AdminListItem/AdminListItem.js +37 -23
  13. package/package.json +1 -1
  14. package/release-note.md +6 -12
package/dist/src/common/styles/colorSet/PaletteColor_Dark.json CHANGED
@@ -270,5 +270,13 @@
270
270
  "sys_cpnt_sheet_base_08": "green700",
271
271
  "sys_cpnt_sheet_base_09": "darkblue50",
272
272
  "sys_cpnt_sheet_base_10": "darkred500",
273
- "sys_component_base_29": "grey30"
273
+ "sys_component_base_29": "grey30",
274
+ "sys_storyboard_group_base_grey01": "grey10",
275
+ "sys_storyboard_group_base_blue01": "blue10",
276
+ "sys_storyboard_group_base_red01": "red10",
277
+ "sys_storyboard_group_base_green01": "green10",
278
+ "sys_storyboard_card_base_blue01": "blue30",
279
+ "sys_storyboard_card_base_red01": "red30",
280
+ "sys_storyboard_card_base_green01": "green50",
281
+ "sys_brand_secondary_variant": "darkgreen700"
274
282
  }
package/dist/src/common/styles/colorSet/PaletteColor_light.json CHANGED
@@ -270,5 +270,13 @@
270
270
  "sys_cpnt_sheet_base_08": "green700",
271
271
  "sys_cpnt_sheet_base_09": "blue50",
272
272
  "sys_cpnt_sheet_base_10": "red500",
273
- "sys_component_base_29": "grey30"
273
+ "sys_component_base_29": "grey30",
274
+ "sys_storyboard_group_base_grey01": "grey10",
275
+ "sys_storyboard_group_base_blue01": "blue10",
276
+ "sys_storyboard_group_base_red01": "red10",
277
+ "sys_storyboard_group_base_green01": "green10",
278
+ "sys_storyboard_card_base_blue01": "blue30",
279
+ "sys_storyboard_card_base_red01": "red30",
280
+ "sys_storyboard_card_base_green01": "green50",
281
+ "sys_brand_secondary_variant": "green700"
274
282
  }
package/dist/src/common/styles/colorSet/SemanticColor.json CHANGED
@@ -94,5 +94,10 @@
94
94
  "grey10": "#fbfbfd",
95
95
  "darkgrey10": "#0E0E0E",
96
96
  "blue50": "#e9ecfd",
97
- "darkblue50": "#303139"
97
+ "darkblue50": "#303139",
98
+ "blue10": "#F6F6FF",
99
+ "red10": "#FFF1F1",
100
+ "green10": "#EEFFFA",
101
+ "blue30": "#E3E7FF",
102
+ "red30": "#FFE4E4"
98
103
  }
package/dist/src/common/styles/colorSet/UIColor.json CHANGED
@@ -733,5 +733,14 @@
733
733
  "ui_domain_record_card_status_3": "sys_component_base_red",
734
734
  "ui_domain_record_card_status_4": "sys_component_base_grey",
735
735
  "ui_cpnt_button_fill_base_tutorialmodal": "sys_component_base_black_opacity30",
736
- "ui_cpnt_toolbar_base": "sys_component_base_white_opacity00"
736
+ "ui_cpnt_toolbar_base": "sys_component_base_white_opacity00",
737
+ "ui_76": "sys_border_line_darktheme_07",
738
+ "ui_89": "sys_storyboard_group_base_grey01",
739
+ "ui_90": "sys_storyboard_group_base_blue01",
740
+ "ui_91": "sys_storyboard_group_base_red01",
741
+ "ui_92": "sys_storyboard_group_base_green01",
742
+ "ui_93": "sys_storyboard_card_base_blue01",
743
+ "ui_94": "sys_storyboard_card_base_red01",
744
+ "ui_95": "sys_storyboard_card_base_green01",
745
+ "ui_cpnt_icon_sys_brandsecondary_variant": "sys_brand_secondary_variant"
737
746
  }
package/dist/src/common/styles/colorSet/index.d.ts CHANGED
@@ -96,8 +96,13 @@ declare const colorSet: {
96
96
  darkgrey10: string;
97
97
  blue50: string;
98
98
  darkblue50: string;
99
+ blue10: string;
100
+ red10: string;
101
+ green10: string;
102
+ blue30: string;
103
+ red30: string;
99
104
  };
100
- readonly PaletteColor_light: {
105
+ readonly PaletteColor_Dark: {
101
106
  sys_container_background_01: string;
102
107
  sys_container_background_02: string;
103
108
  sys_container_background_03: string;
@@ -370,6 +375,14 @@ declare const colorSet: {
370
375
  sys_cpnt_sheet_base_09: string;
371
376
  sys_cpnt_sheet_base_10: string;
372
377
  sys_component_base_29: string;
378
+ sys_storyboard_group_base_grey01: string;
379
+ sys_storyboard_group_base_blue01: string;
380
+ sys_storyboard_group_base_red01: string;
381
+ sys_storyboard_group_base_green01: string;
382
+ sys_storyboard_card_base_blue01: string;
383
+ sys_storyboard_card_base_red01: string;
384
+ sys_storyboard_card_base_green01: string;
385
+ sys_brand_secondary_variant: string;
373
386
  };
374
387
  readonly UIColor: {
375
388
  ui_cpnt_button_fill_base_primary: string;
@@ -1107,8 +1120,17 @@ declare const colorSet: {
1107
1120
  ui_domain_record_card_status_4: string;
1108
1121
  ui_cpnt_button_fill_base_tutorialmodal: string;
1109
1122
  ui_cpnt_toolbar_base: string;
1123
+ ui_76: string;
1124
+ ui_89: string;
1125
+ ui_90: string;
1126
+ ui_91: string;
1127
+ ui_92: string;
1128
+ ui_93: string;
1129
+ ui_94: string;
1130
+ ui_95: string;
1131
+ ui_cpnt_icon_sys_brandsecondary_variant: string;
1110
1132
  };
1111
- readonly PaletteColor_Dark: {
1133
+ readonly PaletteColor_light: {
1112
1134
  sys_container_background_01: string;
1113
1135
  sys_container_background_02: string;
1114
1136
  sys_container_background_03: string;
@@ -1381,6 +1403,14 @@ declare const colorSet: {
1381
1403
  sys_cpnt_sheet_base_09: string;
1382
1404
  sys_cpnt_sheet_base_10: string;
1383
1405
  sys_component_base_29: string;
1406
+ sys_storyboard_group_base_grey01: string;
1407
+ sys_storyboard_group_base_blue01: string;
1408
+ sys_storyboard_group_base_red01: string;
1409
+ sys_storyboard_group_base_green01: string;
1410
+ sys_storyboard_card_base_blue01: string;
1411
+ sys_storyboard_card_base_red01: string;
1412
+ sys_storyboard_card_base_green01: string;
1413
+ sys_brand_secondary_variant: string;
1384
1414
  };
1385
1415
  };
1386
1416
  export default colorSet;
package/dist/src/common/styles/colorSet/index.js CHANGED
@@ -5,13 +5,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
5
5
  Object.defineProperty(exports, "__esModule", { value: true });
6
6
  /* eslint-disable import/order */
7
7
  var SemanticColor_json_1 = __importDefault(require("./SemanticColor.json"));
8
- var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
9
- var UIColor_json_1 = __importDefault(require("./UIColor.json"));
10
8
  var PaletteColor_Dark_json_1 = __importDefault(require("./PaletteColor_Dark.json"));
9
+ var UIColor_json_1 = __importDefault(require("./UIColor.json"));
10
+ var PaletteColor_light_json_1 = __importDefault(require("./PaletteColor_light.json"));
11
11
  var colorSet = {
12
12
  SemanticColor: SemanticColor_json_1.default,
13
- PaletteColor_light: PaletteColor_light_json_1.default,
13
+ PaletteColor_Dark: PaletteColor_Dark_json_1.default,
14
14
  UIColor: UIColor_json_1.default,
15
- PaletteColor_Dark: PaletteColor_Dark_json_1.default
15
+ PaletteColor_light: PaletteColor_light_json_1.default
16
16
  };
17
17
  exports.default = colorSet;
package/dist/src/common/styles/colorSet/ui-type.d.ts CHANGED
@@ -734,4 +734,13 @@ export interface UITheme {
734
734
  ui_domain_record_card_status_4: string;
735
735
  ui_cpnt_button_fill_base_tutorialmodal: string;
736
736
  ui_cpnt_toolbar_base: string;
737
+ ui_76: string;
738
+ ui_89: string;
739
+ ui_90: string;
740
+ ui_91: string;
741
+ ui_92: string;
742
+ ui_93: string;
743
+ ui_94: string;
744
+ ui_95: string;
745
+ ui_cpnt_icon_sys_brandsecondary_variant: string;
737
746
  }
package/dist/src/desktop/components/AdminList/AdminList.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import type { PDSValueOption } from '../../../common';
3
3
  import type { TFunctionResult } from 'i18next';
4
- declare type ColumnWidthType = 'small' | 'medium' | 'large';
4
+ declare type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
5
5
  declare type Props = {
6
6
  selectionMode?: 'none' | 'single' | 'multi';
7
7
  headerRowMode?: 'none' | 'use';
package/dist/src/desktop/components/AdminList/HeaderRow.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import type { TFunctionResult } from 'i18next';
3
- declare type ColumnWidthType = 'small' | 'medium' | 'large';
3
+ declare type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
4
4
  declare type Props = {
5
5
  selectionMode: 'none' | 'single' | 'multi';
6
6
  column2HeaderText?: TFunctionResult;
package/dist/src/desktop/components/AdminList/HeaderRow.js CHANGED
@@ -48,8 +48,9 @@ function HeaderRow(_a) {
48
48
  var small = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 56px;\n"], ["\n width: 56px;\n"])));
49
49
  var medium = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 80px;\n"], ["\n width: 80px;\n"])));
50
50
  var large = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n width: 144px;\n"], ["\n width: 144px;\n"])));
51
- var flexibleHideColumnStyle = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"], ["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"])));
52
- var S_HeaderRow = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n height: 48px;\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n height: 48px;\n\n ", "\n"])), function (_a) {
51
+ var xlarge = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: 240px;\n"], ["\n width: 240px;\n"])));
52
+ var flexibleHideColumnStyle = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"], ["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"])));
53
+ var S_HeaderRow = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n height: 48px;\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n display: flex;\n height: 48px;\n\n ", "\n"])), function (_a) {
53
54
  var theme = _a.theme;
54
55
  return theme.ui_cpnt_list_base_area;
55
56
  }, function (_a) {
@@ -59,9 +60,9 @@ var S_HeaderRow = styled_components_1.default.div(templateObject_5 || (templateO
59
60
  var flexibleHideInfoMode = _a.flexibleHideInfoMode;
60
61
  return flexibleHideInfoMode === 'use' && flexibleHideColumnStyle;
61
62
  });
62
- var S_CheckBox = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __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"])));
63
- var S_FlexColumn = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n flex: 1;\n min-width: 80px;\n"], ["\n flex: 1;\n min-width: 80px;\n"])));
64
- var S_Column = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"])), function (_a) {
63
+ var S_CheckBox = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __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"])));
64
+ var S_FlexColumn = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n flex: 1;\n min-width: 80px;\n"], ["\n flex: 1;\n min-width: 80px;\n"])));
65
+ var S_Column = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"])), function (_a) {
65
66
  var theme = _a.theme;
66
67
  return theme.spacing.spacingC;
67
68
  }, function (_a) {
@@ -69,15 +70,15 @@ var S_Column = styled_components_1.default.div(templateObject_8 || (templateObje
69
70
  return theme.spacing.spacingC;
70
71
  }, function (_a) {
71
72
  var columnSize = _a.columnSize;
72
- return columnSize && { small: small, medium: medium, large: large }[columnSize];
73
+ return columnSize && { small: small, medium: medium, large: large, xlarge: xlarge }[columnSize];
73
74
  });
74
- var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
75
+ var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"], ["\n display: flex;\n padding-left: ", ";\n padding-right: ", ";\n"])), function (_a) {
75
76
  var theme = _a.theme;
76
77
  return theme.spacing.spacingC;
77
78
  }, function (_a) {
78
79
  var theme = _a.theme;
79
80
  return theme.spacing.spacingE;
80
81
  });
81
- var S_EmptyDiv = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n height: 100%;\n width: 56px;\n"], ["\n height: 100%;\n width: 56px;\n"])));
82
+ var S_EmptyDiv = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n height: 100%;\n width: 56px;\n"], ["\n height: 100%;\n width: 56px;\n"])));
82
83
  exports.default = HeaderRow;
83
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
84
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11;
package/dist/src/desktop/components/AdminListItem/AdminListItem.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import type { PDSTextType } from '../../../common';
3
3
  import type { TFunctionResult } from 'i18next';
4
- declare type ColumnWidthType = 'small' | 'medium' | 'large';
4
+ declare type ColumnWidthType = 'small' | 'medium' | 'large' | 'xlarge';
5
5
  declare type ColumnTextType = 'normal' | 'active' | 'active2' | 'inactive' | 'report' | 'report2';
6
6
  export declare type AdminListItemProps = {
7
7
  rowSize?: 'high' | 'medium' | 'low';
package/dist/src/desktop/components/AdminListItem/AdminListItem.js CHANGED
@@ -161,17 +161,18 @@ var lowRow = (0, styled_components_1.css)(templateObject_3 || (templateObject_3
161
161
  var smallColumnWidth = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n width: 56px;\n"], ["\n width: 56px;\n"])));
162
162
  var mediumColumnWidth = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n width: 80px;\n"], ["\n width: 80px;\n"])));
163
163
  var largeColumnWidth = (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n width: 144px;\n"], ["\n width: 144px;\n"])));
164
- var fixedColumn = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n"], ["\n align-items: center;\n display: flex;\n"])));
165
- var hoverColumn = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n height: 100%;\n"], ["\n height: 100%;\n"])));
166
- var hoverQuickActionBtnBox = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: none;\n height: 100%;\n position: absolute;\n right: 0;\n"], ["\n align-items: center;\n background-color: ", ";\n display: none;\n height: 100%;\n position: absolute;\n right: 0;\n"])), function (_a) {
164
+ var xlargeColumnWidth = (0, styled_components_1.css)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n width: 240px;\n"], ["\n width: 240px;\n"])));
165
+ var fixedColumn = (0, styled_components_1.css)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n"], ["\n align-items: center;\n display: flex;\n"])));
166
+ var hoverColumn = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n height: 100%;\n"], ["\n height: 100%;\n"])));
167
+ var hoverQuickActionBtnBox = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: none;\n height: 100%;\n position: absolute;\n right: 0;\n"], ["\n align-items: center;\n background-color: ", ";\n display: none;\n height: 100%;\n position: absolute;\n right: 0;\n"])), function (_a) {
167
168
  var theme = _a.theme;
168
169
  return theme.ui_cpnt_datatable_textbutton_base_02;
169
170
  });
170
- var fixedQuickActionBtnBox = (0, styled_components_1.css)(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"])), function (_a) {
171
+ var fixedQuickActionBtnBox = (0, styled_components_1.css)(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n visibility: hidden;\n"])), function (_a) {
171
172
  var theme = _a.theme;
172
173
  return theme.ui_cpnt_datatable_textbutton_base_01;
173
174
  });
174
- var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"])), function (_a) {
175
+ var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"], ["\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n"])), function (_a) {
175
176
  var theme = _a.theme;
176
177
  return theme.spacing.spacingC;
177
178
  }, function (_a) {
@@ -182,60 +183,73 @@ var S_QuickActionButtonBox = styled_components_1.default.div(templateObject_11 |
182
183
  return quickActionBtnType &&
183
184
  { fix: fixedQuickActionBtnBox, hover: hoverQuickActionBtnBox }[quickActionBtnType];
184
185
  });
185
- var S_QuickActionButton = styled_components_1.default.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n align-items: center;\n cursor: ", ";\n display: flex;\n height: 56px;\n justify-content: center;\n width: 56px;\n"], ["\n align-items: center;\n cursor: ", ";\n display: flex;\n height: 56px;\n justify-content: center;\n width: 56px;\n"])), function (_a) {
186
+ var S_QuickActionButton = styled_components_1.default.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n align-items: center;\n cursor: ", ";\n display: flex;\n height: 56px;\n justify-content: center;\n width: 56px;\n"], ["\n align-items: center;\n cursor: ", ";\n display: flex;\n height: 56px;\n justify-content: center;\n width: 56px;\n"])), function (_a) {
186
187
  var disabled = _a.disabled;
187
188
  return (disabled ? 'default' : 'pointer');
188
189
  });
189
- 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"])));
190
- 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) {
190
+ var S_Selection = styled_components_1.default.div(templateObject_14 || (templateObject_14 = __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"])));
191
+ var S_ImageWrapper = styled_components_1.default.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n margin-right: ", ";\n\n ", "\n"], ["\n margin-right: ", ";\n\n ", "\n"])), function (_a) {
191
192
  var theme = _a.theme;
192
193
  return theme.spacing.spacingD;
193
194
  }, function (_a) {
194
195
  var rowSize = _a.rowSize;
195
- 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 "])));
196
+ return rowSize === 'high' && (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n height: 100%;\n "], ["\n align-items: center;\n display: flex;\n height: 100%;\n "])));
196
197
  });
197
- var S_ImageColumn = styled_components_1.default.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n flex: 1;\n min-width: 80px;\n overflow: auto;\n padding: ", ";\n\n ", "\n"], ["\n flex: 1;\n min-width: 80px;\n overflow: auto;\n padding: ", ";\n\n ", "\n"])), function (_a) {
198
+ var S_ImageColumn = styled_components_1.default.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n flex: 1;\n min-width: 80px;\n overflow: auto;\n padding: ", ";\n\n ", "\n"], ["\n flex: 1;\n min-width: 80px;\n overflow: auto;\n padding: ", ";\n\n ", "\n"])), function (_a) {
198
199
  var theme = _a.theme;
199
200
  return theme.spacing.spacingC;
200
201
  }, function (_a) {
201
202
  var rowSize = _a.rowSize;
202
203
  return rowSize === 'high'
203
- ? (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 "])));
204
+ ? (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __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_18 || (templateObject_18 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
204
205
  });
205
- var S_HighTextWrapper = 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) {
206
+ var S_HighTextWrapper = styled_components_1.default.div(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n height: 100%;\n overflow: auto;\n\n ", "\n"], ["\n height: 100%;\n overflow: auto;\n\n ", "\n"])), function (_a) {
206
207
  var hasScroll = _a.hasScroll;
207
- 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
+ return !hasScroll && (0, styled_components_1.css)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n "], ["\n align-items: center;\n display: flex;\n "])));
208
209
  });
209
- var S_RowTextWrapper = styled_components_1.default.div(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n overflow: auto;\n\n ", ";\n ", ";\n"], ["\n align-items: center;\n display: flex;\n overflow: auto;\n\n ", ";\n ", ";\n"])), function (_a) {
210
+ var S_RowTextWrapper = styled_components_1.default.div(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n overflow: auto;\n\n ", ";\n ", ";\n"], ["\n align-items: center;\n display: flex;\n overflow: auto;\n\n ", ";\n ", ";\n"])), function (_a) {
210
211
  var columnSize = _a.columnSize;
211
212
  return columnSize &&
212
- { small: smallColumnWidth, medium: mediumColumnWidth, large: largeColumnWidth }[columnSize];
213
+ {
214
+ small: smallColumnWidth,
215
+ medium: mediumColumnWidth,
216
+ large: largeColumnWidth,
217
+ xlarge: xlargeColumnWidth
218
+ }[columnSize];
213
219
  }, function (_a) {
214
220
  var quickActionBtnType = _a.quickActionBtnType;
215
221
  return quickActionBtnType && { fix: fixedColumn, hover: hoverColumn }[quickActionBtnType];
216
222
  });
217
- var S_Column = styled_components_1.default.div(templateObject_22 || (templateObject_22 = __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) {
223
+ var S_Column = styled_components_1.default.div(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n display: flex;\n height: auto;\n max-height: 100%;\n overflow: auto;\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n ", ";\n"], ["\n display: flex;\n height: auto;\n max-height: 100%;\n overflow: auto;\n padding-left: ", ";\n padding-right: ", ";\n\n ", ";\n ", ";\n"])), function (_a) {
224
+ var theme = _a.theme;
225
+ return theme.spacing.spacingC;
226
+ }, function (_a) {
218
227
  var theme = _a.theme;
219
228
  return theme.spacing.spacingC;
220
229
  }, function (_a) {
221
230
  var columnSize = _a.columnSize;
222
231
  return columnSize &&
223
- { small: smallColumnWidth, medium: mediumColumnWidth, large: largeColumnWidth }[columnSize];
232
+ {
233
+ small: smallColumnWidth,
234
+ medium: mediumColumnWidth,
235
+ large: largeColumnWidth,
236
+ xlarge: xlargeColumnWidth
237
+ }[columnSize];
224
238
  }, function (_a) {
225
239
  var quickActionBtnType = _a.quickActionBtnType;
226
240
  return quickActionBtnType && { fix: fixedColumn, hover: hoverColumn }[quickActionBtnType];
227
241
  });
228
- var S_SelectionColumn = styled_components_1.default.div(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-top: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-top: ", ";\n"])), function (_a) {
242
+ var S_SelectionColumn = styled_components_1.default.div(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-top: ", ";\n"], ["\n align-items: center;\n display: flex;\n padding-bottom: ", ";\n padding-top: ", ";\n"])), function (_a) {
229
243
  var theme = _a.theme, rowSize = _a.rowSize;
230
244
  return (rowSize === 'high' || rowSize === 'medium') && theme.spacing.spacingC;
231
245
  }, function (_a) {
232
246
  var theme = _a.theme, rowSize = _a.rowSize;
233
247
  return (rowSize === 'high' || rowSize === 'medium') && theme.spacing.spacingC;
234
248
  });
235
- var hoverAdminListItem = (0, styled_components_1.css)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n align-items: center;\n position: relative;\n"], ["\n align-items: center;\n position: relative;\n"])));
236
- var fixedAdminListItem = (0, styled_components_1.css)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n justify-content: space-between;\n"], ["\n justify-content: space-between;\n"])));
237
- var flexibleHideColumnStyle = (0, styled_components_1.css)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"], ["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"])));
238
- var S_AdminListItem = styled_components_1.default.div(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"], ["\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"])), function (_a) {
249
+ var hoverAdminListItem = (0, styled_components_1.css)(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n align-items: center;\n position: relative;\n"], ["\n align-items: center;\n position: relative;\n"])));
250
+ var fixedAdminListItem = (0, styled_components_1.css)(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n justify-content: space-between;\n"], ["\n justify-content: space-between;\n"])));
251
+ var flexibleHideColumnStyle = (0, styled_components_1.css)(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"], ["\n @media only screen and (max-width: 1400px) {\n .hidableColumn {\n display: none;\n }\n }\n"])));
252
+ var S_AdminListItem = styled_components_1.default.div(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"], ["\n align-items: center;\n background-color: ", ";\n display: flex;\n padding-left: ", ";\n\n ", "\n\n ", ";\n ", "\n\n :hover {\n background-color: ", ";\n\n ", " {\n display: ", ";\n visibility: visible;\n }\n }\n\n &:last-child {\n margin-bottom: 88px;\n }\n\n ", "\n"])), function (_a) {
239
253
  var theme = _a.theme, isSelected = _a.isSelected;
240
254
  return isSelected ? theme.ui_cpnt_datatable_base_selected : theme.ui_cpnt_datatable_base_default;
241
255
  }, function (_a) {
@@ -259,4 +273,4 @@ var S_AdminListItem = styled_components_1.default.div(templateObject_27 || (temp
259
273
  return flexibleHideInfoMode === 'use' && flexibleHideColumnStyle;
260
274
  });
261
275
  exports.default = AdminListItem;
262
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27;
276
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pds-dev-kit-web",
3
- "version": "1.9.19",
3
+ "version": "1.9.21",
4
4
  "license": "MIT",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
package/release-note.md CHANGED
@@ -1,14 +1,8 @@
1
1
  # PDS-DEV-KIT-WEB Release Notes
2
- ## [v1.9.19]
2
+ ## [v1.9.21]
3
3
 
4
- ### Package
5
- * eslint가 올바르게 동작하도록 수정
6
- * tsconfig.json에서 baseUrl 추가
7
- * styled-components order lint가 적용되도록 eslint-plugin-better-styled-components 추가
8
- * husky 추가
9
- * commitlint 라이브러리의 의존성 이슈로 기능을 구현해서 추가
10
- * 스토리북 북마크 작성시 타입 전달이 잘 되도록 수정
11
- * export const Default = Template.bind({}); 부분에서 bind이후에 Default에도 타입이 이어지도록 수정
12
- ### Layout
13
- * MSA_1
14
- * container1Ref 추가
4
+ ### Component
5
+ * column3Width - column10Width prop에 xlarge 추가
6
+ * column3Text - column10Text에서 세로 스크롤이 생겼을 경우 중앙이 아닌 상단부터 내용이 보여질 수 있도록 수정
7
+ ### Color
8
+ * 컬러 키 값 23.03.10 14시 54분 기준 싱크