@luomus/laji-form 15.1.80 → 15.1.82
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/laji-form.js +1 -1
- package/lib/components/components/ConfirmButton.d.ts +40 -0
- package/lib/components/components/ConfirmButton.js +140 -0
- package/lib/components/components/DeleteButton.d.ts +0 -13
- package/lib/components/components/DeleteButton.js +6 -84
- package/lib/components/fields/ConditionalUiSchemaField.d.ts +7 -7
- package/lib/components/fields/ConditionalUiSchemaField.js +1 -1
- package/lib/components/fields/FilterArrayField.d.ts +4 -4
- package/lib/components/fields/ImageArrayField.d.ts +2 -0
- package/lib/components/fields/ImageArrayField.js +5 -3
- package/lib/components/fields/MultiArrayField.d.ts +2 -2
- package/lib/components/widgets/InputWithDefaultValueButtonWidget.d.ts +8 -1
- package/lib/components/widgets/InputWithDefaultValueButtonWidget.js +35 -12
- package/lib/utils.js +2 -2
- package/package.json +1 -1
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { ButtonProps } from "../components";
|
|
3
|
+
import { FormContext } from "../LajiForm";
|
|
4
|
+
type Props = ButtonProps & {
|
|
5
|
+
confirmStyle?: "browser";
|
|
6
|
+
tooltip?: string;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
readonly?: boolean;
|
|
9
|
+
confirm?: boolean;
|
|
10
|
+
confirmPlacement?: string;
|
|
11
|
+
onClick: () => void;
|
|
12
|
+
style?: React.CSSProperties;
|
|
13
|
+
translations: FormContext["translations"];
|
|
14
|
+
prompt: string;
|
|
15
|
+
confirmButtonVariant?: string;
|
|
16
|
+
confirmButtonText?: string;
|
|
17
|
+
confirmButtonId?: string;
|
|
18
|
+
cancelButtonId?: string;
|
|
19
|
+
};
|
|
20
|
+
type State = {
|
|
21
|
+
show?: boolean;
|
|
22
|
+
};
|
|
23
|
+
export declare class ConfirmButton extends React.Component<Props, State> {
|
|
24
|
+
static contextType: React.Context<import("../../ReactContext").ContextProps>;
|
|
25
|
+
buttonRef: React.RefObject<any>;
|
|
26
|
+
constructor(props: Props);
|
|
27
|
+
onButtonKeyDown: ({ key }: React.KeyboardEvent) => void;
|
|
28
|
+
onHideConfirm: () => void;
|
|
29
|
+
onShowConfirm: (e: React.MouseEvent) => void;
|
|
30
|
+
onCancelClick: (e: React.MouseEvent) => void;
|
|
31
|
+
onConfirmedClick: (e?: React.KeyboardEvent | React.MouseEvent) => void;
|
|
32
|
+
onClick: (e: React.MouseEvent) => void;
|
|
33
|
+
setConfirmAutofocus: (elem?: React.ReactInstance) => void;
|
|
34
|
+
render(): JSX.Element;
|
|
35
|
+
renderConfirm: () => JSX.Element | null;
|
|
36
|
+
getOverlayTarget: () => Element | Text | null;
|
|
37
|
+
renderConfirmPopup(): JSX.Element;
|
|
38
|
+
browserConfirm(): void;
|
|
39
|
+
}
|
|
40
|
+
export {};
|
|
@@ -0,0 +1,140 @@
|
|
|
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 () {
|
|
19
|
+
var ownKeys = function(o) {
|
|
20
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
21
|
+
var ar = [];
|
|
22
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
23
|
+
return ar;
|
|
24
|
+
};
|
|
25
|
+
return ownKeys(o);
|
|
26
|
+
};
|
|
27
|
+
return function (mod) {
|
|
28
|
+
if (mod && mod.__esModule) return mod;
|
|
29
|
+
var result = {};
|
|
30
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
31
|
+
__setModuleDefault(result, mod);
|
|
32
|
+
return result;
|
|
33
|
+
};
|
|
34
|
+
})();
|
|
35
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
36
|
+
var t = {};
|
|
37
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
38
|
+
t[p] = s[p];
|
|
39
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
40
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
41
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
42
|
+
t[p[i]] = s[p[i]];
|
|
43
|
+
}
|
|
44
|
+
return t;
|
|
45
|
+
};
|
|
46
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
47
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
48
|
+
};
|
|
49
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
50
|
+
exports.ConfirmButton = void 0;
|
|
51
|
+
const React = __importStar(require("react"));
|
|
52
|
+
const react_dom_1 = require("react-dom");
|
|
53
|
+
const ReactContext_1 = __importDefault(require("../../ReactContext"));
|
|
54
|
+
const components_1 = require("../components");
|
|
55
|
+
class ConfirmButton extends React.Component {
|
|
56
|
+
constructor(props) {
|
|
57
|
+
super(props);
|
|
58
|
+
this.buttonRef = React.createRef();
|
|
59
|
+
this.onButtonKeyDown = ({ key }) => {
|
|
60
|
+
if (key === "Enter")
|
|
61
|
+
this.onConfirmedClick();
|
|
62
|
+
else if (key === "Escape")
|
|
63
|
+
this.setState({ show: false });
|
|
64
|
+
};
|
|
65
|
+
this.onHideConfirm = () => {
|
|
66
|
+
this.setState({ show: false });
|
|
67
|
+
};
|
|
68
|
+
this.onShowConfirm = (e) => {
|
|
69
|
+
e.preventDefault();
|
|
70
|
+
e.stopPropagation();
|
|
71
|
+
this.setState({ show: true }, () => {
|
|
72
|
+
if (this.props.confirmStyle === "browser") {
|
|
73
|
+
this.browserConfirm();
|
|
74
|
+
}
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
|
+
this.onCancelClick = (e) => {
|
|
78
|
+
e.preventDefault();
|
|
79
|
+
e.stopPropagation();
|
|
80
|
+
this.onHideConfirm();
|
|
81
|
+
};
|
|
82
|
+
this.onConfirmedClick = (e) => {
|
|
83
|
+
e && e.preventDefault();
|
|
84
|
+
e && e.stopPropagation();
|
|
85
|
+
this.props.onClick();
|
|
86
|
+
this.onHideConfirm();
|
|
87
|
+
};
|
|
88
|
+
this.onClick = (e) => {
|
|
89
|
+
this.props.confirm ? this.onShowConfirm(e) : this.onConfirmedClick(e);
|
|
90
|
+
};
|
|
91
|
+
this.setConfirmAutofocus = (elem) => {
|
|
92
|
+
setTimeout(() => {
|
|
93
|
+
var _a;
|
|
94
|
+
(_a = (0, react_dom_1.findDOMNode)(elem)) === null || _a === void 0 ? void 0 : _a.focus();
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
this.renderConfirm = () => {
|
|
98
|
+
const { show } = this.state;
|
|
99
|
+
if (!show) {
|
|
100
|
+
return null;
|
|
101
|
+
}
|
|
102
|
+
const { confirmStyle = "popup" } = this.props;
|
|
103
|
+
if (confirmStyle === "popup") {
|
|
104
|
+
return this.renderConfirmPopup();
|
|
105
|
+
}
|
|
106
|
+
return null;
|
|
107
|
+
};
|
|
108
|
+
this.getOverlayTarget = () => (0, react_dom_1.findDOMNode)(this.buttonRef.current);
|
|
109
|
+
this.state = { show: false };
|
|
110
|
+
}
|
|
111
|
+
render() {
|
|
112
|
+
const { props } = this;
|
|
113
|
+
const { tooltip, disabled, readonly, confirm, confirmPlacement, confirmStyle, prompt, confirmButtonVariant, confirmButtonText, confirmButtonId, cancelButtonId } = props, maybeProps = __rest(props, ["tooltip", "disabled", "readonly", "confirm", "confirmPlacement", "confirmStyle", "prompt", "confirmButtonVariant", "confirmButtonText", "confirmButtonId", "cancelButtonId"]);
|
|
114
|
+
const button = React.createElement(React.Fragment, null,
|
|
115
|
+
React.createElement(components_1.Button, Object.assign({}, maybeProps, { disabled: disabled || readonly, style: this.props.style, ref: this.buttonRef, onKeyDown: this.onButtonKeyDown, onClick: this.onClick }), this.props.children),
|
|
116
|
+
this.renderConfirm());
|
|
117
|
+
return tooltip ? React.createElement(components_1.TooltipComponent, { tooltip: tooltip }, button) : button;
|
|
118
|
+
}
|
|
119
|
+
renderConfirmPopup() {
|
|
120
|
+
const { translations, confirmPlacement = "left", prompt, confirmButtonVariant, confirmButtonText, confirmButtonId, cancelButtonId } = this.props;
|
|
121
|
+
const { Overlay, Popover, ButtonGroup } = this.context.theme;
|
|
122
|
+
return (React.createElement(Overlay, { show: true, placement: confirmPlacement, rootClose: true, onHide: this.onHideConfirm, target: this.getOverlayTarget },
|
|
123
|
+
React.createElement(Popover, { id: `${this.props.id}-button-confirm` },
|
|
124
|
+
React.createElement("span", null, prompt),
|
|
125
|
+
React.createElement(ButtonGroup, null,
|
|
126
|
+
React.createElement(components_1.Button, { variant: confirmButtonVariant || "primary", onClick: this.onConfirmedClick, ref: this.setConfirmAutofocus, id: confirmButtonId || `${this.props.id}-confirm-yes` }, confirmButtonText || "OK"),
|
|
127
|
+
React.createElement(components_1.Button, { variant: "default", onClick: this.onCancelClick, id: cancelButtonId || `${this.props.id}-confirm-no` }, translations.Cancel)))));
|
|
128
|
+
}
|
|
129
|
+
browserConfirm() {
|
|
130
|
+
const choice = confirm(this.props.prompt);
|
|
131
|
+
if (choice) {
|
|
132
|
+
this.onConfirmedClick();
|
|
133
|
+
}
|
|
134
|
+
else {
|
|
135
|
+
this.onHideConfirm();
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
exports.ConfirmButton = ConfirmButton;
|
|
140
|
+
ConfirmButton.contextType = ReactContext_1.default;
|
|
@@ -19,19 +19,6 @@ type State = {
|
|
|
19
19
|
};
|
|
20
20
|
export declare class DeleteButton extends React.Component<Props, State> {
|
|
21
21
|
static contextType: React.Context<import("../../ReactContext").ContextProps>;
|
|
22
|
-
buttonRef: React.RefObject<any>;
|
|
23
|
-
constructor(props: Props);
|
|
24
|
-
onButtonKeyDown: ({ key }: React.KeyboardEvent) => void;
|
|
25
|
-
onHideConfirm: () => void;
|
|
26
|
-
onShowConfirm: (e: React.MouseEvent) => void;
|
|
27
|
-
onCancelClick: (e: React.MouseEvent) => void;
|
|
28
|
-
onConfirmedClick: (e?: React.KeyboardEvent | React.MouseEvent) => void;
|
|
29
|
-
onClick: (e: React.MouseEvent) => void;
|
|
30
|
-
setConfirmAutofocus: (elem?: React.ReactInstance) => void;
|
|
31
22
|
render(): JSX.Element;
|
|
32
|
-
renderConfirm: () => JSX.Element | null;
|
|
33
|
-
getOverlayTarget: () => Element | Text | null;
|
|
34
|
-
renderConfirmPopup(): JSX.Element;
|
|
35
|
-
browserConfirm(): void;
|
|
36
23
|
}
|
|
37
24
|
export {};
|
|
@@ -49,68 +49,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
49
49
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
50
50
|
exports.DeleteButton = void 0;
|
|
51
51
|
const React = __importStar(require("react"));
|
|
52
|
-
const react_dom_1 = require("react-dom");
|
|
53
52
|
const ReactContext_1 = __importDefault(require("../../ReactContext"));
|
|
54
|
-
const
|
|
53
|
+
const ConfirmButton_1 = require("./ConfirmButton");
|
|
55
54
|
class DeleteButton extends React.Component {
|
|
56
|
-
constructor(props) {
|
|
57
|
-
super(props);
|
|
58
|
-
this.buttonRef = React.createRef();
|
|
59
|
-
this.onButtonKeyDown = ({ key }) => {
|
|
60
|
-
if (key === "Enter")
|
|
61
|
-
this.onConfirmedClick();
|
|
62
|
-
else if (key === "Escape")
|
|
63
|
-
this.setState({ show: false });
|
|
64
|
-
};
|
|
65
|
-
this.onHideConfirm = () => {
|
|
66
|
-
this.setState({ show: false });
|
|
67
|
-
};
|
|
68
|
-
this.onShowConfirm = (e) => {
|
|
69
|
-
e.preventDefault();
|
|
70
|
-
e.stopPropagation();
|
|
71
|
-
this.setState({ show: true }, () => {
|
|
72
|
-
if (this.props.confirmStyle === "browser") {
|
|
73
|
-
this.browserConfirm();
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
};
|
|
77
|
-
this.onCancelClick = (e) => {
|
|
78
|
-
e.preventDefault();
|
|
79
|
-
e.stopPropagation();
|
|
80
|
-
this.onHideConfirm();
|
|
81
|
-
};
|
|
82
|
-
this.onConfirmedClick = (e) => {
|
|
83
|
-
e && e.preventDefault();
|
|
84
|
-
e && e.stopPropagation();
|
|
85
|
-
this.props.onClick();
|
|
86
|
-
this.onHideConfirm();
|
|
87
|
-
};
|
|
88
|
-
this.onClick = (e) => {
|
|
89
|
-
this.props.confirm ? this.onShowConfirm(e) : this.onConfirmedClick(e);
|
|
90
|
-
};
|
|
91
|
-
this.setConfirmAutofocus = (elem) => {
|
|
92
|
-
setTimeout(() => {
|
|
93
|
-
var _a;
|
|
94
|
-
(_a = (0, react_dom_1.findDOMNode)(elem)) === null || _a === void 0 ? void 0 : _a.focus();
|
|
95
|
-
});
|
|
96
|
-
};
|
|
97
|
-
this.renderConfirm = () => {
|
|
98
|
-
const { show } = this.state;
|
|
99
|
-
if (!show) {
|
|
100
|
-
return null;
|
|
101
|
-
}
|
|
102
|
-
const { confirmStyle = "popup" } = this.props;
|
|
103
|
-
if (confirmStyle === "popup") {
|
|
104
|
-
return this.renderConfirmPopup();
|
|
105
|
-
}
|
|
106
|
-
return null;
|
|
107
|
-
};
|
|
108
|
-
this.getOverlayTarget = () => (0, react_dom_1.findDOMNode)(this.buttonRef.current);
|
|
109
|
-
this.state = { show: false };
|
|
110
|
-
}
|
|
111
55
|
render() {
|
|
112
56
|
const { props } = this;
|
|
113
|
-
const { corner,
|
|
57
|
+
const { corner, glyphButton = true } = props, maybeProps = __rest(props, ["corner", "glyphButton"]);
|
|
114
58
|
let buttonClassName = glyphButton ? "glyph-button" : "";
|
|
115
59
|
buttonClassName += corner ? " button-corner" : "";
|
|
116
60
|
if (props.className) {
|
|
@@ -119,32 +63,10 @@ class DeleteButton extends React.Component {
|
|
|
119
63
|
if (props.id !== undefined) {
|
|
120
64
|
maybeProps.id = `${props.id}-delete`;
|
|
121
65
|
}
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
"✖"),
|
|
127
|
-
this.renderConfirm());
|
|
128
|
-
return tooltip ? React.createElement(components_1.TooltipComponent, { tooltip: tooltip }, button) : button;
|
|
129
|
-
}
|
|
130
|
-
renderConfirmPopup() {
|
|
131
|
-
const { translations, confirmPlacement = "left" } = this.props;
|
|
132
|
-
const { Overlay, Popover, ButtonGroup } = this.context.theme;
|
|
133
|
-
return (React.createElement(Overlay, { show: true, placement: confirmPlacement, rootClose: true, onHide: this.onHideConfirm, target: this.getOverlayTarget },
|
|
134
|
-
React.createElement(Popover, { id: `${this.props.id}-button-confirm` },
|
|
135
|
-
React.createElement("span", null, translations.ConfirmRemove),
|
|
136
|
-
React.createElement(ButtonGroup, null,
|
|
137
|
-
React.createElement(components_1.Button, { variant: "danger", onClick: this.onConfirmedClick, ref: this.setConfirmAutofocus, id: `${this.props.id}-delete-confirm-yes` }, translations.Remove),
|
|
138
|
-
React.createElement(components_1.Button, { variant: "default", onClick: this.onCancelClick, id: `${this.props.id}-delete-confirm-no` }, translations.Cancel)))));
|
|
139
|
-
}
|
|
140
|
-
browserConfirm() {
|
|
141
|
-
const choice = confirm(this.props.translations.ConfirmRemove);
|
|
142
|
-
if (choice) {
|
|
143
|
-
this.onConfirmedClick();
|
|
144
|
-
}
|
|
145
|
-
else {
|
|
146
|
-
this.onHideConfirm();
|
|
147
|
-
}
|
|
66
|
+
return (React.createElement(ConfirmButton_1.ConfirmButton, Object.assign({}, maybeProps, { variant: "danger", className: buttonClassName, prompt: props.translations.ConfirmRemove, confirmButtonVariant: "danger", confirmButtonText: props.translations.Remove, confirmButtonId: `${this.props.id}-delete-confirm-yes`, cancelButtonId: `${this.props.id}-delete-confirm-no` }),
|
|
67
|
+
this.props.children,
|
|
68
|
+
" ",
|
|
69
|
+
"✖"));
|
|
148
70
|
}
|
|
149
71
|
}
|
|
150
72
|
exports.DeleteButton = DeleteButton;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export const rulePropType: PropTypes.Requireable<NonNullable<string | PropTypes.InferProps<{
|
|
2
|
-
container: PropTypes.Requireable<string>;
|
|
3
2
|
field: PropTypes.Validator<string>;
|
|
4
3
|
regexp: PropTypes.Requireable<string>;
|
|
5
4
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
6
5
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
6
|
+
prop: PropTypes.Requireable<string>;
|
|
7
7
|
complement: PropTypes.Requireable<boolean>;
|
|
8
8
|
}> | PropTypes.InferProps<{
|
|
9
9
|
rule: PropTypes.Requireable<string>;
|
|
@@ -14,21 +14,21 @@ export const operationPropType: PropTypes.Requireable<PropTypes.InferProps<{
|
|
|
14
14
|
uiSchema: PropTypes.Validator<object>;
|
|
15
15
|
}>>;
|
|
16
16
|
export const rulesPropType: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
17
|
-
container: PropTypes.Requireable<string>;
|
|
18
17
|
field: PropTypes.Validator<string>;
|
|
19
18
|
regexp: PropTypes.Requireable<string>;
|
|
20
19
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
21
20
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
21
|
+
prop: PropTypes.Requireable<string>;
|
|
22
22
|
complement: PropTypes.Requireable<boolean>;
|
|
23
23
|
}> | PropTypes.InferProps<{
|
|
24
24
|
rule: PropTypes.Requireable<string>;
|
|
25
25
|
complement: PropTypes.Requireable<boolean>;
|
|
26
26
|
}> | null | undefined> | (NonNullable<string | PropTypes.InferProps<{
|
|
27
|
-
container: PropTypes.Requireable<string>;
|
|
28
27
|
field: PropTypes.Validator<string>;
|
|
29
28
|
regexp: PropTypes.Requireable<string>;
|
|
30
29
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
31
30
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
31
|
+
prop: PropTypes.Requireable<string>;
|
|
32
32
|
complement: PropTypes.Requireable<boolean>;
|
|
33
33
|
}> | PropTypes.InferProps<{
|
|
34
34
|
rule: PropTypes.Requireable<string>;
|
|
@@ -67,21 +67,21 @@ export default class ConditionalUiSchemaField extends React.Component<any, any,
|
|
|
67
67
|
"ui:options": PropTypes.Requireable<PropTypes.InferProps<{
|
|
68
68
|
cases: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
|
|
69
69
|
rules: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
70
|
-
container: PropTypes.Requireable<string>;
|
|
71
70
|
field: PropTypes.Validator<string>;
|
|
72
71
|
regexp: PropTypes.Requireable<string>;
|
|
73
72
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
74
73
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
74
|
+
prop: PropTypes.Requireable<string>;
|
|
75
75
|
complement: PropTypes.Requireable<boolean>;
|
|
76
76
|
}> | PropTypes.InferProps<{
|
|
77
77
|
rule: PropTypes.Requireable<string>;
|
|
78
78
|
complement: PropTypes.Requireable<boolean>;
|
|
79
79
|
}> | null | undefined> | (NonNullable<string | PropTypes.InferProps<{
|
|
80
|
-
container: PropTypes.Requireable<string>;
|
|
81
80
|
field: PropTypes.Validator<string>;
|
|
82
81
|
regexp: PropTypes.Requireable<string>;
|
|
83
82
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
84
83
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
84
|
+
prop: PropTypes.Requireable<string>;
|
|
85
85
|
complement: PropTypes.Requireable<boolean>;
|
|
86
86
|
}> | PropTypes.InferProps<{
|
|
87
87
|
rule: PropTypes.Requireable<string>;
|
|
@@ -96,21 +96,21 @@ export default class ConditionalUiSchemaField extends React.Component<any, any,
|
|
|
96
96
|
}> | null | undefined)[] | null | undefined>>;
|
|
97
97
|
}> | (PropTypes.InferProps<{
|
|
98
98
|
rules: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
99
|
-
container: PropTypes.Requireable<string>;
|
|
100
99
|
field: PropTypes.Validator<string>;
|
|
101
100
|
regexp: PropTypes.Requireable<string>;
|
|
102
101
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
103
102
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
103
|
+
prop: PropTypes.Requireable<string>;
|
|
104
104
|
complement: PropTypes.Requireable<boolean>;
|
|
105
105
|
}> | PropTypes.InferProps<{
|
|
106
106
|
rule: PropTypes.Requireable<string>;
|
|
107
107
|
complement: PropTypes.Requireable<boolean>;
|
|
108
108
|
}> | null | undefined> | (NonNullable<string | PropTypes.InferProps<{
|
|
109
|
-
container: PropTypes.Requireable<string>;
|
|
110
109
|
field: PropTypes.Validator<string>;
|
|
111
110
|
regexp: PropTypes.Requireable<string>;
|
|
112
111
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
113
112
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
113
|
+
prop: PropTypes.Requireable<string>;
|
|
114
114
|
complement: PropTypes.Requireable<boolean>;
|
|
115
115
|
}> | PropTypes.InferProps<{
|
|
116
116
|
rule: PropTypes.Requireable<string>;
|
|
@@ -50,11 +50,11 @@ const deepmerge_1 = __importDefault(require("deepmerge"));
|
|
|
50
50
|
const utils_1 = require("../../utils");
|
|
51
51
|
exports.rulePropType = PropTypes.oneOfType([
|
|
52
52
|
PropTypes.shape({
|
|
53
|
-
container: PropTypes.string,
|
|
54
53
|
field: PropTypes.string.isRequired,
|
|
55
54
|
regexp: PropTypes.string,
|
|
56
55
|
valueIn: PropTypes.arrayOf(PropTypes.string),
|
|
57
56
|
valueLengthLessThan: PropTypes.number,
|
|
57
|
+
prop: PropTypes.string,
|
|
58
58
|
complement: PropTypes.bool
|
|
59
59
|
}),
|
|
60
60
|
PropTypes.shape({
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export const arrayRulesPropType: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
2
|
-
container: PropTypes.Requireable<string>;
|
|
3
2
|
field: PropTypes.Validator<string>;
|
|
4
3
|
regexp: PropTypes.Requireable<string>;
|
|
5
4
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
6
5
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
6
|
+
prop: PropTypes.Requireable<string>;
|
|
7
7
|
complement: PropTypes.Requireable<boolean>;
|
|
8
8
|
}> | PropTypes.InferProps<{
|
|
9
9
|
rule: PropTypes.Requireable<string>;
|
|
@@ -13,11 +13,11 @@ export const arrayRulesPropType: PropTypes.Requireable<NonNullable<NonNullable<s
|
|
|
13
13
|
isLast: PropTypes.Requireable<number>;
|
|
14
14
|
complement: PropTypes.Requireable<boolean>;
|
|
15
15
|
}> | (NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
16
|
-
container: PropTypes.Requireable<string>;
|
|
17
16
|
field: PropTypes.Validator<string>;
|
|
18
17
|
regexp: PropTypes.Requireable<string>;
|
|
19
18
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
20
19
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
20
|
+
prop: PropTypes.Requireable<string>;
|
|
21
21
|
complement: PropTypes.Requireable<boolean>;
|
|
22
22
|
}> | PropTypes.InferProps<{
|
|
23
23
|
rule: PropTypes.Requireable<string>;
|
|
@@ -32,11 +32,11 @@ export default class FilterArrayField extends React.Component<any, any, any> {
|
|
|
32
32
|
uiSchema: PropTypes.Requireable<PropTypes.InferProps<{
|
|
33
33
|
"ui:options": PropTypes.Requireable<PropTypes.InferProps<{
|
|
34
34
|
rules: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
35
|
-
container: PropTypes.Requireable<string>;
|
|
36
35
|
field: PropTypes.Validator<string>;
|
|
37
36
|
regexp: PropTypes.Requireable<string>;
|
|
38
37
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
39
38
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
39
|
+
prop: PropTypes.Requireable<string>;
|
|
40
40
|
complement: PropTypes.Requireable<boolean>;
|
|
41
41
|
}> | PropTypes.InferProps<{
|
|
42
42
|
rule: PropTypes.Requireable<string>;
|
|
@@ -46,11 +46,11 @@ export default class FilterArrayField extends React.Component<any, any, any> {
|
|
|
46
46
|
isLast: PropTypes.Requireable<number>;
|
|
47
47
|
complement: PropTypes.Requireable<boolean>;
|
|
48
48
|
}> | (NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
49
|
-
container: PropTypes.Requireable<string>;
|
|
50
49
|
field: PropTypes.Validator<string>;
|
|
51
50
|
regexp: PropTypes.Requireable<string>;
|
|
52
51
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
53
52
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
53
|
+
prop: PropTypes.Requireable<string>;
|
|
54
54
|
complement: PropTypes.Requireable<boolean>;
|
|
55
55
|
}> | PropTypes.InferProps<{
|
|
56
56
|
rule: PropTypes.Requireable<string>;
|
|
@@ -144,6 +144,8 @@ export declare function MediaArrayField<LFC extends Constructor<React.Component<
|
|
|
144
144
|
sideEffects: PropTypes.Requireable<object>;
|
|
145
145
|
exifParsers: PropTypes.Requireable<(object | null | undefined)[]>;
|
|
146
146
|
metadataFormId: PropTypes.Requireable<string>;
|
|
147
|
+
hideDeleteButton: PropTypes.Requireable<boolean>;
|
|
148
|
+
deleteConfirmPlacement: PropTypes.Requireable<string>;
|
|
147
149
|
}>>;
|
|
148
150
|
}>>;
|
|
149
151
|
schema: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
|
|
@@ -146,10 +146,10 @@ function MediaArrayField(ComposedComponent) {
|
|
|
146
146
|
});
|
|
147
147
|
this.renderMedias = () => {
|
|
148
148
|
const { disabled, readonly } = this.props;
|
|
149
|
-
const { deleteConfirmPlacement = "top" } = (0, utils_1.getUiOptions)(this.props.uiSchema);
|
|
149
|
+
const { hideDeleteButton = false, deleteConfirmPlacement = "top" } = (0, utils_1.getUiOptions)(this.props.uiSchema);
|
|
150
150
|
return (this.props.formData || []).map((item, i) => (React.createElement("div", { key: i, className: "media-container" },
|
|
151
151
|
React.createElement("div", { className: "media-container-link", onClick: this.onMediaClick(i) }, this.renderMedia(item, i)),
|
|
152
|
-
React.createElement(components_1.DeleteButton, { corner: true, confirm: true, confirmPlacement: deleteConfirmPlacement, translations: this.props.formContext.translations, onClick: this.onMediaRmClick(i), disabled: disabled || readonly, id: `${this.props.idSchema.$id}_${i}` }))));
|
|
152
|
+
!hideDeleteButton && React.createElement(components_1.DeleteButton, { corner: true, confirm: true, confirmPlacement: deleteConfirmPlacement, translations: this.props.formContext.translations, onClick: this.onMediaRmClick(i), disabled: disabled || readonly, id: `${this.props.idSchema.$id}_${i}` }))));
|
|
153
153
|
};
|
|
154
154
|
this.renderLoadingMedias = () => {
|
|
155
155
|
const containerId = this.getContainerId();
|
|
@@ -663,7 +663,9 @@ function MediaArrayField(ComposedComponent) {
|
|
|
663
663
|
autoOpenMetadataModal: PropTypes.bool,
|
|
664
664
|
sideEffects: PropTypes.object,
|
|
665
665
|
exifParsers: PropTypes.arrayOf(PropTypes.object),
|
|
666
|
-
metadataFormId: PropTypes.string
|
|
666
|
+
metadataFormId: PropTypes.string,
|
|
667
|
+
hideDeleteButton: PropTypes.bool,
|
|
668
|
+
deleteConfirmPlacement: PropTypes.string
|
|
667
669
|
})
|
|
668
670
|
}),
|
|
669
671
|
schema: PropTypes.shape({
|
|
@@ -3,11 +3,11 @@ export default class MultiArrayField extends React.Component<any, any, any> {
|
|
|
3
3
|
uiSchema: PropTypes.Requireable<PropTypes.InferProps<{
|
|
4
4
|
"ui:options": PropTypes.Requireable<PropTypes.InferProps<{
|
|
5
5
|
rules: PropTypes.Requireable<NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
6
|
-
container: PropTypes.Requireable<string>;
|
|
7
6
|
field: PropTypes.Validator<string>;
|
|
8
7
|
regexp: PropTypes.Requireable<string>;
|
|
9
8
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
10
9
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
10
|
+
prop: PropTypes.Requireable<string>;
|
|
11
11
|
complement: PropTypes.Requireable<boolean>;
|
|
12
12
|
}> | PropTypes.InferProps<{
|
|
13
13
|
rule: PropTypes.Requireable<string>;
|
|
@@ -17,11 +17,11 @@ export default class MultiArrayField extends React.Component<any, any, any> {
|
|
|
17
17
|
isLast: PropTypes.Requireable<number>;
|
|
18
18
|
complement: PropTypes.Requireable<boolean>;
|
|
19
19
|
}> | (NonNullable<NonNullable<string | PropTypes.InferProps<{
|
|
20
|
-
container: PropTypes.Requireable<string>;
|
|
21
20
|
field: PropTypes.Validator<string>;
|
|
22
21
|
regexp: PropTypes.Requireable<string>;
|
|
23
22
|
valueIn: PropTypes.Requireable<(string | null | undefined)[]>;
|
|
24
23
|
valueLengthLessThan: PropTypes.Requireable<number>;
|
|
24
|
+
prop: PropTypes.Requireable<string>;
|
|
25
25
|
complement: PropTypes.Requireable<boolean>;
|
|
26
26
|
}> | PropTypes.InferProps<{
|
|
27
27
|
rule: PropTypes.Requireable<string>;
|
|
@@ -9,9 +9,12 @@ export default class InputWithDefaultValueButtonWidget extends React.Component<a
|
|
|
9
9
|
apiQueryForDefaultValue: PropTypes.Requireable<PropTypes.InferProps<{
|
|
10
10
|
path: PropTypes.Validator<string>;
|
|
11
11
|
query: PropTypes.Requireable<object>;
|
|
12
|
-
resultKey: PropTypes.
|
|
12
|
+
resultKey: PropTypes.Requireable<string>;
|
|
13
13
|
cache: PropTypes.Requireable<boolean>;
|
|
14
14
|
}>>;
|
|
15
|
+
disableButtonAfterUse: PropTypes.Requireable<boolean>;
|
|
16
|
+
confirmClick: PropTypes.Requireable<boolean>;
|
|
17
|
+
confirmMessage: PropTypes.Requireable<string>;
|
|
15
18
|
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
16
19
|
}>>>;
|
|
17
20
|
}>>>;
|
|
@@ -21,11 +24,15 @@ export default class InputWithDefaultValueButtonWidget extends React.Component<a
|
|
|
21
24
|
value: PropTypes.Requireable<string>;
|
|
22
25
|
};
|
|
23
26
|
constructor(props: any);
|
|
27
|
+
fetching: boolean;
|
|
28
|
+
disabled: boolean;
|
|
24
29
|
state: {
|
|
25
30
|
fetching: boolean;
|
|
31
|
+
disabled: boolean;
|
|
26
32
|
};
|
|
27
33
|
render(): JSX.Element;
|
|
28
34
|
onClick: () => any;
|
|
35
|
+
changeValue: (value: any) => void;
|
|
29
36
|
}
|
|
30
37
|
import * as React from "react";
|
|
31
38
|
import * as PropTypes from "prop-types";
|
|
@@ -41,26 +41,33 @@ const PropTypes = __importStar(require("prop-types"));
|
|
|
41
41
|
const BaseInputTemplate_1 = __importDefault(require("../templates/BaseInputTemplate"));
|
|
42
42
|
const ReactContext_1 = __importDefault(require("../../ReactContext"));
|
|
43
43
|
const utils_1 = require("../../utils");
|
|
44
|
+
const react_spinner_1 = __importDefault(require("react-spinner"));
|
|
45
|
+
const ConfirmButton_1 = require("../components/ConfirmButton");
|
|
44
46
|
class InputWithDefaultValueButtonWidget extends React.Component {
|
|
45
47
|
constructor(props) {
|
|
46
48
|
super(props);
|
|
47
49
|
this.onClick = () => {
|
|
50
|
+
var _a;
|
|
51
|
+
if (this.fetching || this.disabled) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
48
54
|
const { contextFieldForDefaultValue, apiQueryForDefaultValue, onClick } = (0, utils_1.getUiOptions)(this.props);
|
|
49
55
|
if (contextFieldForDefaultValue) {
|
|
50
56
|
const uiSchemaContext = this.props.formContext.uiSchemaContext || {};
|
|
51
57
|
const defaultValue = uiSchemaContext[contextFieldForDefaultValue];
|
|
52
|
-
this.
|
|
58
|
+
this.changeValue(defaultValue);
|
|
53
59
|
}
|
|
54
60
|
else if (apiQueryForDefaultValue) {
|
|
55
61
|
const { path, query = {}, resultKey, cache = false } = apiQueryForDefaultValue;
|
|
56
62
|
const apiClient = this.props.formContext.apiClient;
|
|
63
|
+
this.fetching = true;
|
|
57
64
|
this.setState({ fetching: true });
|
|
58
|
-
return apiClient.get(path, { query }, cache).then(result => {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}
|
|
62
|
-
this.setState({ fetching: false });
|
|
65
|
+
return apiClient.get(path, { query: Object.assign({ value: (_a = this.props.value) !== null && _a !== void 0 ? _a : "" }, query) }, cache).then(result => {
|
|
66
|
+
result = resultKey ? result === null || result === void 0 ? void 0 : result[resultKey] : result;
|
|
67
|
+
this.changeValue(result);
|
|
63
68
|
}).catch(() => {
|
|
69
|
+
}).finally(() => {
|
|
70
|
+
this.fetching = false;
|
|
64
71
|
this.setState({ fetching: false });
|
|
65
72
|
});
|
|
66
73
|
}
|
|
@@ -68,16 +75,29 @@ class InputWithDefaultValueButtonWidget extends React.Component {
|
|
|
68
75
|
onClick();
|
|
69
76
|
}
|
|
70
77
|
};
|
|
71
|
-
this.
|
|
78
|
+
this.changeValue = (value) => {
|
|
79
|
+
const { disableButtonAfterUse = false } = (0, utils_1.getUiOptions)(this.props);
|
|
80
|
+
this.props.onChange(value);
|
|
81
|
+
if (disableButtonAfterUse) {
|
|
82
|
+
this.disabled = true;
|
|
83
|
+
this.setState({ disabled: true });
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
this.fetching = false;
|
|
87
|
+
this.disabled = false;
|
|
88
|
+
this.state = { fetching: false, disabled: false };
|
|
72
89
|
}
|
|
73
90
|
render() {
|
|
74
|
-
const { InputGroup
|
|
75
|
-
const { buttonLabel, buttonVariant } = (0, utils_1.getUiOptions)(this.props);
|
|
76
|
-
const { disabled, readonly } = this.props;
|
|
91
|
+
const { InputGroup } = this.context.theme;
|
|
92
|
+
const { buttonLabel, buttonVariant, confirmClick, confirmMessage } = (0, utils_1.getUiOptions)(this.props);
|
|
93
|
+
const { disabled, readonly, id } = this.props;
|
|
94
|
+
const { translations } = this.props.formContext;
|
|
77
95
|
return (React.createElement(InputGroup, null,
|
|
78
96
|
React.createElement(BaseInputTemplate_1.default, Object.assign({}, this.props)),
|
|
79
97
|
React.createElement(InputGroup.Button, { className: "input-group-button" },
|
|
80
|
-
React.createElement(
|
|
98
|
+
React.createElement(ConfirmButton_1.ConfirmButton, { id: `${id}-default-value-button`, translations: translations, confirm: confirmClick, onClick: this.onClick, disabled: disabled || readonly || this.state.fetching || this.state.disabled, variant: buttonVariant, prompt: confirmMessage },
|
|
99
|
+
this.state.fetching && React.createElement(react_spinner_1.default, null),
|
|
100
|
+
buttonLabel))));
|
|
81
101
|
}
|
|
82
102
|
}
|
|
83
103
|
InputWithDefaultValueButtonWidget.contextType = ReactContext_1.default;
|
|
@@ -90,9 +110,12 @@ InputWithDefaultValueButtonWidget.propTypes = {
|
|
|
90
110
|
apiQueryForDefaultValue: PropTypes.shape({
|
|
91
111
|
path: PropTypes.string.isRequired,
|
|
92
112
|
query: PropTypes.object,
|
|
93
|
-
resultKey: PropTypes.string
|
|
113
|
+
resultKey: PropTypes.string,
|
|
94
114
|
cache: PropTypes.bool
|
|
95
115
|
}),
|
|
116
|
+
disableButtonAfterUse: PropTypes.bool,
|
|
117
|
+
confirmClick: PropTypes.bool,
|
|
118
|
+
confirmMessage: PropTypes.string,
|
|
96
119
|
onClick: PropTypes.func
|
|
97
120
|
}).isRequired
|
|
98
121
|
}).isRequired,
|
package/lib/utils.js
CHANGED
|
@@ -827,7 +827,7 @@ function checkRules(rules, props, cache, prop = "formData") {
|
|
|
827
827
|
const passes = (Array.isArray(rules) ? rules : [rules]).every((rule, idx) => {
|
|
828
828
|
let passes;
|
|
829
829
|
// BW compatibility for old string rule
|
|
830
|
-
if (["isAdmin", "isEdit", "isReadonly"].includes(rule)) {
|
|
830
|
+
if (["isAdmin", "isLoggedIn", "isEdit", "isReadonly"].includes(rule)) {
|
|
831
831
|
rule = { rule };
|
|
832
832
|
}
|
|
833
833
|
const { field, regexp, valueIn, valueIncludes, valueLengthLessThan, rule: _rule } = rule;
|
|
@@ -846,7 +846,7 @@ function checkRules(rules, props, cache, prop = "formData") {
|
|
|
846
846
|
}
|
|
847
847
|
}
|
|
848
848
|
else {
|
|
849
|
-
let value = parseJSONPointer(props[prop] || {}, field);
|
|
849
|
+
let value = parseJSONPointer(props[rule.prop || prop] || {}, field);
|
|
850
850
|
if (value === undefined)
|
|
851
851
|
value = "";
|
|
852
852
|
if (regexp) {
|