@quintoandar-tokko/radio 1.2.317

package/lib/index.js

@@ -0,0 +1,157 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Radio = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _react = _interopRequireDefault(require("react"));
+var _box = require("@quintoandar-tokko/box");
+var _icons = require("@quintoandar-tokko/icons");
+var _excluded = ["borderColor", "backgroundColor", "tick", "tickColor", "isMedium"],
+  _excluded2 = ["isMedium"],
+  _excluded3 = ["isMedium"],
+  _excluded4 = ["isMedium"],
+  _excluded5 = ["isMedium"],
+  _excluded6 = ["isMedium", "sx", "variant"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
+var RadioBox = function RadioBox(_ref) {
+  var borderColor = _ref.borderColor,
+    backgroundColor = _ref.backgroundColor,
+    tick = _ref.tick,
+    tickColor = _ref.tickColor,
+    isMedium = _ref.isMedium,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_icons.Svg, _extends({
+    width: isMedium ? 20 : 16,
+    height: isMedium ? 20 : 16,
+    viewBox: isMedium ? '0 0 20 20' : '0 0 16 16',
+    fill: "none"
+  }, props), /*#__PURE__*/_react["default"].createElement("circle", {
+    cx: isMedium ? 10 : 8,
+    cy: isMedium ? 10 : 8,
+    r: isMedium ? 10 : 8,
+    fill: backgroundColor
+  }), /*#__PURE__*/_react["default"].createElement("circle", {
+    cx: isMedium ? 10 : 8,
+    cy: isMedium ? 10 : 8,
+    r: isMedium ? 9.5 : 7.5,
+    stroke: borderColor
+  }), tick && /*#__PURE__*/_react["default"].createElement("circle", {
+    cx: isMedium ? 10 : 8,
+    cy: isMedium ? 10 : 8,
+    r: isMedium ? 5 : 4,
+    fill: tickColor
+  })));
+};
+var RadioChecked = function RadioChecked(_ref2) {
+  var isMedium = _ref2.isMedium,
+    props = _objectWithoutProperties(_ref2, _excluded2);
+  return /*#__PURE__*/_react["default"].createElement(RadioBox, _extends({
+    borderColor: "#6A88F2",
+    backgroundColor: "#6A88F2",
+    tick: true,
+    tickColor: "white",
+    isMedium: isMedium
+  }, props));
+};
+var _StyledRadioChecked = (0, _styledComponents["default"])(RadioChecked)({
+  display: 'none',
+  'input:checked:not(:disabled) ~ &': {
+    display: 'block'
+  }
+});
+var RadioUnchecked = function RadioUnchecked(_ref3) {
+  var isMedium = _ref3.isMedium,
+    props = _objectWithoutProperties(_ref3, _excluded3);
+  return /*#__PURE__*/_react["default"].createElement(RadioBox, _extends({
+    borderColor: "#D4DBDE",
+    backgroundColor: "white",
+    tick: true,
+    tickColor: "white",
+    isMedium: isMedium
+  }, props));
+};
+var _StyledRadioUnchecked = (0, _styledComponents["default"])(RadioUnchecked)({
+  display: 'none',
+  'input:not(:checked):not(:disabled) ~ &': {
+    display: 'block'
+  }
+});
+var RadioDisabled = function RadioDisabled(_ref4) {
+  var isMedium = _ref4.isMedium,
+    props = _objectWithoutProperties(_ref4, _excluded4);
+  return /*#__PURE__*/_react["default"].createElement(RadioBox, _extends({
+    borderColor: "white",
+    backgroundColor: "white",
+    tick: true,
+    tickColor: "#C1CCD0",
+    isMedium: isMedium
+  }, props));
+};
+var _StyledRadioDisabled = (0, _styledComponents["default"])(RadioDisabled).withConfig({
+  componentId: "sc-1gnsfn2-0"
+})({
+  display: 'none',
+  'input:disabled:not(:checked) ~ &': {
+    display: 'block'
+  }
+});
+var RadioIcon = function RadioIcon(_ref5) {
+  var isMedium = _ref5.isMedium,
+    props = _objectWithoutProperties(_ref5, _excluded5);
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_StyledRadioChecked, _extends({
+    isMedium: isMedium
+  }, props)), /*#__PURE__*/_react["default"].createElement(_StyledRadioUnchecked, _extends({
+    isMedium: isMedium
+  }, props)), /*#__PURE__*/_react["default"].createElement(_StyledRadioDisabled, _extends({
+    isMedium: isMedium
+  }, props)));
+};
+var Radio = exports.Radio = function Radio(_ref6) {
+  var _ref6$isMedium = _ref6.isMedium,
+    isMedium = _ref6$isMedium === void 0 ? false : _ref6$isMedium,
+    sx = _ref6.sx,
+    _ref6$variant = _ref6.variant,
+    variant = _ref6$variant === void 0 ? 'radio' : _ref6$variant,
+    props = _objectWithoutProperties(_ref6, _excluded6);
+  return /*#__PURE__*/_react["default"].createElement(_box.Box, {
+    sx: {
+      position: 'relative',
+      width: 18,
+      height: 18
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_box.Box, _extends({
+    as: "input",
+    type: "radio"
+  }, props, {
+    sx: {
+      position: 'absolute',
+      opacity: 0,
+      overflow: 'hidden',
+      width: '100%',
+      height: '100%'
+    }
+  })), /*#__PURE__*/_react["default"].createElement(_box.Box, {
+    as: RadioIcon,
+    "aria-hidden": "true",
+    tx: "forms",
+    variant: variant,
+    isMedium: isMedium,
+    sx: sx,
+    __css: {
+      mr: 2,
+      borderRadius: 'circle',
+      color: 'gray',
+      'input:checked ~ &': {
+        color: 'primary'
+      },
+      'input:focus ~ &': {
+        boxShadow: 'active'
+      }
+    }
+  }));
+};

package/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "@quintoandar-tokko/radio",
+  "version": "1.2.317",
+  "main": "lib/index.js",
+  "module": "src/index.js",
+  "files": [
+    "lib"
+  ],
+  "dependencies": {
+    "@quintoandar-tokko/box": "^1.2.286",
+    "@quintoandar-tokko/icons": "^1.2.317"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "3c5995a3482c9cd1b428a69e135c934c37bce2ae"
+}