@wix/design-system/dist/cjs/Radio/Radio.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _RadioSt = require("./Radio.st.css.js");
var _Text = _interopRequireDefault(require("../Text"));
var _generateDataAttr = require("../utils/generateDataAttr");
var _Radio = require("./Radio.constants");
var _Focusable = require("../common/Focusable");
var _Radio2 = _interopRequireDefault(require("./Radio.semanticClassNames"));
var _utils = require("../providers/useCollapse/utils");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Radio/Radio.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Radio = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
  var {
    dataHook,
    checked = false,
    disabled = false,
    label,
    id,
    name,
    value,
    focusableOnFocus,
    focusableOnBlur,
    onChange = () => null,
    onMouseEnter = () => null,
    onMouseLeave = () => null,
    alignItems = 'center',
    className,
    style,
    size = 'medium'
  } = _ref;
  var radioId = (0, _utils.useUniqueId)(id);
  var _onClick = event => {
    if (!disabled && !checked) {
      onChange(_objectSpread({
        value
      }, event));
    }
  };
  var _onMouseEnter = event => {
    if (!disabled) {
      onMouseEnter(event);
    }
  };
  var _onMouseLeave = event => {
    if (!disabled) {
      onMouseLeave(event);
    }
  };
  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
    className: (0, _RadioSt.st)(_RadioSt.classes.root, {
      checked,
      disabled,
      alignItems,
      size
    }, className)
  }, (0, _generateDataAttr.generateDataAttr)({
    checked,
    disabled
  }, ['checked', 'disabled']), {
    style: style,
    "data-hook": dataHook,
    onClick: _onClick,
    onMouseEnter: _onMouseEnter,
    onMouseLeave: _onMouseLeave,
    "aria-checked": !!checked,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 56,
      columnNumber: 7
    }
  }), /*#__PURE__*/_react.default.createElement("input", {
    type: "radio",
    className: _RadioSt.classes.input,
    "data-hook": _Radio.dataHooks.input,
    disabled: disabled,
    checked: checked,
    value: value,
    name: name,
    id: radioId,
    onChange: () => null,
    onFocus: focusableOnFocus,
    onBlur: focusableOnBlur,
    ref: ref,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 75,
      columnNumber: 9
    }
  }), /*#__PURE__*/_react.default.createElement("span", {
    className: (0, _RadioSt.st)(_RadioSt.classes.icon, _Radio2.default.icon),
    "data-hook": _Radio.dataHooks.icon,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 89,
      columnNumber: 9
    }
  }), label && /*#__PURE__*/_react.default.createElement("label", {
    className: _RadioSt.classes.label,
    "data-hook": _Radio.dataHooks.label,
    htmlFor: radioId,
    onClick: e => e.stopPropagation(),
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 94,
      columnNumber: 11
    }
  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
    className: _RadioSt.classes.labelText,
    tagName: "div",
    size: size,
    weight: "thin",
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 100,
      columnNumber: 13
    }
  }, label)));
});
Radio.displayName = 'Radio';
Radio.propTypes = {
  dataHook: _propTypes.default.string,
  className: _propTypes.default.string,
  checked: _propTypes.default.bool,
  disabled: _propTypes.default.bool,
  label: _propTypes.default.any,
  name: _propTypes.default.string,
  id: _propTypes.default.string,
  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  onChange: _propTypes.default.func,
  onMouseEnter: _propTypes.default.func,
  onMouseLeave: _propTypes.default.func,
  alignItems: _propTypes.default.oneOf(['top', 'center']),
  size: _propTypes.default.oneOf(['small', 'medium'])
};
var _default = exports.default = (0, _Focusable.withFocusable)(Radio);
//# sourceMappingURL=Radio.js.map