pds-dev-kit-web 2.2.187 → 2.2.189
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.
- package/dist/src/desktop/components/BoxItem/BoxItem.d.ts +5 -1
- package/dist/src/desktop/components/BoxItem/BoxItem.js +8 -5
- package/dist/src/mobile/components/BoxItem/BoxItem.d.ts +5 -1
- package/dist/src/mobile/components/BoxItem/BoxItem.js +7 -5
- package/package.json +1 -1
- package/release-note.md +2 -2
|
@@ -11,8 +11,10 @@ export type BoxItemProps = {
|
|
|
11
11
|
titleFontSize?: 'subTitleBold' | 'leadParaBold' | 'body2Bold' | 'headingBold';
|
|
12
12
|
titleTextLineLimit?: number;
|
|
13
13
|
titleTextColorKey?: UiColors;
|
|
14
|
+
titleTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
14
15
|
descText?: PDSTextType;
|
|
15
16
|
descTextColorKey?: UiColors;
|
|
17
|
+
descTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
16
18
|
descLineLimit?: number;
|
|
17
19
|
imageMode?: 'use' | 'none';
|
|
18
20
|
imageShapeType?: 'round' | 'circular' | 'rectangle';
|
|
@@ -22,6 +24,8 @@ export type BoxItemProps = {
|
|
|
22
24
|
imageScaleType?: 'none' | 'cover' | 'contain' | 'fill';
|
|
23
25
|
chipMode?: 'use' | 'none';
|
|
24
26
|
chipText?: PDSTextType;
|
|
27
|
+
chipOverrideTextColorKey?: UiColors;
|
|
28
|
+
chipOverrideBackgroundColorKey?: UiColors;
|
|
25
29
|
displayType?: 'none' | 'ibtn_amount1' | 'ibtn_amount2' | 'ibtn_amount3';
|
|
26
30
|
iBtn1IconName?: PDSIconType;
|
|
27
31
|
iBtn1IconFillType?: 'fill' | 'line';
|
|
@@ -58,5 +62,5 @@ declare const paddingSpacing: {
|
|
|
58
62
|
readonly spacing_m: "spacingM";
|
|
59
63
|
readonly spacing_n: "spacingN";
|
|
60
64
|
};
|
|
61
|
-
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey, descText, descTextColorKey, descLineLimit, imageMode, imageShapeType, imageSrc, imageWidth, imageRatio, imageScaleType, chipMode, chipText, displayType, iBtn1IconName, iBtn1IconFillType, iBtn1IconColorKey, iBtn2IconName, iBtn2IconFillType, iBtn2IconColorKey, iBtn3IconName, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
65
|
+
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey, titleTextWordBreak, descText, descTextColorKey, descTextWordBreak, descLineLimit, imageMode, imageShapeType, imageSrc, imageWidth, imageRatio, imageScaleType, chipMode, chipText, chipOverrideTextColorKey, chipOverrideBackgroundColorKey, displayType, iBtn1IconName, iBtn1IconFillType, iBtn1IconColorKey, iBtn2IconName, iBtn2IconFillType, iBtn2IconColorKey, iBtn3IconName, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
62
66
|
export default BoxItem;
|
|
@@ -42,7 +42,7 @@ var paddingSpacing = {
|
|
|
42
42
|
spacing_n: 'spacingN'
|
|
43
43
|
};
|
|
44
44
|
function BoxItem(_a) {
|
|
45
|
-
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h, descText = _a.descText,
|
|
45
|
+
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h, _j = _a.titleTextWordBreak, titleTextWordBreak = _j === void 0 ? 'normal' : _j, descText = _a.descText, _k = _a.descTextColorKey, descTextColorKey = _k === void 0 ? 'ui_cpnt_textlabel_sys_secondary' : _k, _l = _a.descTextWordBreak, descTextWordBreak = _l === void 0 ? 'normal' : _l, _m = _a.descLineLimit, descLineLimit = _m === void 0 ? 2 : _m, _o = _a.imageMode, imageMode = _o === void 0 ? 'none' : _o, _p = _a.imageShapeType, imageShapeType = _p === void 0 ? 'round' : _p, imageSrc = _a.imageSrc, imageWidth = _a.imageWidth, _q = _a.imageRatio, imageRatio = _q === void 0 ? '1_1' : _q, _r = _a.imageScaleType, imageScaleType = _r === void 0 ? 'cover' : _r, _s = _a.chipMode, chipMode = _s === void 0 ? 'none' : _s, chipText = _a.chipText, chipOverrideTextColorKey = _a.chipOverrideTextColorKey, chipOverrideBackgroundColorKey = _a.chipOverrideBackgroundColorKey, _t = _a.displayType, displayType = _t === void 0 ? 'none' : _t, iBtn1IconName = _a.iBtn1IconName, _u = _a.iBtn1IconFillType, iBtn1IconFillType = _u === void 0 ? 'line' : _u, iBtn1IconColorKey = _a.iBtn1IconColorKey, iBtn2IconName = _a.iBtn2IconName, _v = _a.iBtn2IconFillType, iBtn2IconFillType = _v === void 0 ? 'line' : _v, iBtn2IconColorKey = _a.iBtn2IconColorKey, iBtn3IconName = _a.iBtn3IconName, _w = _a.iBtn3IconFillType, iBtn3IconFillType = _w === void 0 ? 'line' : _w, iBtn3IconColorKey = _a.iBtn3IconColorKey, _x = _a.paddingTop, paddingTop = _x === void 0 ? 'spacing_d' : _x, _y = _a.paddingRight, paddingRight = _y === void 0 ? 'spacing_d' : _y, _z = _a.paddingBottom, paddingBottom = _z === void 0 ? 'spacing_d' : _z, _0 = _a.paddingLeft, paddingLeft = _0 === void 0 ? 'spacing_d' : _0, id = _a.id, onClick = _a.onClick, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onClickIBtn3 = _a.onClickIBtn3;
|
|
46
46
|
var handleClick = function () {
|
|
47
47
|
if (state === 'disabled') {
|
|
48
48
|
return;
|
|
@@ -87,8 +87,9 @@ function BoxItem(_a) {
|
|
|
87
87
|
flexDirection: 'row',
|
|
88
88
|
alignItems: 'center',
|
|
89
89
|
justifyContent: 'space-between',
|
|
90
|
+
maxWidth: '100%',
|
|
90
91
|
cursor: state === 'disabled' ? 'default' : selectionMode === 'use' ? 'pointer' : 'default'
|
|
91
|
-
} }, { children: [(0, jsx_runtime_1.jsxs)(
|
|
92
|
+
} }, { children: [(0, jsx_runtime_1.jsxs)(LeftBox_1.LeftBox, __assign({ hasRightBox: displayType !== 'none' || chipMode === 'use' }, { children: [checkboxMode !== 'none' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Checkbox, { selected: selectState === 'selected', isIndeterminate: checkboxMode === 'indeterminate' })), imageMode === 'use' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Image, { shape: imageShapeType, src: imageSrc, width: imageWidth, ratio: imageRatio, scaleType: imageScaleType })), (0, jsx_runtime_1.jsxs)(S_TextGroup, { children: [titleText && ((0, jsx_runtime_1.jsx)(index_1.D_TextLabel, { text: titleText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : titleTextColorKey, styleTheme: titleFontSize, lineLimit: titleTextLineLimit, ellipsisMode: "use", wordBreak: titleTextWordBreak })), descText && ((0, jsx_runtime_1.jsx)(index_1.D_TextLabel, { text: descText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : descTextColorKey, lineLimit: descLineLimit, ellipsisMode: "use", styleTheme: "caption1Regular", wordBreak: descTextWordBreak }))] })] })), (0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ hasRightBox: displayType !== 'none' || chipMode === 'use' }, { children: [chipMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Chip_1.Chip, { text: chipText, overrideBackgroundColorKey: chipOverrideBackgroundColorKey, displayType: "information", overrideTextColorKey: chipOverrideTextColorKey }), (0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" })] })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [displayType === 'ibtn_amount1' && ((0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', baseSize: "medium", fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, iconSize: 20, state: state, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", shapeType: "rectangle" })), displayType === 'ibtn_amount2' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, state: state, onClick: handleIBtn2Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] })), displayType === 'ibtn_amount3' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, state: state, onClick: handleIBtn1Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, state: state, onClick: handleIBtn2Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.D_IconButton, { iconName: iBtn3IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn3IconFillType, iconColorKey: iBtn3IconColorKey, state: state, onClick: handleIBtn3Click, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] }))] }), indicatorMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: "ic_arrow_right", fillType: "line", size: 20, colorKey: "ui_cpnt_icon_sys_grey_01" })] }))] }))] })) })));
|
|
92
93
|
}
|
|
93
94
|
var S_BoxItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"])), function (_a) {
|
|
94
95
|
var theme = _a.theme;
|
|
@@ -98,7 +99,9 @@ var S_TextGroup = styled_components_1.default.div(templateObject_2 || (templateO
|
|
|
98
99
|
var theme = _a.theme;
|
|
99
100
|
return theme.spacing.spacingA;
|
|
100
101
|
});
|
|
101
|
-
var
|
|
102
|
-
var
|
|
102
|
+
var S_RightBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: ", ";\n flex-direction: row;\n justify-content: flex-end;\n"], ["\n align-items: center;\n display: flex;\n flex: ", ";\n flex-direction: row;\n justify-content: flex-end;\n"])), function (_a) {
|
|
103
|
+
var hasRightBox = _a.hasRightBox;
|
|
104
|
+
return hasRightBox && 3;
|
|
105
|
+
});
|
|
103
106
|
exports.default = BoxItem;
|
|
104
|
-
var templateObject_1, templateObject_2, templateObject_3
|
|
107
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
|
@@ -11,9 +11,11 @@ export type BoxItemProps = {
|
|
|
11
11
|
titleFontSize?: 'subTitleBold' | 'leadParaBold' | 'body2Bold' | 'headingBold';
|
|
12
12
|
titleTextLineLimit?: number;
|
|
13
13
|
titleTextColorKey?: UiColors;
|
|
14
|
+
titleTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
14
15
|
descText?: PDSTextType;
|
|
15
16
|
descTextColorKey?: UiColors;
|
|
16
17
|
descLineLimit?: number;
|
|
18
|
+
descTextWordBreak?: 'normal' | 'break_all' | 'keep_all' | 'break_word';
|
|
17
19
|
imageMode?: 'use' | 'none';
|
|
18
20
|
imageShapeType?: 'round' | 'circular' | 'rectangle';
|
|
19
21
|
imageSrc?: string;
|
|
@@ -22,6 +24,8 @@ export type BoxItemProps = {
|
|
|
22
24
|
imageScaleType?: 'none' | 'cover' | 'contain' | 'fill';
|
|
23
25
|
chipMode?: 'use' | 'none';
|
|
24
26
|
chipText?: PDSTextType;
|
|
27
|
+
chipOverrideTextColorKey?: UiColors;
|
|
28
|
+
chipOverrideBackgroundColorKey?: UiColors;
|
|
25
29
|
displayType?: 'none' | 'ibtn_amount1' | 'ibtn_amount2' | 'ibtn_amount3';
|
|
26
30
|
iBtn1IconName?: PDSIconType;
|
|
27
31
|
iBtn1IconFillType?: 'fill' | 'line';
|
|
@@ -58,5 +62,5 @@ declare const paddingSpacing: {
|
|
|
58
62
|
readonly spacing_m: "spacingM";
|
|
59
63
|
readonly spacing_n: "spacingN";
|
|
60
64
|
};
|
|
61
|
-
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey, descText, descTextColorKey, descLineLimit, imageMode, imageShapeType, imageSrc, imageWidth, imageRatio, imageScaleType, chipMode, chipText, displayType, iBtn1IconName, iBtn1IconFillType, iBtn1IconColorKey, iBtn2IconName, iBtn2IconFillType, iBtn2IconColorKey, iBtn3IconName, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
65
|
+
declare function BoxItem({ selectionMode, checkboxMode, indicatorMode, state, selectState, titleText, titleFontSize, titleTextLineLimit, titleTextColorKey, titleTextWordBreak, descText, descTextColorKey, descLineLimit, descTextWordBreak, imageMode, imageShapeType, imageSrc, imageWidth, imageRatio, imageScaleType, chipMode, chipText, chipOverrideTextColorKey, chipOverrideBackgroundColorKey, displayType, iBtn1IconName, iBtn1IconFillType, iBtn1IconColorKey, iBtn2IconName, iBtn2IconFillType, iBtn2IconColorKey, iBtn3IconName, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
62
66
|
export default BoxItem;
|
|
@@ -42,7 +42,7 @@ var paddingSpacing = {
|
|
|
42
42
|
spacing_n: 'spacingN'
|
|
43
43
|
};
|
|
44
44
|
function BoxItem(_a) {
|
|
45
|
-
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h, descText = _a.descText,
|
|
45
|
+
var _b = _a.selectionMode, selectionMode = _b === void 0 ? 'none' : _b, _c = _a.checkboxMode, checkboxMode = _c === void 0 ? 'none' : _c, _d = _a.indicatorMode, indicatorMode = _d === void 0 ? 'none' : _d, _e = _a.state, state = _e === void 0 ? 'normal' : _e, _f = _a.selectState, selectState = _f === void 0 ? 'unselected' : _f, titleText = _a.titleText, titleFontSize = _a.titleFontSize, _g = _a.titleTextLineLimit, titleTextLineLimit = _g === void 0 ? 2 : _g, _h = _a.titleTextColorKey, titleTextColorKey = _h === void 0 ? 'ui_cpnt_textlabel_sys_primary' : _h, _j = _a.titleTextWordBreak, titleTextWordBreak = _j === void 0 ? 'normal' : _j, descText = _a.descText, _k = _a.descTextColorKey, descTextColorKey = _k === void 0 ? 'ui_cpnt_textlabel_sys_secondary' : _k, _l = _a.descLineLimit, descLineLimit = _l === void 0 ? 2 : _l, _m = _a.descTextWordBreak, descTextWordBreak = _m === void 0 ? 'normal' : _m, _o = _a.imageMode, imageMode = _o === void 0 ? 'none' : _o, _p = _a.imageShapeType, imageShapeType = _p === void 0 ? 'round' : _p, imageSrc = _a.imageSrc, imageWidth = _a.imageWidth, _q = _a.imageRatio, imageRatio = _q === void 0 ? '1_1' : _q, _r = _a.imageScaleType, imageScaleType = _r === void 0 ? 'cover' : _r, _s = _a.chipMode, chipMode = _s === void 0 ? 'none' : _s, chipText = _a.chipText, chipOverrideTextColorKey = _a.chipOverrideTextColorKey, chipOverrideBackgroundColorKey = _a.chipOverrideBackgroundColorKey, _t = _a.displayType, displayType = _t === void 0 ? 'none' : _t, iBtn1IconName = _a.iBtn1IconName, _u = _a.iBtn1IconFillType, iBtn1IconFillType = _u === void 0 ? 'line' : _u, iBtn1IconColorKey = _a.iBtn1IconColorKey, iBtn2IconName = _a.iBtn2IconName, _v = _a.iBtn2IconFillType, iBtn2IconFillType = _v === void 0 ? 'line' : _v, iBtn2IconColorKey = _a.iBtn2IconColorKey, iBtn3IconName = _a.iBtn3IconName, _w = _a.iBtn3IconFillType, iBtn3IconFillType = _w === void 0 ? 'line' : _w, iBtn3IconColorKey = _a.iBtn3IconColorKey, _x = _a.paddingTop, paddingTop = _x === void 0 ? 'spacing_d' : _x, _y = _a.paddingRight, paddingRight = _y === void 0 ? 'spacing_d' : _y, _z = _a.paddingBottom, paddingBottom = _z === void 0 ? 'spacing_d' : _z, _0 = _a.paddingLeft, paddingLeft = _0 === void 0 ? 'spacing_d' : _0, id = _a.id, onClick = _a.onClick, onClickIBtn1 = _a.onClickIBtn1, onClickIBtn2 = _a.onClickIBtn2, onClickIBtn3 = _a.onClickIBtn3;
|
|
46
46
|
var handleClick = function () {
|
|
47
47
|
if (state === 'disabled') {
|
|
48
48
|
return;
|
|
@@ -88,7 +88,7 @@ function BoxItem(_a) {
|
|
|
88
88
|
alignItems: 'center',
|
|
89
89
|
justifyContent: 'space-between',
|
|
90
90
|
cursor: state === 'disabled' ? 'default' : selectionMode === 'use' ? 'pointer' : 'default'
|
|
91
|
-
} }, { children: [(0, jsx_runtime_1.jsxs)(
|
|
91
|
+
} }, { children: [(0, jsx_runtime_1.jsxs)(LeftBox_1.LeftBox, __assign({ hasRightBox: displayType !== 'none' || chipMode === 'use' }, { children: [checkboxMode !== 'none' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Checkbox, { selected: selectState === 'selected', isIndeterminate: checkboxMode === 'indeterminate' })), imageMode === 'use' && ((0, jsx_runtime_1.jsx)(LeftBox_1.LeftBox.Image, { shape: imageShapeType, src: imageSrc, width: imageWidth, ratio: imageRatio, scaleType: imageScaleType })), (0, jsx_runtime_1.jsxs)(S_TextGroup, { children: [titleText && ((0, jsx_runtime_1.jsx)(index_1.M_TextLabel, { text: titleText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : titleTextColorKey, styleTheme: titleFontSize, lineLimit: titleTextLineLimit, wordBreak: titleTextWordBreak, ellipsisMode: "use" })), descText && ((0, jsx_runtime_1.jsx)(index_1.M_TextLabel, { text: descText, colorOverride: state === 'disabled' ? 'ui_cpnt_textlabel_sys_secondary' : descTextColorKey, lineLimit: descLineLimit, wordBreak: descTextWordBreak, ellipsisMode: "use", styleTheme: "caption1Regular" }))] })] })), (0, jsx_runtime_1.jsxs)(S_RightBox, __assign({ hasRightBox: displayType !== 'none' || chipMode === 'use' }, { children: [chipMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Chip_1.Chip, { text: chipText, overrideBackgroundColorKey: chipOverrideBackgroundColorKey, displayType: "information", overrideTextColorKey: chipOverrideTextColorKey }), (0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" })] })), (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [displayType === 'ibtn_amount1' && ((0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', baseSize: "medium", fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", shapeType: "rectangle" })), displayType === 'ibtn_amount2' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, onClick: handleIBtn2Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] })), displayType === 'ibtn_amount3' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn1IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn1IconFillType, iconColorKey: iBtn1IconColorKey, onClick: handleIBtn1Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn2IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn2IconFillType, iconColorKey: iBtn2IconColorKey, onClick: handleIBtn2Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" }), (0, jsx_runtime_1.jsx)(index_1.M_IconButton, { iconName: iBtn3IconName || 'ic_arrow_right', fillType: "fill", iconFillType: iBtn3IconFillType, iconColorKey: iBtn3IconColorKey, onClick: handleIBtn3Click, state: state, iconSize: 20, baseColorKey: "ui_cpnt_button_fill_base_transparent", borderColorKey: "ui_cpnt_button_fill_base_transparent", baseSize: "medium", shapeType: "rectangle" })] }))] }), indicatorMode === 'use' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.Spacing, { size: "spacing_b" }), (0, jsx_runtime_1.jsx)(components_1.Icon, { iconName: "ic_arrow_right", fillType: "line", size: 20, colorKey: "ui_cpnt_icon_sys_grey_01" })] }))] }))] })) })));
|
|
92
92
|
}
|
|
93
93
|
var S_BoxItem = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"], ["\n align-items: center;\n display: flex;\n flex-direction: row;\n gap: ", ";\n width: 100%;\n"])), function (_a) {
|
|
94
94
|
var theme = _a.theme;
|
|
@@ -98,7 +98,9 @@ var S_TextGroup = styled_components_1.default.div(templateObject_2 || (templateO
|
|
|
98
98
|
var theme = _a.theme;
|
|
99
99
|
return theme.spacing.spacingA;
|
|
100
100
|
});
|
|
101
|
-
var
|
|
102
|
-
var
|
|
101
|
+
var S_RightBox = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex: ", ";\n flex-direction: row;\n justify-content: flex-end;\n"], ["\n align-items: center;\n display: flex;\n flex: ", ";\n flex-direction: row;\n justify-content: flex-end;\n"])), function (_a) {
|
|
102
|
+
var hasRightBox = _a.hasRightBox;
|
|
103
|
+
return hasRightBox && 3;
|
|
104
|
+
});
|
|
103
105
|
exports.default = BoxItem;
|
|
104
|
-
var templateObject_1, templateObject_2, templateObject_3
|
|
106
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
package/package.json
CHANGED
package/release-note.md
CHANGED