UNPKG

synapse-react-client

Version:

[![Build Status](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client.svg?branch=main)](https://travis-ci.com/Sage-Bionetworks/Synapse-React-Client) [![npm version](https://badge.fury.io/js/synapse-react-client.svg)](https://badge.fury.io/js/synaps

37 lines 1.84 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.Checkbox = void 0; var tslib_1 = require("tslib"); var lodash_es_1 = require("lodash-es"); var react_1 = (0, tslib_1.__importStar)(require("react")); var Checkbox = function (props) { var _a; var _b = props.checked, propsChecked = _b === void 0 ? false : _b, _c = props.isSelectAll, isSelectAll = _c === void 0 ? false : _c, _d = props.disabled, disabled = _d === void 0 ? false : _d; var _e = (0, react_1.useState)(propsChecked), checked = _e[0], setChecked = _e[1]; var uniqueId = (0, react_1.useState)((0, lodash_es_1.uniqueId)('src-checkbox-'))[0]; (0, react_1.useEffect)(function () { setChecked(propsChecked); }, [propsChecked]); var handleCheckboxChange = function (event) { props.onChange(event.target.checked); if (isSelectAll && event.target.checked === false) { /* You can click the all checkbox from off -> on but clicking it off is a no-op */ setChecked(true); } else { setChecked(event.target.checked); } }; var className = 'checkbox'; if (props.className) { className += " " + props.className; } return (react_1.default.createElement("div", { className: className, onClick: props.onClick }, react_1.default.createElement("input", { type: "checkbox", checked: checked, id: uniqueId, onChange: handleCheckboxChange, disabled: disabled, "data-testid": props['data-testid'] }), react_1.default.createElement("label", { htmlFor: uniqueId }, props.label), (_a = props.children) !== null && _a !== void 0 ? _a : react_1.default.createElement(react_1.default.Fragment, null))); }; exports.Checkbox = Checkbox; //# sourceMappingURL=Checkbox.js.map