@rh-support/components 1.2.14 → 1.2.16
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/lib/cjs/InlineEdit/InlineEdit.d.ts +4 -0
- package/lib/cjs/InlineEdit/InlineEdit.d.ts.map +1 -1
- package/lib/cjs/InlineEdit/InlineEdit.js +12 -3
- package/lib/cjs/InlineEdit/inlineEdit.css +15 -0
- package/lib/cjs/Table/PFTable.d.ts.map +1 -1
- package/lib/cjs/Table/PFTable.js +1 -3
- package/lib/cjs/Table/TablePagination.js +1 -1
- package/lib/esm/InlineEdit/InlineEdit.d.ts +4 -0
- package/lib/esm/InlineEdit/InlineEdit.d.ts.map +1 -1
- package/lib/esm/InlineEdit/InlineEdit.js +14 -4
- package/lib/esm/InlineEdit/inlineEdit.css +15 -0
- package/lib/esm/Table/PFTable.d.ts.map +1 -1
- package/lib/esm/Table/PFTable.js +1 -3
- package/lib/esm/Table/TablePagination.js +1 -1
- package/package.json +2 -2
|
@@ -19,6 +19,10 @@ interface IProps {
|
|
|
19
19
|
onSave: any;
|
|
20
20
|
onCancel: any;
|
|
21
21
|
cancelOnToggle?: boolean;
|
|
22
|
+
charCount: number;
|
|
23
|
+
charTotal: number;
|
|
24
|
+
cancelToggleState?: boolean;
|
|
25
|
+
saveToggleState?: boolean;
|
|
22
26
|
collapseOnBlur?: boolean;
|
|
23
27
|
saveOnBlur?: boolean;
|
|
24
28
|
saveDisabled?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InlineEdit.d.ts","sourceRoot":"","sources":["../../../src/InlineEdit/InlineEdit.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAC;AAI1B,OAAc,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"InlineEdit.d.ts","sourceRoot":"","sources":["../../../src/InlineEdit/InlineEdit.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAC;AAI1B,OAAc,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAG9D,UAAU,MAAM;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACtC,UAAU,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACxC,YAAY,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAC1C,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAC5C,gBAAgB,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC/B,eAAe,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,cAAc,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,SAAS,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAChC,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,GAAG,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAG1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAsBD,iBAAS,UAAU,CAAC,KAAK,EAAE,MAAM,eAqLhC;kBArLQ,UAAU;;;AAwLnB,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -117,6 +117,13 @@ function InlineEdit(props) {
|
|
|
117
117
|
// editingTrueOnStart is a state to track if inlineEdit component is open on start, we don't want to focus
|
|
118
118
|
// on input/textareat in this situation as we may have other form elements on page that we want to focus
|
|
119
119
|
var _c = __read(react_1.useState(!props.initialIsEditing), 2), canAutoSetFocus = _c[0], setCanAutoSfocus = _c[1];
|
|
120
|
+
// To close InlineEdit input and show content whenever cancel is clicked
|
|
121
|
+
react_1.useEffect(function () {
|
|
122
|
+
if (isEditing) {
|
|
123
|
+
setIsEditing(!isEditing);
|
|
124
|
+
}
|
|
125
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
126
|
+
}, [props.cancelToggleState, props.saveToggleState]);
|
|
120
127
|
var onEditClicked = function (e) {
|
|
121
128
|
setCanAutoSfocus(true);
|
|
122
129
|
e.preventDefault();
|
|
@@ -211,19 +218,21 @@ function InlineEdit(props) {
|
|
|
211
218
|
react_1.default.createElement(react_i18next_1.Trans, null, props.cancelLabel))));
|
|
212
219
|
};
|
|
213
220
|
var canShowContent = !isEditing && props.allowInlineEdit && props.content;
|
|
221
|
+
var showCount = " " + props.charCount + " / " + props.charTotal;
|
|
214
222
|
return (react_1.default.createElement("div", { className: "form-group edit-question " + props.formClassName, id: props.formId },
|
|
215
223
|
!props.hideLabel && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
216
224
|
react_1.default.createElement("label", __assign({}, props.labelProps),
|
|
217
225
|
react_1.default.createElement("span", { className: "label-edit" }, props.labelContent),
|
|
218
226
|
props.helperContent,
|
|
219
|
-
renderEditButton()))),
|
|
227
|
+
!props.content && !isEditing ? renderEditButton() : null))),
|
|
220
228
|
renderSaveCancel(),
|
|
229
|
+
props.hideSaveCancel && isEditing && (react_1.default.createElement("span", { className: "\n " + (props.charCount > props.charTotal ? 'char-count pf-u-danger-color-100' : 'char-count') }, props.charCount ? showCount : null)),
|
|
221
230
|
canShowContent && !props.usePreformattedTag && (react_1.default.createElement(react_1.default.Fragment, null,
|
|
222
231
|
react_1.default.createElement("p", { id: props.inputId, style: { display: props.hideLabel ? 'inline' : 'block' } },
|
|
223
232
|
props.content,
|
|
224
|
-
|
|
233
|
+
react_1.default.createElement(react_1.default.Fragment, null,
|
|
225
234
|
props.helperContent,
|
|
226
|
-
renderEditButton())
|
|
235
|
+
renderEditButton()),
|
|
227
236
|
props.loadingIndicator && react_1.default.createElement("span", { className: "loading-indicator" }, props.loadingIndicator)))),
|
|
228
237
|
canShowContent && props.usePreformattedTag && react_1.default.createElement("pre", { id: props.inputId }, props.content),
|
|
229
238
|
react_1.default.createElement(react_1.default.Fragment, null,
|
|
@@ -27,3 +27,18 @@
|
|
|
27
27
|
.case-overview .edit-question .loading-indicator {
|
|
28
28
|
margin-left: 0px;
|
|
29
29
|
}
|
|
30
|
+
|
|
31
|
+
/* Character Count */
|
|
32
|
+
.char-count {
|
|
33
|
+
float: right;
|
|
34
|
+
position: relative;
|
|
35
|
+
padding-right: var(--pf-global--spacer--4xl);
|
|
36
|
+
margin-right: var(--pf-global--spacer--lg);
|
|
37
|
+
font-size: 12px;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
@media (max-width: 415px) {
|
|
41
|
+
.char-count {
|
|
42
|
+
padding-right: var(--pf-global--spacer--2xl);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAMR,UAAU,EAGb,MAAM,yBAAyB,CAAC;AACjC,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA6C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAMR,UAAU,EAGb,MAAM,yBAAyB,CAAC;AACjC,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA6C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,eAyK7B;AAED,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC"}
|
package/lib/cjs/Table/PFTable.js
CHANGED
|
@@ -149,9 +149,7 @@ function PFTable(props) {
|
|
|
149
149
|
var title = item.title, isSortable = item.sortable, show = item.show, width = item.cellWidth;
|
|
150
150
|
// tslint:disable-next-line:no-object-literal-type-assertion
|
|
151
151
|
var mappedColumn = {};
|
|
152
|
-
|
|
153
|
-
mappedColumn['title'] = item.title;
|
|
154
|
-
}
|
|
152
|
+
mappedColumn['title'] = title || '';
|
|
155
153
|
if (isSortable) {
|
|
156
154
|
mappedColumn['transforms'] = [];
|
|
157
155
|
mappedColumn['transforms'].push(react_table_1.sortable);
|
|
@@ -31,7 +31,7 @@ function TablePagination(props) {
|
|
|
31
31
|
};
|
|
32
32
|
var onPerPageSelect = function (event, pageSize) {
|
|
33
33
|
setPerPage(pageSize);
|
|
34
|
-
props.onPerPageSelect && props.onPerPageSelect({ pageSize: pageSize, currentPage:
|
|
34
|
+
props.onPerPageSelect && props.onPerPageSelect({ pageSize: pageSize, currentPage: 1 });
|
|
35
35
|
};
|
|
36
36
|
react_1.useEffect(function () {
|
|
37
37
|
props.perPage && props.perPage !== perPage && setPerPage(props.perPage);
|
|
@@ -19,6 +19,10 @@ interface IProps {
|
|
|
19
19
|
onSave: any;
|
|
20
20
|
onCancel: any;
|
|
21
21
|
cancelOnToggle?: boolean;
|
|
22
|
+
charCount: number;
|
|
23
|
+
charTotal: number;
|
|
24
|
+
cancelToggleState?: boolean;
|
|
25
|
+
saveToggleState?: boolean;
|
|
22
26
|
collapseOnBlur?: boolean;
|
|
23
27
|
saveOnBlur?: boolean;
|
|
24
28
|
saveDisabled?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InlineEdit.d.ts","sourceRoot":"","sources":["../../../src/InlineEdit/InlineEdit.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAC;AAI1B,OAAc,EAAE,SAAS,
|
|
1
|
+
{"version":3,"file":"InlineEdit.d.ts","sourceRoot":"","sources":["../../../src/InlineEdit/InlineEdit.tsx"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAC;AAI1B,OAAc,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAG9D,UAAU,MAAM;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IACtC,UAAU,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACxC,YAAY,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAC1C,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAC5C,gBAAgB,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC;IAC/B,eAAe,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,cAAc,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAClC,SAAS,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAChC,MAAM,EAAE,GAAG,CAAC;IACZ,QAAQ,EAAE,GAAG,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAG1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB;AAsBD,iBAAS,UAAU,CAAC,KAAK,EAAE,MAAM,eAqLhC;kBArLQ,UAAU;;;AAwLnB,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -10,7 +10,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
10
10
|
import './inlineEdit.css';
|
|
11
11
|
import PencilAltIcon from '@patternfly/react-icons/dist/js/icons/pencil-alt-icon';
|
|
12
12
|
import { isEmpty } from 'lodash';
|
|
13
|
-
import React, { useState } from 'react';
|
|
13
|
+
import React, { useEffect, useState } from 'react';
|
|
14
14
|
import { Trans } from 'react-i18next';
|
|
15
15
|
const defaultProps = {
|
|
16
16
|
allowInlineEdit: false,
|
|
@@ -37,6 +37,13 @@ function InlineEdit(props) {
|
|
|
37
37
|
// editingTrueOnStart is a state to track if inlineEdit component is open on start, we don't want to focus
|
|
38
38
|
// on input/textareat in this situation as we may have other form elements on page that we want to focus
|
|
39
39
|
const [canAutoSetFocus, setCanAutoSfocus] = useState(!props.initialIsEditing);
|
|
40
|
+
// To close InlineEdit input and show content whenever cancel is clicked
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
if (isEditing) {
|
|
43
|
+
setIsEditing(!isEditing);
|
|
44
|
+
}
|
|
45
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
46
|
+
}, [props.cancelToggleState, props.saveToggleState]);
|
|
40
47
|
const onEditClicked = (e) => {
|
|
41
48
|
setCanAutoSfocus(true);
|
|
42
49
|
e.preventDefault();
|
|
@@ -100,19 +107,22 @@ function InlineEdit(props) {
|
|
|
100
107
|
React.createElement("button", { type: "button", "data-tracking-id": props.dataTrackingId ? `${props.dataTrackingId}-inline-edit-cancel` : null, className: "btn btn-app btn-link", onClick: onCancelClicked },
|
|
101
108
|
React.createElement(Trans, null, props.cancelLabel))));
|
|
102
109
|
const canShowContent = !isEditing && props.allowInlineEdit && props.content;
|
|
110
|
+
const showCount = ` ${props.charCount} / ${props.charTotal}`;
|
|
103
111
|
return (React.createElement("div", { className: `form-group edit-question ${props.formClassName}`, id: props.formId },
|
|
104
112
|
!props.hideLabel && (React.createElement(React.Fragment, null,
|
|
105
113
|
React.createElement("label", Object.assign({}, props.labelProps),
|
|
106
114
|
React.createElement("span", { className: "label-edit" }, props.labelContent),
|
|
107
115
|
props.helperContent,
|
|
108
|
-
renderEditButton()))),
|
|
116
|
+
!props.content && !isEditing ? renderEditButton() : null))),
|
|
109
117
|
renderSaveCancel(),
|
|
118
|
+
props.hideSaveCancel && isEditing && (React.createElement("span", { className: `
|
|
119
|
+
${props.charCount > props.charTotal ? 'char-count pf-u-danger-color-100' : 'char-count'}` }, props.charCount ? showCount : null)),
|
|
110
120
|
canShowContent && !props.usePreformattedTag && (React.createElement(React.Fragment, null,
|
|
111
121
|
React.createElement("p", { id: props.inputId, style: { display: props.hideLabel ? 'inline' : 'block' } },
|
|
112
122
|
props.content,
|
|
113
|
-
|
|
123
|
+
React.createElement(React.Fragment, null,
|
|
114
124
|
props.helperContent,
|
|
115
|
-
renderEditButton())
|
|
125
|
+
renderEditButton()),
|
|
116
126
|
props.loadingIndicator && React.createElement("span", { className: "loading-indicator" }, props.loadingIndicator)))),
|
|
117
127
|
canShowContent && props.usePreformattedTag && React.createElement("pre", { id: props.inputId }, props.content),
|
|
118
128
|
React.createElement(React.Fragment, null,
|
|
@@ -27,3 +27,18 @@
|
|
|
27
27
|
.case-overview .edit-question .loading-indicator {
|
|
28
28
|
margin-left: 0px;
|
|
29
29
|
}
|
|
30
|
+
|
|
31
|
+
/* Character Count */
|
|
32
|
+
.char-count {
|
|
33
|
+
float: right;
|
|
34
|
+
position: relative;
|
|
35
|
+
padding-right: var(--pf-global--spacer--4xl);
|
|
36
|
+
margin-right: var(--pf-global--spacer--lg);
|
|
37
|
+
font-size: 12px;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
@media (max-width: 415px) {
|
|
41
|
+
.char-count {
|
|
42
|
+
padding-right: var(--pf-global--spacer--2xl);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAMR,UAAU,EAGb,MAAM,yBAAyB,CAAC;AACjC,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA6C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"PFTable.d.ts","sourceRoot":"","sources":["../../../src/Table/PFTable.tsx"],"names":[],"mappings":"AAEA,OAAO,EAGH,UAAU,EACV,IAAI,EACJ,QAAQ,EAMR,UAAU,EAGb,MAAM,yBAAyB,CAAC;AACjC,OAAc,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAC;AA6C3E,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,UAAU,CAAC,EAAE,CAAC,CAAC,KAAA,EAAE,CAAC,KAAA,EAAE,aAAa,CAAC,KAAA,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;IAElD;;;OAGG;IACH,IAAI,CAAC,EAAE,CAAC,IAAI,KAAA,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAC1C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,CAAC;IACzB,SAAS,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC;CACpF;AAED,UAAU,SAAS;IACf,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;IAC1B,MAAM,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,OAAO;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC;CAC7B;AAED,UAAU,MAAO,SAAQ,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC7E,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,KAAA,EAAE,GAAG,KAAA,EAAE,KAAK,KAAA,KAAK,IAAI,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,KAAK,GAAG,CAAC;IACnE,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,IAAI,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACxC;AAGD,eAAO,MAAM,sBAAsB,gCAAoB,CAAC;AAExD,iBAAS,OAAO,CAAC,KAAK,EAAE,MAAM,eAyK7B;AAED,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC"}
|
package/lib/esm/Table/PFTable.js
CHANGED
|
@@ -91,9 +91,7 @@ function PFTable(props) {
|
|
|
91
91
|
const { title, sortable: isSortable, show, cellWidth: width } = item;
|
|
92
92
|
// tslint:disable-next-line:no-object-literal-type-assertion
|
|
93
93
|
const mappedColumn = {};
|
|
94
|
-
|
|
95
|
-
mappedColumn['title'] = item.title;
|
|
96
|
-
}
|
|
94
|
+
mappedColumn['title'] = title || '';
|
|
97
95
|
if (isSortable) {
|
|
98
96
|
mappedColumn['transforms'] = [];
|
|
99
97
|
mappedColumn['transforms'].push(sortable);
|
|
@@ -9,7 +9,7 @@ export function TablePagination(props) {
|
|
|
9
9
|
};
|
|
10
10
|
const onPerPageSelect = (event, pageSize) => {
|
|
11
11
|
setPerPage(pageSize);
|
|
12
|
-
props.onPerPageSelect && props.onPerPageSelect({ pageSize, currentPage });
|
|
12
|
+
props.onPerPageSelect && props.onPerPageSelect({ pageSize, currentPage: 1 });
|
|
13
13
|
};
|
|
14
14
|
useEffect(() => {
|
|
15
15
|
props.perPage && props.perPage !== perPage && setPerPage(props.perPage);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rh-support/components",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.16",
|
|
4
4
|
"description": "Contains all reusabel components for support app",
|
|
5
5
|
"author": "Vikas Rathee <vrathee@redhat.com>",
|
|
6
6
|
"license": "ISC",
|
|
@@ -126,5 +126,5 @@
|
|
|
126
126
|
"not ie <= 11",
|
|
127
127
|
"not op_mini all"
|
|
128
128
|
],
|
|
129
|
-
"gitHead": "
|
|
129
|
+
"gitHead": "af45effefff4d9434a171992428c249f80fc84ce"
|
|
130
130
|
}
|