@qoretechnologies/reqore 0.76.1-pr.674.gf3c4a0c → 0.76.2-pr.671.g420fc83
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelEditor.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/LabelEditor.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LabelEditor.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/LabelEditor.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,mBAAmB,EAAiB,MAAM,WAAW,CAAC;AAC/D,OAAmB,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AACvD,OAAoB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAG1D,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,UAAU,CAAC;IACpF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC5C,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AAED,eAAO,MAAM,WAAW,oGACwC,uBAAuB,6CAgItF,CAAC"}
|
|
@@ -29,6 +29,9 @@ exports.LabelEditor = void 0;
|
|
|
29
29
|
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
30
30
|
var react_1 = require("react");
|
|
31
31
|
var react_use_1 = require("react-use");
|
|
32
|
+
var useReqoreContext_1 = require("../../hooks/useReqoreContext");
|
|
33
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
34
|
+
var ControlGroup_1 = __importDefault(require("../ControlGroup"));
|
|
32
35
|
var Header_1 = require("../Header");
|
|
33
36
|
var Icon_1 = __importDefault(require("../Icon"));
|
|
34
37
|
var Input_1 = __importDefault(require("../Input"));
|
|
@@ -37,20 +40,68 @@ exports.LabelEditor = (0, react_1.memo)(function (_a) {
|
|
|
37
40
|
var label = _a.label, onSubmit = _a.onSubmit, inputProps = _a.inputProps, iconProps = _a.iconProps, effect = _a.effect, rest = __rest(_a, ["label", "onSubmit", "inputProps", "iconProps", "effect"]);
|
|
38
41
|
var _b = (0, react_1.useState)(label), name = _b[0], setName = _b[1];
|
|
39
42
|
var _c = (0, react_1.useState)(false), isEditing = _c[0], setIsEditing = _c[1];
|
|
43
|
+
var isMobile = (0, useReqoreContext_1.useReqoreProperty)('isMobile');
|
|
44
|
+
/* Leaving the editor SUBMITS — by Enter, by blur, by anything. That is the
|
|
45
|
+
rule this component has always had, and cancelling is the one exception
|
|
46
|
+
to it. A ref rather than state because nothing renders from it: it only
|
|
47
|
+
has to survive from the moment the cancel is asked for until the effect
|
|
48
|
+
below reads it, which is the same commit. */
|
|
49
|
+
var submitOnExit = (0, react_1.useRef)(true);
|
|
40
50
|
(0, react_1.useEffect)(function () {
|
|
41
51
|
setName(label);
|
|
42
52
|
}, [label]);
|
|
43
53
|
(0, react_use_1.useUpdateEffect)(function () {
|
|
44
54
|
if (!isEditing) {
|
|
45
|
-
|
|
55
|
+
if (submitOnExit.current) {
|
|
56
|
+
onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(name);
|
|
57
|
+
}
|
|
58
|
+
submitOnExit.current = true;
|
|
46
59
|
}
|
|
47
60
|
}, [isEditing]);
|
|
61
|
+
/** Put the label back as it was and leave the editor without submitting. */
|
|
62
|
+
var cancel = (0, react_1.useCallback)(function () {
|
|
63
|
+
submitOnExit.current = false;
|
|
64
|
+
setName(label);
|
|
65
|
+
setIsEditing(false);
|
|
66
|
+
}, [label]);
|
|
67
|
+
var handleKeyDown = (0, react_1.useCallback)(function (event) {
|
|
68
|
+
if (event.key !== 'Escape') {
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
/* The press stops here. A panel is often inside a modal, and reqore
|
|
72
|
+
closes a modal on Escape from a `keydown` listener on `document` —
|
|
73
|
+
so without this, one press would both abandon the edit and shut the
|
|
74
|
+
dialog around it. React binds below `document`, so stopping the
|
|
75
|
+
synthetic event stops the native one before it gets there. */
|
|
76
|
+
event.preventDefault();
|
|
77
|
+
event.stopPropagation();
|
|
78
|
+
cancel();
|
|
79
|
+
}, [cancel]);
|
|
80
|
+
/* Cancelling by POINTER has to outrun the blur the pointer itself causes:
|
|
81
|
+
pressing the button moves focus off the input, `onBlur` submits, and the
|
|
82
|
+
click that would have cancelled arrives too late to matter. So the
|
|
83
|
+
decision is taken on mousedown — before focus moves — and the default is
|
|
84
|
+
prevented so focus never leaves at all. `onClick` still runs for the
|
|
85
|
+
keyboard, where no blur happens and mousedown never fires. */
|
|
86
|
+
var handleCancelMouseDown = (0, react_1.useCallback)(function (event) {
|
|
87
|
+
event.preventDefault();
|
|
88
|
+
cancel();
|
|
89
|
+
}, [cancel]);
|
|
48
90
|
if (isEditing) {
|
|
49
|
-
|
|
91
|
+
var input = ((0, jsx_runtime_1.jsx)(Input_1.default, __assign({ focusRules: { type: 'auto' }, onClick: function (e) { return e.stopPropagation(); }, value: name, minimal: true, fluid: true, onChange: function (e) { return setName(e.target.value); }, onKeyDown: handleKeyDown, onKeyUp: function (e) {
|
|
50
92
|
if (e.key === 'Enter') {
|
|
51
93
|
setIsEditing(false);
|
|
52
94
|
}
|
|
53
95
|
}, onBlur: function () { return setIsEditing(false); } }, inputProps)));
|
|
96
|
+
/* Escape is the way out on a keyboard, and a phone has no Escape. Without
|
|
97
|
+
a control there, the only exits are Enter and tapping elsewhere, and
|
|
98
|
+
both of those SUBMIT — so an edit begun by accident could not be
|
|
99
|
+
abandoned. The button is the same affordance the key is, for the one
|
|
100
|
+
place the key does not exist. */
|
|
101
|
+
if (!isMobile) {
|
|
102
|
+
return input;
|
|
103
|
+
}
|
|
104
|
+
return ((0, jsx_runtime_1.jsxs)(ControlGroup_1.default, { stack: true, fluid: true, className: 'reqore-label-editor-group', children: [input, (0, jsx_runtime_1.jsx)(Button_1.default, { className: 'reqore-label-editor-cancel', "aria-label": 'Cancel editing', tooltip: 'Cancel editing', icon: 'CloseLine', minimal: true, onMouseDown: handleCancelMouseDown, onClick: cancel })] }));
|
|
54
105
|
}
|
|
55
106
|
return ((0, jsx_runtime_1.jsxs)(Header_1.ReqoreHeading, __assign({}, rest, { className: "".concat(rest.className || '', " reqore-label-editor"), onClick: onSubmit
|
|
56
107
|
? function (e) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelEditor.js","sourceRoot":"","sources":["../../../src/components/Panel/LabelEditor.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"LabelEditor.js","sourceRoot":"","sources":["../../../src/components/Panel/LabelEditor.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAuE;AACvE,uCAA4C;AAC5C,iEAAiE;AACjE,qDAAqC;AACrC,iEAAiD;AACjD,oCAA+D;AAC/D,iDAAuD;AACvD,mDAA0D;AAC1D,gCAAqC;AASxB,QAAA,WAAW,GAAG,IAAA,YAAI,EAC7B,UAAC,EAAoF;IAAlF,IAAA,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAE,UAAU,gBAAA,EAAE,SAAS,eAAA,EAAE,MAAM,YAAA,EAAK,IAAI,cAAzD,0DAA2D,CAAF;IAClD,IAAA,KAAkB,IAAA,gBAAQ,EAAkB,KAAK,CAAC,EAAjD,IAAI,QAAA,EAAE,OAAO,QAAoC,CAAC;IACnD,IAAA,KAA4B,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAC;IAClD,IAAM,QAAQ,GAAG,IAAA,oCAAiB,EAAC,UAAU,CAAC,CAAC;IAE/C;;;;mDAI+C;IAC/C,IAAM,YAAY,GAAG,IAAA,cAAM,EAAC,IAAI,CAAC,CAAC;IAElC,IAAA,iBAAS,EAAC;QACR,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAA,2BAAe,EAAC;QACd,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,IAAI,YAAY,CAAC,OAAO,EAAE,CAAC;gBACzB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,IAAI,CAAC,CAAC;YACnB,CAAC;YAED,YAAY,CAAC,OAAO,GAAG,IAAI,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,4EAA4E;IAC5E,IAAM,MAAM,GAAG,IAAA,mBAAW,EAAC;QACzB,YAAY,CAAC,OAAO,GAAG,KAAK,CAAC;QAC7B,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,YAAY,CAAC,KAAK,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAM,aAAa,GAAG,IAAA,mBAAW,EAC/B,UAAC,KAA4C;QAC3C,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YAC3B,OAAO;QACT,CAAC;QAED;;;;wEAIgE;QAChE,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,MAAM,EAAE,CAAC;IACX,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAC;IAEF;;;;;oEAKgE;IAChE,IAAM,qBAAqB,GAAG,IAAA,mBAAW,EACvC,UAAC,KAA0C;QACzC,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,MAAM,EAAE,CAAC;IACX,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,IAAI,SAAS,EAAE,CAAC;QACd,IAAM,KAAK,GAAG,CACZ,uBAAC,eAAW,aACV,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAC5B,OAAO,EAAE,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,eAAe,EAAE,EAAnB,CAAmB,EACnC,KAAK,EAAE,IAAI,EACX,OAAO,QACP,KAAK,QACL,QAAQ,EAAE,UAAC,CAAM,IAAK,OAAA,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAvB,CAAuB,EAC7C,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,UAAC,CAAC;gBACT,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;oBACtB,YAAY,CAAC,KAAK,CAAC,CAAC;gBACtB,CAAC;YACH,CAAC,EACD,MAAM,EAAE,cAAM,OAAA,YAAY,CAAC,KAAK,CAAC,EAAnB,CAAmB,IAC7B,UAAU,EACd,CACH,CAAC;QAEF;;;;2CAImC;QACnC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO,KAAK,CAAC;QACf,CAAC;QAED,OAAO,CACL,wBAAC,sBAAkB,IAAC,KAAK,QAAC,KAAK,QAAC,SAAS,EAAC,2BAA2B,aAClE,KAAK,EACN,uBAAC,gBAAY,IACX,SAAS,EAAC,4BAA4B,gBAC3B,gBAAgB,EAC3B,OAAO,EAAC,gBAAgB,EACxB,IAAI,EAAC,WAAW,EAChB,OAAO,QACP,WAAW,EAAE,qBAAqB,EAClC,OAAO,EAAE,MAAM,GACf,IACiB,CACtB,CAAC;IACJ,CAAC;IAED,OAAO,CACL,wBAAC,sBAAa,eACR,IAAI,IACR,SAAS,EAAE,UAAG,IAAI,CAAC,SAAS,IAAI,EAAE,yBAAsB,EACxD,OAAO,EACL,QAAQ;YACN,CAAC,CAAC,UAAC,CAAC;gBACA,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,YAAY,CAAC,IAAI,CAAC,CAAC;YACrB,CAAC;YACH,CAAC,CAAC,SAAS,aAGf,uBAAC,iBAAU,IAAC,MAAM,EAAE,MAAM,YAAG,IAAI,GAAc,EAC9C,QAAQ,CAAC,CAAC,CAAC,uBAAC,cAAU,aAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAC,MAAM,IAAK,SAAS,EAAI,CAAC,CAAC,CAAC,IAAI,KAC7E,CACjB,CAAC;AACJ,CAAC,CACF,CAAC"}
|
package/package.json
CHANGED