fx-form-widget
Version:
72 lines (71 loc) • 3.23 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _input = _interopRequireDefault(require("antd/lib/input"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _popover = _interopRequireDefault(require("antd/lib/popover"));
var React = _interopRequireWildcard(require("react"));
var _reactColor = require("react-color");
require("rc-color-picker/assets/index.css");
require("./index.less");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
var Color = function Color(p) {
var _p$schema = p.schema,
readonly = _p$schema.readonly,
allowClear = _p$schema.allowClear;
var value = p.value || p.schema.data || '';
var options = {
allowClear: allowClear,
disabled: readonly
};
var onPickerChange = function onPickerChange(e) {
if (readonly) return;
p.onChange(e.hex);
};
var onInputChange = function onInputChange(e) {
return p.onChange(e.target.value);
};
var PickerSwatchWrap = function PickerSwatchWrap(_ref) {
var value = _ref.value,
readonly = _ref.readonly;
return /*#__PURE__*/React.createElement("div", {
className: "color_picker_swatch"
}, /*#__PURE__*/React.createElement("div", {
style: {
width: '40px',
height: '24px',
borderRadius: '2px',
background: value,
cursor: readonly ? 'auto' : 'pointer'
}
}));
};
return /*#__PURE__*/React.createElement("div", {
className: "color_picker"
}, readonly ? /*#__PURE__*/React.createElement(PickerSwatchWrap, {
value: value,
readonly: readonly
}) : /*#__PURE__*/React.createElement(_popover["default"], {
content: function content() {
return /*#__PURE__*/React.createElement(_reactColor.ChromePicker, {
color: value ? value : '#ffffff',
onChange: onPickerChange
});
},
trigger: "click"
}, /*#__PURE__*/React.createElement("div", {
style: {
display: 'inherit'
}
}, /*#__PURE__*/React.createElement(PickerSwatchWrap, {
value: value,
readonly: readonly
}))), readonly ? /*#__PURE__*/React.createElement("span", null, value || '#ffffff') : /*#__PURE__*/React.createElement(_input["default"], (0, _extends2["default"])({}, options, {
placeholder: "#ffffff",
value: value,
onChange: onInputChange
})));
};
var _default = exports["default"] = Color;