UNPKG

@gpa-gemstone/react-forms

Version:
67 lines (66 loc) 3.75 kB
"use strict"; // ****************************************************************************************************** // CheckBox.tsx - Gbtc // // Copyright © 2020, Grid Protection Alliance. All Rights Reserved. // // Licensed to the Grid Protection Alliance (GPA) under one or more contributor license agreements. See // the NOTICE file distributed with this work for additional information regarding copyright ownership. // The GPA licenses this file to you under the MIT License (MIT), the "License"; you may not use this // file except in compliance with the License. You may obtain a copy of the License at: // // http://opensource.org/licenses/MIT // // Unless agreed to in writing, the subject software distributed under the License is distributed on an // "AS-IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. Refer to the // License for the specific language governing permissions and limitations. // // Code Modification History: // ---------------------------------------------------------------------------------------------------- // 01/22/2020 - Billy Ernest // Generated original version of source code. // // ****************************************************************************************************** var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = CheckBox; var React = require("react"); var helper_functions_1 = require("@gpa-gemstone/helper-functions"); var ToolTip_1 = require("./ToolTip"); var gpa_symbols_1 = require("@gpa-gemstone/gpa-symbols"); function CheckBox(props) { var _a = React.useState(""), guid = _a[0], setGuid = _a[1]; var _b = React.useState(false), showHelp = _b[0], setShowHelp = _b[1]; // Runs once, setting a unique GUID for each checkbox instance. React.useEffect(function () { setGuid((0, helper_functions_1.CreateGuid)()); }, []); var showLabel = props.Label !== ""; var showHelpIcon = props.Help !== undefined; var label = props.Label === undefined ? props.Field : props.Label; return (React.createElement("div", { className: "form-check" }, React.createElement("input", { type: "checkbox", className: "form-check-input", style: { zIndex: 1 }, onChange: function (evt) { var record = __assign({}, props.Record); record[props.Field] = evt.target.checked; props.Setter(record); }, value: props.Record[props.Field] ? 'on' : 'off', checked: props.Record[props.Field], disabled: props.Disabled == null ? false : props.Disabled }), showHelpIcon || showLabel ? React.createElement("label", { className: "form-check-label d-flex align-items-center" }, React.createElement("span", null, showLabel ? label : ''), showHelpIcon && (React.createElement("span", { className: "ml-2 d-flex align-items-center", onMouseEnter: function () { return setShowHelp(true); }, onMouseLeave: function () { return setShowHelp(false); }, "data-tooltip": guid }, React.createElement(gpa_symbols_1.ReactIcons.QuestionMark, { Color: "var(--info)", Size: 20 })))) : null, showHelpIcon ? React.createElement(ToolTip_1.default, { Show: showHelp, Target: guid, Class: "info", Position: "bottom" }, props.Help) : null)); }