sunmao-sdk/es/component/FormRender/widgets/antd/color.js

榫卯-开箱即用赋能-sdk

import "antd/es/input/style";
import _Input from "antd/es/input";
import React from "react";
import ColorPicker from "rc-color-picker";
import Color from "color";
import "rc-color-picker/assets/index.css";
export default function color(p) {
  var format = p.schema.format;
  var defaultColor = "#ffffff";

  var onPickerChange = function onPickerChange(e) {
    if (p.disabled || p.readOnly) return;
    var color = e.color,
        alpha = e.alpha;

    if (alpha !== 100) {
      color = Color(color).alpha(alpha / 100).string();
    }

    p.onChange(p.name, color);
  };

  var onInputChange = function onInputChange(e) {
    p.onChange(p.name, e.target.value);
  };

  return /*#__PURE__*/React.createElement("div", {
    className: "fr-color-picker"
  }, /*#__PURE__*/React.createElement(ColorPicker, {
    type: format,
    animation: "slide-up",
    color: p.value || defaultColor,
    onClose: onPickerChange
  }), p.readOnly ? /*#__PURE__*/React.createElement("span", null, p.value || defaultColor) : /*#__PURE__*/React.createElement(_Input, {
    style: {
      width: "100%"
    },
    placeholder: defaultColor,
    disabled: p.disabled,
    value: p.value,
    onChange: onInputChange
  }));
}