@momentum-ui/react-collaboration
Version:
Cisco Momentum UI Framework for React Collaboration Applications
83 lines • 4.21 kB
JavaScript
/** @component checkbox */
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);
};
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;
};
import PropTypes from 'prop-types';
import React from 'react';
import Label from '../Label';
/**
* @deprecated - Components in the legacy folder (/src/legacy) are deprecated. Please use a component from the components folder (/src/components) instead. Legacy components may not follow accessibility standards.
**/
var Checkbox = function (props) {
var checked = props.checked, children = props.children, className = props.className, disabled = props.disabled, htmlId = props.htmlId, indeterminate = props.indeterminate, inputRef = props.inputRef, label = props.label, name = props.name, nestedLevel = props.nestedLevel, onChange = props.onChange, required = props.required, value = props.value, otherProps = __rest(props, ["checked", "children", "className", "disabled", "htmlId", "indeterminate", "inputRef", "label", "name", "nestedLevel", "onChange", "required", "value"]);
return (React.createElement("div", { className: 'md-input-container md-checkbox' +
"".concat((nestedLevel && " md-input--nested-".concat(nestedLevel)) || '') +
" ".concat(className) },
React.createElement("input", __assign({ "aria-checked": checked, className: "md-input md-checkbox__input" + "".concat((indeterminate && ' indeterminate') || ''), type: "checkbox", ref: inputRef, disabled: disabled, checked: checked, required: required, name: name, value: value, onChange: onChange, tabIndex: 0, id: htmlId }, otherProps)),
React.createElement(Label, { className: "md-checkbox__label", label: label, htmlFor: htmlId }),
children));
};
Checkbox.propTypes = {
/** @prop Sets Checkbox status as checked | false */
checked: PropTypes.bool,
/** @prop Child component to display next to the input | null */
children: PropTypes.node,
/** @prop Optional css class string | '' */
className: PropTypes.string,
/** @prop Sets the attribute disabled to the Checkbox | false */
disabled: PropTypes.bool,
/** @prop Unique HTML ID. Used for tying label to HTML input. Handy hook for automated testing */
htmlId: PropTypes.string.isRequired,
/** @prop Optional indeterminate capabilities of checkbox | false */
indeterminate: PropTypes.bool,
/** @prop optional ref attribute for Checkbox input element | null */
inputRef: PropTypes.func,
/** @prop Required label string for Checkbox */
label: PropTypes.string.isRequired,
/** @prop Sets the attribute name to the Checkbox input element | '' */
name: PropTypes.string,
/** @prop Set the level of nested checkboxes | 0 */
nestedLevel: PropTypes.number,
/** @prop Optional onChange handler invoked when user makes a change within the Checkbox input element | null */
onChange: PropTypes.func,
/** @prop Optional required setting for Checkbox input | false */
required: PropTypes.bool,
/** @prop sets value of the Checkbox input element | '' */
value: PropTypes.string,
};
Checkbox.defaultProps = {
autoFocus: false,
checked: false,
className: '',
disabled: false,
indeterminate: false,
inputRef: null,
label: '',
name: '',
nestedLevel: 0,
onChange: function () { },
required: false,
value: '',
};
Checkbox.displayName = 'Checkbox';
export default Checkbox;
//# sourceMappingURL=index.js.map