import i, { PureComponent as d, Component as f } from "react";
import b from "../../../../../../../../_virtual/index9.js";
import { calculateChange as v } from "../../helpers/alpha.js";
import { Checkboard as g } from "./Checkboard.js";
var m = Object.assign || function(n) {
  for (var t = 1; t < arguments.length; t++) {
    var o = arguments[t];
    for (var r in o)
      Object.prototype.hasOwnProperty.call(o, r) && (n[r] = o[r]);
  }
  return n;
}, w = /* @__PURE__ */ function() {
  function n(t, o) {
    for (var r = 0; r < o.length; r++) {
      var e = o[r];
      e.enumerable = e.enumerable || !1, e.configurable = !0, "value" in e && (e.writable = !0), Object.defineProperty(t, e.key, e);
    }
  }
  return function(t, o, r) {
    return o && n(t.prototype, o), r && n(t, r), t;
  };
}();
function x(n, t) {
  if (!(n instanceof t))
    throw new TypeError("Cannot call a class as a function");
}
function c(n, t) {
  if (!n)
    throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
  return t && (typeof t == "object" || typeof t == "function") ? t : n;
}
function y(n, t) {
  if (typeof t != "function" && t !== null)
    throw new TypeError("Super expression must either be null or a function, not " + typeof t);
  n.prototype = Object.create(t && t.prototype, { constructor: { value: n, enumerable: !1, writable: !0, configurable: !0 } }), t && (Object.setPrototypeOf ? Object.setPrototypeOf(n, t) : n.__proto__ = t);
}
var L = function(n) {
  y(t, n);
  function t() {
    var o, r, e, a;
    x(this, t);
    for (var h = arguments.length, p = Array(h), u = 0; u < h; u++)
      p[u] = arguments[u];
    return a = (r = (e = c(this, (o = t.__proto__ || Object.getPrototypeOf(t)).call.apply(o, [this].concat(p))), e), e.handleChange = function(s) {
      var l = v(s, e.props.hsl, e.props.direction, e.props.a, e.container);
      l && typeof e.props.onChange == "function" && e.props.onChange(l, s);
    }, e.handleMouseDown = function(s) {
      e.handleChange(s), window.addEventListener("mousemove", e.handleChange), window.addEventListener("mouseup", e.handleMouseUp);
    }, e.handleMouseUp = function() {
      e.unbindEventListeners();
    }, e.unbindEventListeners = function() {
      window.removeEventListener("mousemove", e.handleChange), window.removeEventListener("mouseup", e.handleMouseUp);
    }, r), c(e, a);
  }
  return w(t, [{
    key: "componentWillUnmount",
    value: function() {
      this.unbindEventListeners();
    }
  }, {
    key: "render",
    value: function() {
      var r = this, e = this.props.rgb, a = b({
        default: {
          alpha: {
            absolute: "0px 0px 0px 0px",
            borderRadius: this.props.radius
          },
          checkboard: {
            absolute: "0px 0px 0px 0px",
            overflow: "hidden",
            borderRadius: this.props.radius
          },
          gradient: {
            absolute: "0px 0px 0px 0px",
            background: "linear-gradient(to right, rgba(" + e.r + "," + e.g + "," + e.b + `, 0) 0%,
           rgba(` + e.r + "," + e.g + "," + e.b + ", 1) 100%)",
            boxShadow: this.props.shadow,
            borderRadius: this.props.radius
          },
          container: {
            position: "relative",
            height: "100%",
            margin: "0 3px"
          },
          pointer: {
            position: "absolute",
            left: e.a * 100 + "%"
          },
          slider: {
            width: "4px",
            borderRadius: "1px",
            height: "8px",
            boxShadow: "0 0 2px rgba(0, 0, 0, .6)",
            background: "#fff",
            marginTop: "1px",
            transform: "translateX(-2px)"
          }
        },
        vertical: {
          gradient: {
            background: "linear-gradient(to bottom, rgba(" + e.r + "," + e.g + "," + e.b + `, 0) 0%,
           rgba(` + e.r + "," + e.g + "," + e.b + ", 1) 100%)"
          },
          pointer: {
            left: 0,
            top: e.a * 100 + "%"
          }
        },
        overwrite: m({}, this.props.style)
      }, {
        vertical: this.props.direction === "vertical",
        overwrite: !0
      });
      return i.createElement(
        "div",
        { style: a.alpha },
        i.createElement(
          "div",
          { style: a.checkboard },
          i.createElement(g, { renderers: this.props.renderers })
        ),
        i.createElement("div", { style: a.gradient }),
        i.createElement(
          "div",
          {
            style: a.container,
            ref: function(p) {
              return r.container = p;
            },
            onMouseDown: this.handleMouseDown,
            onTouchMove: this.handleChange,
            onTouchStart: this.handleChange
          },
          i.createElement(
            "div",
            { style: a.pointer },
            this.props.pointer ? i.createElement(this.props.pointer, this.props) : i.createElement("div", { style: a.slider })
          )
        )
      );
    }
  }]), t;
}(d || f);
export {
  L as Alpha,
  L as default
};
//# sourceMappingURL=Alpha.js.map
