@michalrakus/x-react-web-lib 1.7.2 → 1.7.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.
- package/XLocale.d.ts +3 -0
- package/XLocale.js +5 -0
- package/gulpfile.js +1 -0
- package/lib/components/XExportRowsDialog.js +8 -7
- package/lib/components/XFormDataTable2.d.ts +4 -4
- package/lib/components/XFormDataTable2.js +14 -5
- package/lib/components/XFormFooter.js +3 -2
- package/lib/components/XInputFileList.d.ts +0 -1
- package/lib/components/XInputFileList.js +6 -6
- package/lib/components/XLazyDataTable.js +16 -14
- package/lib/components/XLocale.d.ts +26 -0
- package/lib/components/XLocale.js +59 -0
- package/lib/components/locale/x-en.json +26 -0
- package/package.json +3 -3
package/XLocale.d.ts
ADDED
package/XLocale.js
ADDED
package/gulpfile.js
CHANGED
|
@@ -49,6 +49,7 @@ function generateApi(cb) {
|
|
|
49
49
|
"./lib/components/XInputText",
|
|
50
50
|
"./lib/components/XInputTextarea",
|
|
51
51
|
"./lib/components/XLazyDataTable",
|
|
52
|
+
"./lib/components/XLocale",
|
|
52
53
|
"./lib/components/XLoginDialog",
|
|
53
54
|
"./lib/components/XLoginForm",
|
|
54
55
|
"./lib/components/XSearchButton",
|
|
@@ -85,6 +85,7 @@ var checkbox_1 = require("primereact/checkbox");
|
|
|
85
85
|
var XButton_1 = require("./XButton");
|
|
86
86
|
var XUtils_1 = require("./XUtils");
|
|
87
87
|
var XUtilsConversions_1 = require("./XUtilsConversions");
|
|
88
|
+
var XLocale_1 = require("./XLocale");
|
|
88
89
|
var XExportRowsDialog = function (props) {
|
|
89
90
|
var _a, _b;
|
|
90
91
|
var _c = __read((0, react_1.useState)(ExportImportParam_1.ExportType.Csv), 2), exportType = _c[0], setExportType = _c[1];
|
|
@@ -153,16 +154,16 @@ var XExportRowsDialog = function (props) {
|
|
|
153
154
|
if (exportType === ExportImportParam_1.ExportType.Csv) {
|
|
154
155
|
elem = react_1.default.createElement("span", null,
|
|
155
156
|
react_1.default.createElement("div", { className: "field grid" },
|
|
156
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
157
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expCreateHeaderLine')),
|
|
157
158
|
react_1.default.createElement(checkbox_1.Checkbox, { checked: createHeaderLine, onChange: function (e) { return setCreateHeaderLine(e.checked); } })),
|
|
158
159
|
react_1.default.createElement("div", { className: "field grid" },
|
|
159
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
160
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expCsvSeparator')),
|
|
160
161
|
react_1.default.createElement(dropdown_1.Dropdown, { value: csvSeparator, options: XUtils_1.XUtils.csvSeparatorOptions, onChange: function (e) { return setCsvSeparator(e.value); } })),
|
|
161
162
|
react_1.default.createElement("div", { className: "field grid" },
|
|
162
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
163
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expDecimalFormat')),
|
|
163
164
|
react_1.default.createElement(dropdown_1.Dropdown, { value: decimalFormat, options: XUtils_1.XUtils.decimalFormatOptions, onChange: function (e) { return setDecimalFormat(e.value); } })),
|
|
164
165
|
react_1.default.createElement("div", { className: "field grid" },
|
|
165
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
166
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expEncoding')),
|
|
166
167
|
react_1.default.createElement(dropdown_1.Dropdown, { value: csvEncoding, options: XUtils_1.XUtils.csvEncodingOptions, onChange: function (e) { return setCsvEncoding(e.value); } })));
|
|
167
168
|
}
|
|
168
169
|
}
|
|
@@ -170,14 +171,14 @@ var XExportRowsDialog = function (props) {
|
|
|
170
171
|
return (react_1.default.createElement(dialog_1.Dialog, { visible: props.dialogOpened, onShow: onShow, onHide: function () { return props.hideDialog(); } },
|
|
171
172
|
props.rowCount ?
|
|
172
173
|
react_1.default.createElement("div", { className: "field grid" },
|
|
173
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
174
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expRowCount')),
|
|
174
175
|
react_1.default.createElement(inputtext_1.InputText, { value: (0, XUtilsConversions_1.numberAsUI)((_a = props.rowCount) !== null && _a !== void 0 ? _a : null, 0), readOnly: true }))
|
|
175
176
|
: null,
|
|
176
177
|
react_1.default.createElement("div", { className: "field grid" },
|
|
177
|
-
react_1.default.createElement("label", { className: "col-fixed", style: { width: '
|
|
178
|
+
react_1.default.createElement("label", { className: "col-fixed", style: { width: '10rem' } }, (0, XLocale_1.xLocaleOption)('expExportType')),
|
|
178
179
|
react_1.default.createElement(dropdown_1.Dropdown, { value: exportType, options: (_b = props.exportTypeOptions) !== null && _b !== void 0 ? _b : XUtils_1.XUtils.exportTypeOptions, onChange: function (e) { return setExportType(e.value); } })),
|
|
179
180
|
elem,
|
|
180
181
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
181
|
-
react_1.default.createElement(XButton_1.XButton, { label:
|
|
182
|
+
react_1.default.createElement(XButton_1.XButton, { label: (0, XLocale_1.xLocaleOption)('exportRows'), onClick: onExport }))));
|
|
182
183
|
};
|
|
183
184
|
exports.XExportRowsDialog = XExportRowsDialog;
|
|
@@ -35,9 +35,9 @@ export interface XFormDataTableProps {
|
|
|
35
35
|
onClickAddRow?: () => void;
|
|
36
36
|
onClickRemoveRow?: (row: any) => void;
|
|
37
37
|
removeButtonInRow: boolean;
|
|
38
|
-
addRowLabel
|
|
38
|
+
addRowLabel?: string;
|
|
39
39
|
addRowIcon?: IconType<ButtonProps>;
|
|
40
|
-
removeRowLabel
|
|
40
|
+
removeRowLabel?: string;
|
|
41
41
|
removeRowIcon?: IconType<ButtonProps>;
|
|
42
42
|
width?: string;
|
|
43
43
|
children: ReactChild[];
|
|
@@ -52,8 +52,8 @@ export declare class XFormDataTable2 extends Component<XFormDataTableProps> {
|
|
|
52
52
|
shrinkWidth: boolean;
|
|
53
53
|
showAddRemoveButtons: boolean;
|
|
54
54
|
removeButtonInRow: boolean;
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
addRowIcon: string;
|
|
56
|
+
removeRowIcon: string;
|
|
57
57
|
};
|
|
58
58
|
props: XFormDataTableProps;
|
|
59
59
|
entity?: string;
|
|
@@ -79,6 +79,7 @@ var tristatecheckbox_1 = require("primereact/tristatecheckbox");
|
|
|
79
79
|
var api_1 = require("primereact/api");
|
|
80
80
|
var XAutoCompleteDT_1 = require("./XAutoCompleteDT");
|
|
81
81
|
var XButtonIconNarrow_1 = require("./XButtonIconNarrow");
|
|
82
|
+
var XLocale_1 = require("./XLocale");
|
|
82
83
|
var XFormDataTable2 = /** @class */ (function (_super) {
|
|
83
84
|
__extends(XFormDataTable2, _super);
|
|
84
85
|
function XFormDataTable2(props) {
|
|
@@ -494,6 +495,7 @@ var XFormDataTable2 = /** @class */ (function (_super) {
|
|
|
494
495
|
};
|
|
495
496
|
XFormDataTable2.prototype.render = function () {
|
|
496
497
|
var _this = this;
|
|
498
|
+
var _a, _b;
|
|
497
499
|
var paginator = this.props.paginator !== undefined ? this.props.paginator : false;
|
|
498
500
|
var rows = undefined;
|
|
499
501
|
if (paginator) {
|
|
@@ -616,6 +618,13 @@ var XFormDataTable2 = /** @class */ (function (_super) {
|
|
|
616
618
|
// je dolezite nastavit sirku header-a, lebo inac ma stlpec sirku 0 a nevidno ho
|
|
617
619
|
columnElemList.push(react_1.default.createElement(column_1.Column, { key: "removeButton", headerStyle: { width: '2rem' }, body: function (rowData) { return react_1.default.createElement(XButtonIconNarrow_1.XButtonIconNarrow, { icon: "pi pi-times", onClick: function () { return _this.removeRow(rowData); }, disabled: readOnly, addMargin: false }); } }));
|
|
618
620
|
}
|
|
621
|
+
var addRowLabel = undefined;
|
|
622
|
+
var removeRowLabel = undefined;
|
|
623
|
+
if (this.props.showAddRemoveButtons) {
|
|
624
|
+
// calling xLocaleOption does not work in standard default values initialisation place (public static defaultProps)
|
|
625
|
+
addRowLabel = (_a = this.props.addRowLabel) !== null && _a !== void 0 ? _a : (0, XLocale_1.xLocaleOption)('addRow');
|
|
626
|
+
removeRowLabel = (_b = this.props.removeRowLabel) !== null && _b !== void 0 ? _b : (0, XLocale_1.xLocaleOption)('removeRow');
|
|
627
|
+
}
|
|
619
628
|
return (react_1.default.createElement("div", null,
|
|
620
629
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
621
630
|
react_1.default.createElement("label", null, label)),
|
|
@@ -623,8 +632,8 @@ var XFormDataTable2 = /** @class */ (function (_super) {
|
|
|
623
632
|
react_1.default.createElement(datatable_1.DataTable, { ref: function (el) { return _this.dt = el; }, value: valueList, dataKey: this.dataKey, paginator: paginator, rows: rows, totalRecords: valueList.length, filterDisplay: filterDisplay, filters: this.state.filters, onFilter: this.onFilter, sortMode: "multiple", removableSort: true, multiSortMeta: this.props.sortField !== undefined ? [{ field: this.props.sortField, order: 1 }] : undefined, selectionMode: "single", selection: this.state.selectedRow, onSelectionChange: this.onSelectionChange, className: "p-datatable-sm x-form-datatable", resizableColumns: true, columnResizeMode: "expand", tableStyle: tableStyle, scrollable: this.props.scrollable, scrollHeight: scrollHeight, style: style }, columnElemList)),
|
|
624
633
|
this.props.showAddRemoveButtons ?
|
|
625
634
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
626
|
-
react_1.default.createElement(XButton_1.XButton, { icon: this.props.addRowIcon, label:
|
|
627
|
-
this.props.removeButtonInRow ? undefined : react_1.default.createElement(XButton_1.XButton, { icon: this.props.removeRowIcon, label:
|
|
635
|
+
react_1.default.createElement(XButton_1.XButton, { icon: this.props.addRowIcon, label: addRowLabel, onClick: this.onClickAddRow, disabled: readOnly }),
|
|
636
|
+
this.props.removeButtonInRow ? undefined : react_1.default.createElement(XButton_1.XButton, { icon: this.props.removeRowIcon, label: removeRowLabel, onClick: this.onClickRemoveRowBySelection, disabled: readOnly }))
|
|
628
637
|
: undefined));
|
|
629
638
|
};
|
|
630
639
|
XFormDataTable2.defaultProps = {
|
|
@@ -636,9 +645,9 @@ var XFormDataTable2 = /** @class */ (function (_super) {
|
|
|
636
645
|
// tym ze pouzivame 200vh (max-height pre body), tak realne scrollovanie sa zapne az pri velmi vela riadkoch
|
|
637
646
|
shrinkWidth: true,
|
|
638
647
|
showAddRemoveButtons: true,
|
|
639
|
-
removeButtonInRow:
|
|
640
|
-
|
|
641
|
-
|
|
648
|
+
removeButtonInRow: true,
|
|
649
|
+
addRowIcon: "pi pi-plus",
|
|
650
|
+
removeRowIcon: "pi pi-times"
|
|
642
651
|
};
|
|
643
652
|
return XFormDataTable2;
|
|
644
653
|
}(react_1.Component));
|
|
@@ -6,13 +6,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
exports.XFormFooter = exports.xSaveButtonId = void 0;
|
|
7
7
|
var react_1 = __importDefault(require("react"));
|
|
8
8
|
var XButton_1 = require("./XButton");
|
|
9
|
+
var XLocale_1 = require("./XLocale");
|
|
9
10
|
// constant to be used in method formReadOnly to identify save button
|
|
10
11
|
exports.xSaveButtonId = "x-save-button-id";
|
|
11
12
|
// helper wrapper
|
|
12
13
|
var XFormFooter = function (props) {
|
|
13
14
|
var readOnly = props.form.formReadOnlyBase(exports.xSaveButtonId);
|
|
14
15
|
return (react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
15
|
-
react_1.default.createElement(XButton_1.XButton, {
|
|
16
|
-
react_1.default.createElement(XButton_1.XButton, {
|
|
16
|
+
react_1.default.createElement(XButton_1.XButton, { icon: "pi pi-save", label: (0, XLocale_1.xLocaleOption)('save'), onClick: props.form.onClickSave, disabled: readOnly }),
|
|
17
|
+
react_1.default.createElement(XButton_1.XButton, { icon: "pi pi-times", label: (0, XLocale_1.xLocaleOption)('cancel'), onClick: props.form.onClickCancel })));
|
|
17
18
|
};
|
|
18
19
|
exports.XFormFooter = XFormFooter;
|
|
@@ -74,6 +74,7 @@ var XUtils_1 = require("./XUtils");
|
|
|
74
74
|
var XButton_1 = require("./XButton");
|
|
75
75
|
var XButtonIconNarrow_1 = require("./XButtonIconNarrow");
|
|
76
76
|
var XUtilsConversions_1 = require("./XUtilsConversions");
|
|
77
|
+
var XLocale_1 = require("./XLocale");
|
|
77
78
|
var XInputFileList = /** @class */ (function (_super) {
|
|
78
79
|
__extends(XInputFileList, _super);
|
|
79
80
|
function XInputFileList(props) {
|
|
@@ -111,7 +112,7 @@ var XInputFileList = /** @class */ (function (_super) {
|
|
|
111
112
|
file = _b.value;
|
|
112
113
|
// skontrolujeme velkost - robime to tuto, lebo ked nastavime maxFileSize na komponente FileUpload, tak prilis velky subor sem do handlera ani neposle
|
|
113
114
|
if (this.props.maxFileSize !== undefined && file.size > this.props.maxFileSize) {
|
|
114
|
-
alert(
|
|
115
|
+
alert((0, XLocale_1.xLocaleOption)('fileUploadSizeToBig', { fileName: file.name, fileSize: XInputFileList.sizeInMB(file.size), maxFileSize: XInputFileList.sizeInMB(this.props.maxFileSize) }));
|
|
115
116
|
return [3 /*break*/, 7]; // ideme na dalsi subor
|
|
116
117
|
}
|
|
117
118
|
xFile = void 0;
|
|
@@ -124,7 +125,7 @@ var XInputFileList = /** @class */ (function (_super) {
|
|
|
124
125
|
return [3 /*break*/, 6];
|
|
125
126
|
case 5:
|
|
126
127
|
e_1 = _d.sent();
|
|
127
|
-
XUtils_1.XUtils.showErrorMessage(
|
|
128
|
+
XUtils_1.XUtils.showErrorMessage((0, XLocale_1.xLocaleOption)('fileUploadFailed', { fileName: file.name }), e_1);
|
|
128
129
|
this.fileUploadRef.current.clear(); // vyprazdnime hidden input, nech moze user znova zadat subory
|
|
129
130
|
return [2 /*return*/]; // prerusime upload tohto a dalsich suborov
|
|
130
131
|
case 6:
|
|
@@ -171,7 +172,7 @@ var XInputFileList = /** @class */ (function (_super) {
|
|
|
171
172
|
return [3 /*break*/, 3];
|
|
172
173
|
case 2:
|
|
173
174
|
e_3 = _a.sent();
|
|
174
|
-
XUtils_1.XUtils.showErrorMessage(
|
|
175
|
+
XUtils_1.XUtils.showErrorMessage((0, XLocale_1.xLocaleOption)('fileDownloadFailed'), e_3);
|
|
175
176
|
return [2 /*return*/];
|
|
176
177
|
case 3:
|
|
177
178
|
fileName = xFile.name;
|
|
@@ -201,7 +202,7 @@ var XInputFileList = /** @class */ (function (_super) {
|
|
|
201
202
|
XInputFileList.prototype.render = function () {
|
|
202
203
|
var e_4, _a;
|
|
203
204
|
var _this = this;
|
|
204
|
-
var _b, _c;
|
|
205
|
+
var _b, _c, _d;
|
|
205
206
|
var label = (_b = this.props.label) !== null && _b !== void 0 ? _b : this.props.assocField;
|
|
206
207
|
var readOnly = this.props.form.formReadOnlyBase(this.props.assocField) || ((_c = this.props.readOnly) !== null && _c !== void 0 ? _c : false);
|
|
207
208
|
var object = this.props.form.state.object;
|
|
@@ -233,10 +234,9 @@ var XInputFileList = /** @class */ (function (_super) {
|
|
|
233
234
|
return (react_1.default.createElement("div", null,
|
|
234
235
|
react_1.default.createElement("label", null, label),
|
|
235
236
|
elemList,
|
|
236
|
-
react_1.default.createElement(fileupload_1.FileUpload, { ref: this.fileUploadRef, mode: "basic", multiple: true, auto: true, customUpload: true, uploadHandler: this.uploadHandler, chooseLabel: this.props.chooseLabel, className: "m-1", disabled: readOnly })));
|
|
237
|
+
react_1.default.createElement(fileupload_1.FileUpload, { ref: this.fileUploadRef, mode: "basic", multiple: true, auto: true, customUpload: true, uploadHandler: this.uploadHandler, chooseLabel: (_d = this.props.chooseLabel) !== null && _d !== void 0 ? _d : (0, XLocale_1.xLocaleOption)('addRow'), className: "m-1", disabled: readOnly })));
|
|
237
238
|
};
|
|
238
239
|
XInputFileList.defaultProps = {
|
|
239
|
-
chooseLabel: "Add",
|
|
240
240
|
saveDest: "fileSystem"
|
|
241
241
|
};
|
|
242
242
|
return XInputFileList;
|
|
@@ -114,6 +114,7 @@ var XExportRowsDialog_1 = require("./XExportRowsDialog");
|
|
|
114
114
|
var api_1 = require("primereact/api");
|
|
115
115
|
var XCalendar_1 = require("./XCalendar");
|
|
116
116
|
var XInputDecimalBase_1 = require("./XInputDecimalBase");
|
|
117
|
+
var XLocale_1 = require("./XLocale");
|
|
117
118
|
var XLazyDataTable = function (props) {
|
|
118
119
|
var _a;
|
|
119
120
|
// must be here, is used in createInitFilters()
|
|
@@ -384,7 +385,7 @@ var XLazyDataTable = function (props) {
|
|
|
384
385
|
}
|
|
385
386
|
}
|
|
386
387
|
else {
|
|
387
|
-
alert(
|
|
388
|
+
alert((0, XLocale_1.xLocaleOption)('pleaseSelectRow'));
|
|
388
389
|
}
|
|
389
390
|
};
|
|
390
391
|
var onClickRemoveRow = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
@@ -404,7 +405,7 @@ var XLazyDataTable = function (props) {
|
|
|
404
405
|
return [3 /*break*/, 4];
|
|
405
406
|
case 3:
|
|
406
407
|
e_5 = _a.sent();
|
|
407
|
-
XUtils_1.XUtils.showErrorMessage(
|
|
408
|
+
XUtils_1.XUtils.showErrorMessage((0, XLocale_1.xLocaleOption)('removeRowFailed'), e_5);
|
|
408
409
|
return [3 /*break*/, 4];
|
|
409
410
|
case 4:
|
|
410
411
|
if (reread) {
|
|
@@ -415,7 +416,7 @@ var XLazyDataTable = function (props) {
|
|
|
415
416
|
}
|
|
416
417
|
return [3 /*break*/, 10];
|
|
417
418
|
case 5:
|
|
418
|
-
if (!window.confirm(
|
|
419
|
+
if (!window.confirm((0, XLocale_1.xLocaleOption)('removeRowConfirm'))) return [3 /*break*/, 10];
|
|
419
420
|
_a.label = 6;
|
|
420
421
|
case 6:
|
|
421
422
|
_a.trys.push([6, 8, , 9]);
|
|
@@ -427,7 +428,7 @@ var XLazyDataTable = function (props) {
|
|
|
427
428
|
return [3 /*break*/, 9];
|
|
428
429
|
case 8:
|
|
429
430
|
e_6 = _a.sent();
|
|
430
|
-
XUtils_1.XUtils.showErrorMessage(
|
|
431
|
+
XUtils_1.XUtils.showErrorMessage((0, XLocale_1.xLocaleOption)('removeRowFailed'), e_6);
|
|
431
432
|
return [3 /*break*/, 9];
|
|
432
433
|
case 9:
|
|
433
434
|
loadData();
|
|
@@ -437,7 +438,7 @@ var XLazyDataTable = function (props) {
|
|
|
437
438
|
_a.label = 10;
|
|
438
439
|
case 10: return [3 /*break*/, 12];
|
|
439
440
|
case 11:
|
|
440
|
-
alert(
|
|
441
|
+
alert((0, XLocale_1.xLocaleOption)('pleaseSelectRow'));
|
|
441
442
|
_a.label = 12;
|
|
442
443
|
case 12: return [2 /*return*/];
|
|
443
444
|
}
|
|
@@ -686,7 +687,8 @@ var XLazyDataTable = function (props) {
|
|
|
686
687
|
// pouzivame paginatorLeft aj paginatorRight (aj prazdny) pouzivame, aby bol default paginator v strede (bez paginatorLeft je default paginator presunuty dolava a naopak)
|
|
687
688
|
// sirku div-ov este nastavujeme v css na 10rem
|
|
688
689
|
var paginatorLeft = react_1.default.createElement("div", null,
|
|
689
|
-
|
|
690
|
+
(0, XLocale_1.xLocaleOption)('totalRecords'),
|
|
691
|
+
": ",
|
|
690
692
|
value.totalRecords);
|
|
691
693
|
var paginatorRight = react_1.default.createElement("div", null);
|
|
692
694
|
if (props.editMode === true) {
|
|
@@ -852,18 +854,18 @@ var XLazyDataTable = function (props) {
|
|
|
852
854
|
});
|
|
853
855
|
return (react_1.default.createElement("div", null,
|
|
854
856
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
855
|
-
react_1.default.createElement(XButton_1.XButton, {
|
|
856
|
-
react_1.default.createElement(XButton_1.XButton, {
|
|
857
|
+
react_1.default.createElement(XButton_1.XButton, { key: "filter", label: (0, XLocale_1.xLocaleOption)('filter'), onClick: onClickFilter }),
|
|
858
|
+
react_1.default.createElement(XButton_1.XButton, { key: "clearFilter", label: (0, XLocale_1.xLocaleOption)('clearFilter'), onClick: onClickClearFilter })),
|
|
857
859
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
858
860
|
react_1.default.createElement(datatable_1.DataTable, { value: value.rowList, dataKey: dataKey, paginator: props.paginator, rows: rows, totalRecords: value.totalRecords, lazy: true, first: first, onPage: onPage, loading: loading, filterDisplay: props.filterDisplay, filters: filters, onFilter: onFilter, sortMode: "multiple", removableSort: true, multiSortMeta: multiSortMeta, onSort: onSort, selectionMode: "single", selection: selectedRow, onSelectionChange: onSelectionChange, onRowDoubleClick: onRowDoubleClick, ref: dataTableEl, className: "p-datatable-sm x-lazy-datatable", resizableColumns: true, columnResizeMode: "expand", tableStyle: tableStyle, paginatorLeft: paginatorLeft, paginatorRight: paginatorRight, scrollable: props.scrollable, scrollHeight: scrollHeight, style: style }, columnElemList)),
|
|
859
861
|
react_1.default.createElement("div", { className: "flex justify-content-center" },
|
|
860
|
-
props.onAddRow !== undefined ? react_1.default.createElement(XButton_1.XButton, {
|
|
861
|
-
props.onEdit !== undefined ? react_1.default.createElement(XButton_1.XButton, {
|
|
862
|
-
props.removeRow !== undefined && props.removeRow !== false ? react_1.default.createElement(XButton_1.XButton, {
|
|
863
|
-
exportRows ? react_1.default.createElement(XButton_1.XButton, {
|
|
862
|
+
props.onAddRow !== undefined ? react_1.default.createElement(XButton_1.XButton, { key: "addRow", icon: "pi pi-plus", label: (0, XLocale_1.xLocaleOption)('addRow'), onClick: onClickAddRow }) : null,
|
|
863
|
+
props.onEdit !== undefined ? react_1.default.createElement(XButton_1.XButton, { key: "editRow", icon: "pi pi-pencil", label: (0, XLocale_1.xLocaleOption)('editRow'), onClick: onClickEdit }) : null,
|
|
864
|
+
props.removeRow !== undefined && props.removeRow !== false ? react_1.default.createElement(XButton_1.XButton, { key: "removeRow", icon: "pi pi-times", label: (0, XLocale_1.xLocaleOption)('removeRow'), onClick: onClickRemoveRow }) : null,
|
|
865
|
+
exportRows ? react_1.default.createElement(XButton_1.XButton, { key: "exportRows", icon: "pi pi-file-export", label: (0, XLocale_1.xLocaleOption)('exportRows'), onClick: onClickExport }) : null,
|
|
864
866
|
props.appButtons,
|
|
865
|
-
props.searchTableParams !== undefined ? react_1.default.createElement(XButton_1.XButton, {
|
|
866
|
-
exportRows ? react_1.default.createElement(XExportRowsDialog_1.XExportRowsDialog, { dialogOpened: exportRowsDialogOpened, hideDialog: function () { return setExportRowsDialogOpened(false); }, rowCount: exportRowsDialogRowCount, exportParams: createExportParams }) : null)));
|
|
867
|
+
props.searchTableParams !== undefined ? react_1.default.createElement(XButton_1.XButton, { key: "choose", label: (0, XLocale_1.xLocaleOption)('chooseRow'), onClick: onClickChoose }) : null,
|
|
868
|
+
exportRows ? react_1.default.createElement(XExportRowsDialog_1.XExportRowsDialog, { key: "exportRowsDialog", dialogOpened: exportRowsDialogOpened, hideDialog: function () { return setExportRowsDialogOpened(false); }, rowCount: exportRowsDialogRowCount, exportParams: createExportParams }) : null)));
|
|
867
869
|
};
|
|
868
870
|
exports.XLazyDataTable = XLazyDataTable;
|
|
869
871
|
exports.XLazyDataTable.defaultProps = {
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
export interface XLocaleOptions {
|
|
2
|
+
filter?: string;
|
|
3
|
+
clearFilter?: string;
|
|
4
|
+
addRow?: string;
|
|
5
|
+
editRow?: string;
|
|
6
|
+
removeRow?: string;
|
|
7
|
+
exportRows?: string;
|
|
8
|
+
chooseRow?: string;
|
|
9
|
+
totalRecords?: string;
|
|
10
|
+
pleaseSelectRow?: string;
|
|
11
|
+
removeRowConfirm?: string;
|
|
12
|
+
removeRowFailed?: string;
|
|
13
|
+
save?: string;
|
|
14
|
+
cancel?: string;
|
|
15
|
+
expRowCount?: string;
|
|
16
|
+
expExportType?: string;
|
|
17
|
+
expCreateHeaderLine?: string;
|
|
18
|
+
expCsvSeparator?: string;
|
|
19
|
+
expDecimalFormat?: string;
|
|
20
|
+
expEncoding?: string;
|
|
21
|
+
fileUploadSizeToBig?: string;
|
|
22
|
+
fileUploadFailed?: string;
|
|
23
|
+
fileDownloadFailed?: string;
|
|
24
|
+
}
|
|
25
|
+
export declare function xAddLocale(locale: string, xOptions: XLocaleOptions): void;
|
|
26
|
+
export declare function xLocaleOption(xOptionKey: string, options?: any[string]): any;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
+
};
|
|
28
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
+
exports.xLocaleOption = exports.xAddLocale = void 0;
|
|
30
|
+
var api_1 = __importStar(require("primereact/api"));
|
|
31
|
+
// using json-loader module we import x-en.json file into variable xEnJsonObject
|
|
32
|
+
var x_en_json_1 = __importDefault(require("./locale/x-en.json"));
|
|
33
|
+
// under this key are x-locale saved inside of PrimeReact locale
|
|
34
|
+
var xOptionsKey = "xOptions";
|
|
35
|
+
function xAddLocale(locale, xOptions) {
|
|
36
|
+
(0, api_1.updateLocaleOption)(xOptionsKey, xOptions, locale);
|
|
37
|
+
}
|
|
38
|
+
exports.xAddLocale = xAddLocale;
|
|
39
|
+
// using this method are x-locale read
|
|
40
|
+
function xLocaleOption(xOptionKey, options) {
|
|
41
|
+
var _locale = api_1.default.locale || 'en';
|
|
42
|
+
try {
|
|
43
|
+
var optionValue = (0, api_1.localeOptions)(_locale)[xOptionsKey][xOptionKey];
|
|
44
|
+
if (optionValue && options) {
|
|
45
|
+
for (var key in options) {
|
|
46
|
+
if (options.hasOwnProperty(key)) {
|
|
47
|
+
optionValue = optionValue.replace("{".concat(key, "}"), options[key]);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
return optionValue;
|
|
52
|
+
}
|
|
53
|
+
catch (error) {
|
|
54
|
+
throw new Error("The ".concat(xOptionKey, " option is not found in the current x-locale('").concat(_locale, "')."));
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
exports.xLocaleOption = xLocaleOption;
|
|
58
|
+
// add en locale into PrimeReact locale (global variable "locales" declared in file Locale.js)
|
|
59
|
+
xAddLocale('en', x_en_json_1.default.en);
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
{
|
|
2
|
+
"en": {
|
|
3
|
+
"filter": "Filter",
|
|
4
|
+
"clearFilter": "Clear filter",
|
|
5
|
+
"addRow": "Add",
|
|
6
|
+
"editRow": "Edit",
|
|
7
|
+
"removeRow": "Remove",
|
|
8
|
+
"exportRows": "Export",
|
|
9
|
+
"chooseRow": "Choose",
|
|
10
|
+
"totalRecords": "Total records",
|
|
11
|
+
"pleaseSelectRow": "Please select the row.",
|
|
12
|
+
"removeRowConfirm": "Are you sure to remove the selected row?",
|
|
13
|
+
"removeRowFailed": "Remove row failed.",
|
|
14
|
+
"save": "Save",
|
|
15
|
+
"cancel": "Cancel",
|
|
16
|
+
"expRowCount": "Row count",
|
|
17
|
+
"expExportType": "Export type",
|
|
18
|
+
"expCreateHeaderLine": "Create header line",
|
|
19
|
+
"expCsvSeparator": "Csv separator",
|
|
20
|
+
"expDecimalFormat": "Decimal format",
|
|
21
|
+
"expEncoding": "Encoding",
|
|
22
|
+
"fileUploadSizeToBig": "Upload of file \"{fileName}\" was canceled: file size {fileSize} is more than maximum allowed size {maxFileSize}.",
|
|
23
|
+
"fileUploadFailed": "Upload of file \"{fileName}\" failed.",
|
|
24
|
+
"fileDownloadFailed": "File download failed."
|
|
25
|
+
}
|
|
26
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@michalrakus/x-react-web-lib",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.3",
|
|
4
4
|
"description": "",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"clean": "rimraf lib",
|
|
@@ -38,9 +38,9 @@
|
|
|
38
38
|
"typescript": "^4.9.5"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
|
-
"primeflex": "^3.3.
|
|
41
|
+
"primeflex": "^3.3.1",
|
|
42
42
|
"primeicons": "^6.0.1",
|
|
43
|
-
"primereact": "~9.
|
|
43
|
+
"primereact": "~9.6.0",
|
|
44
44
|
"react": "^18.2.0",
|
|
45
45
|
"react-dom": "^18.2.0",
|
|
46
46
|
"react-transition-group": "^4.4.5"
|