@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
75 lines • 4.06 kB
JavaScript
;
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.TextField = void 0;
const react_1 = __importDefault(require("react"));
const core_1 = require("@blueprintjs/core");
const Intent_1 = require("../../common/Intent");
const constants_1 = require("../../configuration/constants");
const Icon_1 = __importDefault(require("../Icon/Icon"));
const useTextValidation_1 = require("./useTextValidation");
/**
* Text input field.
*/
const TextField = (_a) => {
var { className = "", fullWidth = true, leftIcon, invisibleCharacterWarning, escapeToBlur = false, intent } = _a, otherBlueprintInputGroupProps = __rest(_a, ["className", "fullWidth", "leftIcon", "invisibleCharacterWarning", "escapeToBlur", "intent"]);
const inputRef = react_1.default.useRef(null);
const handleLabelEscape = react_1.default.useCallback(() => {
var _a;
(_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur();
if (otherBlueprintInputGroupProps.inputRef) {
const otherInputRef = otherBlueprintInputGroupProps.inputRef;
if (otherInputRef.current) {
otherInputRef.current.blur();
}
}
}, []);
const onKeyDown = react_1.default.useCallback((event) => {
var _a;
if (escapeToBlur && event.key === "Escape") {
event.preventDefault();
handleLabelEscape();
return false;
}
return (_a = otherBlueprintInputGroupProps.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(otherBlueprintInputGroupProps, event);
}, [otherBlueprintInputGroupProps.onKeyDown, escapeToBlur]);
let iconIntent;
switch (intent) {
case "edited":
iconIntent = Intent_1.Definitions.INFO;
break;
case "removed":
iconIntent = Intent_1.Definitions.DANGER;
break;
default:
iconIntent = intent;
break;
}
const maybeWrappedOnChange = (0, useTextValidation_1.useTextValidation)(Object.assign(Object.assign({}, otherBlueprintInputGroupProps), { invisibleCharacterWarning }));
if ((otherBlueprintInputGroupProps.readOnly || otherBlueprintInputGroupProps.disabled) &&
!!otherBlueprintInputGroupProps.value &&
!otherBlueprintInputGroupProps.title) {
otherBlueprintInputGroupProps["title"] = otherBlueprintInputGroupProps.value;
}
return (react_1.default.createElement(core_1.InputGroup, Object.assign({ inputRef: inputRef, className: `${constants_1.CLASSPREFIX}-textfield` +
(intent ? ` ${constants_1.CLASSPREFIX}-intent--${intent}` : "") +
(className ? ` ${className}` : ""), intent: intent && !["info", "edited", "removed", "neutral"].includes(intent)
? intent
: undefined, fill: fullWidth }, otherBlueprintInputGroupProps, { leftElement: leftIcon != null && leftIcon !== false ? (typeof leftIcon === "string" ? (react_1.default.createElement(Icon_1.default, { name: leftIcon, className: core_1.Classes.ICON, intent: iconIntent })) : (react_1.default.createElement("span", { className: core_1.Classes.ICON }, leftIcon))) : undefined, dir: "auto", onChange: maybeWrappedOnChange, onKeyDown: otherBlueprintInputGroupProps.onKeyDown || escapeToBlur ? onKeyDown : undefined })));
};
exports.TextField = TextField;
exports.default = exports.TextField;
//# sourceMappingURL=TextField.js.map