pds-dev-kit-web 2.2.198 → 2.2.200
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/AdminList/AdminList.js +13 -9
- package/dist/src/desktop/components/BoxItem/BoxItem.d.ts +2 -1
- package/dist/src/desktop/components/BoxItem/BoxItem.js +4 -2
- package/dist/src/mobile/components/BoxItem/BoxItem.d.ts +2 -1
- package/dist/src/mobile/components/BoxItem/BoxItem.js +4 -2
- package/dist/src/sub/AdminList/AdminList/AdminList.js +13 -9
- package/package.json +1 -1
- package/release-note.md +2 -3
|
@@ -194,19 +194,23 @@ function AdminList(_a) {
|
|
|
194
194
|
}
|
|
195
195
|
}
|
|
196
196
|
};
|
|
197
|
-
return ((0, jsx_runtime_1.jsxs)(S_AdminList, __assign({ "x-pds-name": "AdminList", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [isBulkActionBarOpen && ((0, jsx_runtime_1.jsx)(BulkActionBar_1.default, { itemCount: totalItemCount, dropdownMode: dropdownMode, dropdown1Value: dropdown1Value, dropdown2Value: dropdown2Value, dropdown3Value: dropdown3Value, dropdown1DefaultText: dropdown1DefaultText, dropdown2DefaultText: dropdown2DefaultText, dropdown3DefaultText: dropdown3DefaultText, dropdown1HintText: dropdown1HintText, dropdown2HintText: dropdown2HintText, dropdown3HintText: dropdown3HintText, dropdown1ValueArray: dropdown1ValueArray, dropdown2ValueArray: dropdown2ValueArray, dropdown3ValueArray: dropdown3ValueArray, tBtnMode: btnMode(), tBtn1Text: tBtn1Text || mBtn1Text, tBtn2Text: tBtn2Text || mBtn2Text, tBtn3Text: tBtn3Text || mBtn3Text, onChangeDropdown1: onChangeDropdown1, onChangeDropdown2: onChangeDropdown2, onChangeDropdown3: onChangeDropdown3, onClickTBtn1: onClickTBtn1 || onClickMBtn1, onClickTBtn2: onClickTBtn2 || onClickMBtn2, onClickTBtn3: onClickTBtn3 || onClickMBtn3 })), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)(
|
|
197
|
+
return ((0, jsx_runtime_1.jsxs)(S_AdminList, __assign({ "x-pds-name": "AdminList", "x-pds-element-type": "component", "x-pds-device-type": "desktop" }, { children: [isBulkActionBarOpen && ((0, jsx_runtime_1.jsx)(BulkActionBar_1.default, { itemCount: totalItemCount, dropdownMode: dropdownMode, dropdown1Value: dropdown1Value, dropdown2Value: dropdown2Value, dropdown3Value: dropdown3Value, dropdown1DefaultText: dropdown1DefaultText, dropdown2DefaultText: dropdown2DefaultText, dropdown3DefaultText: dropdown3DefaultText, dropdown1HintText: dropdown1HintText, dropdown2HintText: dropdown2HintText, dropdown3HintText: dropdown3HintText, dropdown1ValueArray: dropdown1ValueArray, dropdown2ValueArray: dropdown2ValueArray, dropdown3ValueArray: dropdown3ValueArray, tBtnMode: btnMode(), tBtn1Text: tBtn1Text || mBtn1Text, tBtn2Text: tBtn2Text || mBtn2Text, tBtn3Text: tBtn3Text || mBtn3Text, onChangeDropdown1: onChangeDropdown1, onChangeDropdown2: onChangeDropdown2, onChangeDropdown3: onChangeDropdown3, onClickTBtn1: onClickTBtn1 || onClickMBtn1, onClickTBtn2: onClickTBtn2 || onClickMBtn2, onClickTBtn3: onClickTBtn3 || onClickMBtn3 })), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)(HeaderRowStyle, __assign({ scrollVisibleType: scrollVisibleType, scrollMode: scrollMode }, { children: (0, jsx_runtime_1.jsx)(HeaderRow_1.default, { headerRowCheckboxName: headerRowCheckboxName, selectionMode: selectionMode, column2HeaderText: column2HeaderText, column3HeaderText: column3HeaderText, column3HeaderWidth: column3Width, column4HeaderText: column4HeaderText, column4HeaderWidth: column4Width, column5HeaderText: column5HeaderText, column5HeaderWidth: column5Width, column6HeaderText: column6HeaderText, column6HeaderWidth: column6Width, column7HeaderText: column7HeaderText, column7HeaderWidth: column7Width, column8HeaderText: column8HeaderText, column8HeaderWidth: column8Width, column9HeaderText: column9HeaderText, column9HeaderWidth: column9Width, column10HeaderText: column10HeaderText, column10HeaderWidth: column10Width, quickActionBtnType: quickActionBtnType, quickActionButtonCount: getActionButtonCount(), flexibleHideInfoMode: flexibleHideInfoMode, onClickSelectAllCheckbox: handleSelectAllCheckbox }) })) }))), (0, jsx_runtime_1.jsx)(S_ScrollBox, __assign({ scrollMode: scrollMode, scrollVisibleType: scrollVisibleType }, { children: react_1.default.Children.count(children) ? ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, checkboxMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: childrenWithWidthProps }) }))) : ((0, jsx_runtime_1.jsx)(S_EmptyTextWrapper, { children: (0, jsx_runtime_1.jsx)(TextLabel_1.TextLabel, { text: emptyText, colorTheme: "sysTextTertiary", textAlign: "center", styleTheme: "body2Regular" }) })) }))] })));
|
|
198
198
|
}
|
|
199
|
+
var HeaderRowStyle = styled_components_1.default.form(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding-right: ", ";\n"], ["\n padding-right: ", ";\n"])), function (_a) {
|
|
200
|
+
var scrollVisibleType = _a.scrollVisibleType;
|
|
201
|
+
return scrollVisibleType !== 'hidden' && '8px';
|
|
202
|
+
});
|
|
199
203
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
200
|
-
var scrollInvisible = (0, styled_components_1.css)(
|
|
204
|
+
var scrollInvisible = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n }\n"], ["\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n }\n"])));
|
|
201
205
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
202
|
-
var scrollVisible = (0, styled_components_1.css)(
|
|
203
|
-
var S_AdminList = styled_components_1.default.div(
|
|
204
|
-
var S_ScrollBox = styled_components_1.default.div(
|
|
206
|
+
var scrollVisible = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n display: initial;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n"], ["\n &::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n display: initial;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n"])));
|
|
207
|
+
var S_AdminList = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
|
|
208
|
+
var S_ScrollBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n flex: 1;\n overflow-x: hidden;\n overflow-y: ", ";\n position: relative;\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n height: 8px;\n width: 8px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n scrollbar-gutter: stable;\n scrollbar-width: ", ";\n"], ["\n flex: 1;\n overflow-x: hidden;\n overflow-y: ", ";\n position: relative;\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n height: 8px;\n width: 8px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n scrollbar-gutter: stable;\n scrollbar-width: ", ";\n"])), function (_a) {
|
|
205
209
|
var scrollMode = _a.scrollMode;
|
|
206
210
|
switch (scrollMode) {
|
|
207
211
|
case 'infinite':
|
|
208
212
|
case 'page': {
|
|
209
|
-
return '
|
|
213
|
+
return 'overlay';
|
|
210
214
|
}
|
|
211
215
|
case 'none': {
|
|
212
216
|
return 'none';
|
|
@@ -214,8 +218,8 @@ var S_ScrollBox = styled_components_1.default.div(templateObject_4 || (templateO
|
|
|
214
218
|
}
|
|
215
219
|
}, function (_a) {
|
|
216
220
|
var scrollVisibleType = _a.scrollVisibleType;
|
|
217
|
-
return scrollVisibleType === 'hidden' ? 'none' : '
|
|
221
|
+
return (scrollVisibleType === 'hidden' ? 'none' : 'auto');
|
|
218
222
|
});
|
|
219
|
-
var S_EmptyTextWrapper = styled_components_1.default.div(
|
|
223
|
+
var S_EmptyTextWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n padding-bottom: 88px;\n padding-top: 88px;\n"], ["\n padding-bottom: 88px;\n padding-top: 88px;\n"])));
|
|
220
224
|
exports.default = AdminList;
|
|
221
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
|
225
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
|
@@ -36,6 +36,7 @@ export type BoxItemProps = {
|
|
|
36
36
|
iBtn3IconName?: PDSIconType;
|
|
37
37
|
iBtn3IconFillType?: 'fill' | 'line';
|
|
38
38
|
iBtn3IconColorKey?: UiColors;
|
|
39
|
+
overrideBorderColorKey?: UiColors;
|
|
39
40
|
paddingTop?: PaddingSpacingType;
|
|
40
41
|
paddingRight?: PaddingSpacingType;
|
|
41
42
|
paddingBottom?: PaddingSpacingType;
|
|
@@ -62,5 +63,5 @@ declare const paddingSpacing: {
|
|
|
62
63
|
readonly spacing_m: "spacingM";
|
|
63
64
|
readonly spacing_n: "spacingN";
|
|
64
65
|
};
|
|
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;
|
|
66
|
+
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, overrideBorderColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
66
67
|
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, _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;
|
|
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, overrideBorderColorKey = _a.overrideBorderColorKey, _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;
|
|
@@ -81,7 +81,9 @@ function BoxItem(_a) {
|
|
|
81
81
|
return ((0, jsx_runtime_1.jsx)(S_BoxItem, __assign({ "x-pds-name": "BoxItem", "x-pds-element-type": "component", "x-pds-device-type": "desktop", onClick: handleClick }, { children: (0, jsx_runtime_1.jsxs)(panels_1.ContentSheet, __assign({ shapeType: "round", radius: 16, width: "100%", height: "responsive", paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, borderMode: "use", borderColorTheme: state === 'disabled' ? undefined : selectState === 'selected' ? 'blue' : undefined, overrideBorderColorKey: state === 'disabled'
|
|
82
82
|
? 'ui_cpnt_sheet_base'
|
|
83
83
|
: selectState === 'selected'
|
|
84
|
-
?
|
|
84
|
+
? overrideBorderColorKey
|
|
85
|
+
? overrideBorderColorKey
|
|
86
|
+
: undefined
|
|
85
87
|
: 'ui_cpnt_sheet_base', borderWidth: selectionMode === 'use' ? 2 : undefined, overrideCSS: {
|
|
86
88
|
display: 'flex',
|
|
87
89
|
flexDirection: 'row',
|
|
@@ -36,6 +36,7 @@ export type BoxItemProps = {
|
|
|
36
36
|
iBtn3IconName?: PDSIconType;
|
|
37
37
|
iBtn3IconFillType?: 'fill' | 'line';
|
|
38
38
|
iBtn3IconColorKey?: UiColors;
|
|
39
|
+
overrideBorderColorKey?: UiColors;
|
|
39
40
|
paddingTop?: PaddingSpacingType;
|
|
40
41
|
paddingRight?: PaddingSpacingType;
|
|
41
42
|
paddingBottom?: PaddingSpacingType;
|
|
@@ -62,5 +63,5 @@ declare const paddingSpacing: {
|
|
|
62
63
|
readonly spacing_m: "spacingM";
|
|
63
64
|
readonly spacing_n: "spacingN";
|
|
64
65
|
};
|
|
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;
|
|
66
|
+
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, overrideBorderColorKey, iBtn3IconFillType, iBtn3IconColorKey, paddingTop, paddingRight, paddingBottom, paddingLeft, id, onClick, onClickIBtn1, onClickIBtn2, onClickIBtn3 }: BoxItemProps): JSX.Element;
|
|
66
67
|
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, _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;
|
|
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, overrideBorderColorKey = _a.overrideBorderColorKey, _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;
|
|
@@ -81,7 +81,9 @@ function BoxItem(_a) {
|
|
|
81
81
|
return ((0, jsx_runtime_1.jsx)(S_BoxItem, __assign({ "x-pds-name": "BoxItem", "x-pds-element-type": "component", "x-pds-device-type": "mobile", onClick: handleClick }, { children: (0, jsx_runtime_1.jsxs)(panels_1.ContentSheet, __assign({ shapeType: "round", radius: 16, width: "100%", height: "responsive", paddingTop: paddingTop, paddingRight: paddingRight, paddingBottom: paddingBottom, paddingLeft: paddingLeft, borderMode: "use", borderColorTheme: state === 'disabled' ? undefined : selectState === 'selected' ? 'blue' : undefined, overrideBorderColorKey: state === 'disabled'
|
|
82
82
|
? 'ui_cpnt_sheet_base'
|
|
83
83
|
: selectState === 'selected'
|
|
84
|
-
?
|
|
84
|
+
? overrideBorderColorKey
|
|
85
|
+
? overrideBorderColorKey
|
|
86
|
+
: undefined
|
|
85
87
|
: 'ui_cpnt_sheet_base', borderWidth: selectionMode === 'use' ? 2 : undefined, overrideCSS: {
|
|
86
88
|
display: 'flex',
|
|
87
89
|
flexDirection: 'row',
|
|
@@ -200,22 +200,26 @@ function AdminList(_a) {
|
|
|
200
200
|
? react_1.default.isValidElement(bulkActionBar) && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: react_1.default.cloneElement(bulkActionBar, {
|
|
201
201
|
itemCount: totalItemCount
|
|
202
202
|
}) }))
|
|
203
|
-
: toolBar && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolBar, (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_d" })] })), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)(
|
|
203
|
+
: toolBar && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolBar, (0, jsx_runtime_1.jsx)(components_2.Spacing, { size: "spacing_d" })] })), headerRowMode === 'use' && ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, selectAllMethods, { children: (0, jsx_runtime_1.jsx)(HeaderRowStyle, __assign({ scrollVisibleType: scrollVisibleType, scrollMode: scrollMode }, { children: (0, jsx_runtime_1.jsx)(HeaderRow_1.default, { headerRowCheckboxName: headerRowCheckboxName, selectionMode: selectionMode, column2HeaderText: column2HeaderText, column3HeaderText: column3HeaderText, column3HeaderWidth: column3Width, column4HeaderText: column4HeaderText, column4HeaderWidth: column4Width, column5HeaderText: column5HeaderText, column5HeaderWidth: column5Width, column6HeaderText: column6HeaderText, column6HeaderWidth: column6Width, column7HeaderText: column7HeaderText, column7HeaderWidth: column7Width, column8HeaderText: column8HeaderText, column8HeaderWidth: column8Width, column9HeaderText: column9HeaderText, column9HeaderWidth: column9Width, column10HeaderText: column10HeaderText, column10HeaderWidth: column10Width, quickActionBtnType: quickActionBtnType, quickActionButtonCount: getActionButtonCount(), flexibleHideInfoMode: flexibleHideInfoMode, onClickSelectAllCheckbox: handleSelectAllCheckbox }) })) }))), (0, jsx_runtime_1.jsx)(S_ScrollBox, __assign({ scrollMode: scrollMode, scrollVisibleType: scrollVisibleType }, { children: react_1.default.Children.count(children) ? ((0, jsx_runtime_1.jsx)(react_hook_form_1.FormProvider, __assign({}, checkboxMethods, { children: (0, jsx_runtime_1.jsx)("form", { children: childrenWithWidthProps }) }))) : ((0, jsx_runtime_1.jsx)(S_EmptyTextWrapper, { children: (0, jsx_runtime_1.jsx)(components_1.TextLabel, { text: emptyText, colorTheme: "sysTextTertiary", textAlign: "center", styleTheme: "body2Regular" }) })) }))] })));
|
|
204
204
|
}
|
|
205
|
+
var HeaderRowStyle = styled_components_1.default.form(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n padding-right: ", ";\n"], ["\n padding-right: ", ";\n"])), function (_a) {
|
|
206
|
+
var scrollVisibleType = _a.scrollVisibleType;
|
|
207
|
+
return scrollVisibleType !== 'hidden' && '8px';
|
|
208
|
+
});
|
|
205
209
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
206
|
-
var scrollInvisible = (0, styled_components_1.css)(
|
|
210
|
+
var scrollInvisible = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n }\n"], ["\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n }\n"])));
|
|
207
211
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
208
|
-
var scrollVisible = (0, styled_components_1.css)(
|
|
212
|
+
var scrollVisible = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n display: initial;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ", ";\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n"], ["\n &::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n display: initial;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: ", ";\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n"])), function (_a) {
|
|
209
213
|
var theme = _a.theme;
|
|
210
214
|
return theme.ui_cpnt_button_line_border_enabled;
|
|
211
215
|
});
|
|
212
|
-
var S_AdminList = styled_components_1.default.div(
|
|
213
|
-
var S_ScrollBox = styled_components_1.default.div(
|
|
216
|
+
var S_AdminList = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
|
|
217
|
+
var S_ScrollBox = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n flex: 1;\n overflow-x: hidden;\n overflow-y: ", ";\n position: relative;\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n height: 8px;\n width: 8px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n scrollbar-gutter: stable;\n scrollbar-width: ", ";\n"], ["\n flex: 1;\n overflow-x: hidden;\n overflow-y: ", ";\n position: relative;\n &::-webkit-scrollbar {\n all: unset;\n display: block;\n height: 8px;\n width: 8px;\n }\n\n &::-webkit-scrollbar-thumb {\n background-color: #ccc;\n border-radius: 4px;\n }\n\n &::-webkit-scrollbar-track {\n background-color: transparent;\n }\n\n scrollbar-gutter: stable;\n scrollbar-width: ", ";\n"])), function (_a) {
|
|
214
218
|
var scrollMode = _a.scrollMode;
|
|
215
219
|
switch (scrollMode) {
|
|
216
220
|
case 'infinite':
|
|
217
221
|
case 'page': {
|
|
218
|
-
return '
|
|
222
|
+
return 'overlay';
|
|
219
223
|
}
|
|
220
224
|
case 'none': {
|
|
221
225
|
return 'none';
|
|
@@ -223,8 +227,8 @@ var S_ScrollBox = styled_components_1.default.div(templateObject_4 || (templateO
|
|
|
223
227
|
}
|
|
224
228
|
}, function (_a) {
|
|
225
229
|
var scrollVisibleType = _a.scrollVisibleType;
|
|
226
|
-
return scrollVisibleType === 'hidden' ? 'none' : '
|
|
230
|
+
return (scrollVisibleType === 'hidden' ? 'none' : 'auto');
|
|
227
231
|
});
|
|
228
|
-
var S_EmptyTextWrapper = styled_components_1.default.div(
|
|
232
|
+
var S_EmptyTextWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n padding-bottom: 88px;\n padding-top: 88px;\n"], ["\n padding-bottom: 88px;\n padding-top: 88px;\n"])));
|
|
229
233
|
exports.default = AdminList;
|
|
230
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
|
234
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
|
package/package.json
CHANGED