index.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. "use strict";
  2. "use client";
  3. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  4. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.default = void 0;
  9. var _react = _interopRequireWildcard(require("react"));
  10. var _qrcode = require("@rc-component/qrcode");
  11. var _classnames = _interopRequireDefault(require("classnames"));
  12. var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
  13. var _pickAttrs = _interopRequireDefault(require("rc-util/lib/pickAttrs"));
  14. var _warning = require("../_util/warning");
  15. var _configProvider = require("../config-provider");
  16. var _locale = require("../locale");
  17. var _internal = require("../theme/internal");
  18. var _QrcodeStatus = _interopRequireDefault(require("./QrcodeStatus"));
  19. var _index = _interopRequireDefault(require("./style/index"));
  20. var __rest = void 0 && (void 0).__rest || function (s, e) {
  21. var t = {};
  22. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  23. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  24. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  25. }
  26. return t;
  27. };
  28. const QRCode = props => {
  29. var _a, _b, _c, _d;
  30. const [, token] = (0, _internal.useToken)();
  31. const {
  32. value,
  33. type = 'canvas',
  34. icon = '',
  35. size = 160,
  36. iconSize,
  37. color = token.colorText,
  38. errorLevel = 'M',
  39. status = 'active',
  40. bordered = true,
  41. onRefresh,
  42. style,
  43. className,
  44. rootClassName,
  45. prefixCls: customizePrefixCls,
  46. bgColor = 'transparent',
  47. statusRender
  48. } = props,
  49. rest = __rest(props, ["value", "type", "icon", "size", "iconSize", "color", "errorLevel", "status", "bordered", "onRefresh", "style", "className", "rootClassName", "prefixCls", "bgColor", "statusRender"]);
  50. const {
  51. getPrefixCls
  52. } = (0, _react.useContext)(_configProvider.ConfigContext);
  53. const prefixCls = getPrefixCls('qrcode', customizePrefixCls);
  54. const [wrapCSSVar, hashId, cssVarCls] = (0, _index.default)(prefixCls);
  55. const imageSettings = {
  56. src: icon,
  57. x: undefined,
  58. y: undefined,
  59. height: typeof iconSize === 'number' ? iconSize : (_a = iconSize === null || iconSize === void 0 ? void 0 : iconSize.height) !== null && _a !== void 0 ? _a : 40,
  60. width: typeof iconSize === 'number' ? iconSize : (_b = iconSize === null || iconSize === void 0 ? void 0 : iconSize.width) !== null && _b !== void 0 ? _b : 40,
  61. excavate: true,
  62. crossOrigin: 'anonymous'
  63. };
  64. const a11yProps = (0, _pickAttrs.default)(rest, true);
  65. const restProps = (0, _omit.default)(rest, Object.keys(a11yProps));
  66. const qrCodeProps = Object.assign({
  67. value,
  68. size,
  69. level: errorLevel,
  70. bgColor,
  71. fgColor: color,
  72. style: {
  73. width: style === null || style === void 0 ? void 0 : style.width,
  74. height: style === null || style === void 0 ? void 0 : style.height
  75. },
  76. imageSettings: icon ? imageSettings : undefined
  77. }, a11yProps);
  78. const [locale] = (0, _locale.useLocale)('QRCode');
  79. if (process.env.NODE_ENV !== 'production') {
  80. const warning = (0, _warning.devUseWarning)('QRCode');
  81. process.env.NODE_ENV !== "production" ? warning(!!value, 'usage', 'need to receive `value` props') : void 0;
  82. process.env.NODE_ENV !== "production" ? warning(!(icon && errorLevel === 'L'), 'usage', 'ErrorLevel `L` is not recommended to be used with `icon`, for scanning result would be affected by low level.') : void 0;
  83. }
  84. if (!value) {
  85. return null;
  86. }
  87. const mergedCls = (0, _classnames.default)(prefixCls, className, rootClassName, hashId, cssVarCls, {
  88. [`${prefixCls}-borderless`]: !bordered
  89. });
  90. const mergedStyle = Object.assign(Object.assign({
  91. backgroundColor: bgColor
  92. }, style), {
  93. width: (_c = style === null || style === void 0 ? void 0 : style.width) !== null && _c !== void 0 ? _c : size,
  94. height: (_d = style === null || style === void 0 ? void 0 : style.height) !== null && _d !== void 0 ? _d : size
  95. });
  96. return wrapCSSVar(/*#__PURE__*/_react.default.createElement("div", Object.assign({}, restProps, {
  97. className: mergedCls,
  98. style: mergedStyle
  99. }), status !== 'active' && (/*#__PURE__*/_react.default.createElement("div", {
  100. className: `${prefixCls}-mask`
  101. }, /*#__PURE__*/_react.default.createElement(_QrcodeStatus.default, {
  102. prefixCls: prefixCls,
  103. locale: locale,
  104. status: status,
  105. onRefresh: onRefresh,
  106. statusRender: statusRender
  107. }))), type === 'canvas' ? /*#__PURE__*/_react.default.createElement(_qrcode.QRCodeCanvas, Object.assign({}, qrCodeProps)) : /*#__PURE__*/_react.default.createElement(_qrcode.QRCodeSVG, Object.assign({}, qrCodeProps))));
  108. };
  109. if (process.env.NODE_ENV !== 'production') {
  110. QRCode.displayName = 'QRCode';
  111. }
  112. var _default = exports.default = QRCode;