react-lightning-design-system/module/scripts/Toggle.js

Salesforce Lightning Design System components built with React

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["id", "className", "label", "required", "error", "cols", "elementRef", "inputRef", "onChange", "onValueChange"];
import React from 'react';
import classnames from 'classnames';
import { FormElement } from './FormElement';
import { useEventCallback } from './hooks';
import { createFC } from './common';

/**
 *
 */

/**
 *
 */
export var Toggle = createFC(function (props) {
  var id = props.id,
    className = props.className,
    label = props.label,
    required = props.required,
    error = props.error,
    cols = props.cols,
    elementRef = props.elementRef,
    inputRef = props.inputRef,
    onChange_ = props.onChange,
    onValueChange = props.onValueChange,
    rprops = _objectWithoutProperties(props, _excluded);
  var onChange = useEventCallback(function (e) {
    onChange_ === null || onChange_ === void 0 || onChange_(e);
    onValueChange === null || onValueChange === void 0 || onValueChange(e.target.checked);
  });
  var toggleClassNames = classnames(className, 'slds-checkbox_toggle slds-grid');
  var toggle = /*#__PURE__*/React.createElement("label", {
    className: toggleClassNames
  }, /*#__PURE__*/React.createElement("input", _extends({
    ref: inputRef,
    id: id,
    type: "checkbox"
  }, rprops, {
    onChange: onChange
  })), /*#__PURE__*/React.createElement("span", {
    className: "slds-checkbox_faux_container"
  }, /*#__PURE__*/React.createElement("span", {
    className: "slds-checkbox_faux"
  }), /*#__PURE__*/React.createElement("span", {
    className: "slds-checkbox_on"
  }, "Enabled"), /*#__PURE__*/React.createElement("span", {
    className: "slds-checkbox_off"
  }, "Disabled")));
  var formElemProps = {
    controlId: id,
    label: label,
    required: required,
    error: error,
    cols: cols,
    elementRef: elementRef
  };
  return /*#__PURE__*/React.createElement(FormElement, formElemProps, toggle);
}, {
  isFormElement: true
});
//# sourceMappingURL=Toggle.js.map