import o from "react";
import r from "../../../../../../../../_virtual/index6.js";
import u from "../../../../../../../../_virtual/index5.js";
import w from "../../../../../../lodash-es@4.17.21/node_modules/lodash-es/map.js";
import C from "../../../../../../lodash-es@4.17.21/node_modules/lodash-es/merge.js";
import "../common/Alpha.js";
import "../common/Checkboard.js";
import "../common/EditableInput.js";
import "../common/Hue.js";
import "../common/Raised.js";
import "../common/Saturation.js";
import { ColorWrap as y } from "../common/ColorWrap.js";
import "../common/Swatch.js";
import S from "./GithubSwatch.js";
var l = function(t) {
  var g = t.width, d = t.colors, s = t.onChange, m = t.onSwatchHover, e = t.triangle, n = t.styles, h = n === void 0 ? {} : n, p = t.className, f = p === void 0 ? "" : p, a = u(C({
    default: {
      card: {
        width: g,
        background: "#fff",
        border: "1px solid rgba(0,0,0,0.2)",
        boxShadow: "0 3px 12px rgba(0,0,0,0.15)",
        borderRadius: "4px",
        position: "relative",
        padding: "5px",
        display: "flex",
        flexWrap: "wrap"
      },
      triangle: {
        position: "absolute",
        border: "7px solid transparent",
        borderBottomColor: "#fff"
      },
      triangleShadow: {
        position: "absolute",
        border: "8px solid transparent",
        borderBottomColor: "rgba(0,0,0,0.15)"
      }
    },
    "hide-triangle": {
      triangle: {
        display: "none"
      },
      triangleShadow: {
        display: "none"
      }
    },
    "top-left-triangle": {
      triangle: {
        top: "-14px",
        left: "10px"
      },
      triangleShadow: {
        top: "-16px",
        left: "9px"
      }
    },
    "top-right-triangle": {
      triangle: {
        top: "-14px",
        right: "10px"
      },
      triangleShadow: {
        top: "-16px",
        right: "9px"
      }
    },
    "bottom-left-triangle": {
      triangle: {
        top: "35px",
        left: "10px",
        transform: "rotate(180deg)"
      },
      triangleShadow: {
        top: "37px",
        left: "9px",
        transform: "rotate(180deg)"
      }
    },
    "bottom-right-triangle": {
      triangle: {
        top: "35px",
        right: "10px",
        transform: "rotate(180deg)"
      },
      triangleShadow: {
        top: "37px",
        right: "9px",
        transform: "rotate(180deg)"
      }
    }
  }, h), {
    "hide-triangle": e === "hide",
    "top-left-triangle": e === "top-left",
    "top-right-triangle": e === "top-right",
    "bottom-left-triangle": e === "bottom-left",
    "bottom-right-triangle": e === "bottom-right"
  }), x = function(c, b) {
    return s({ hex: c, source: "hex" }, b);
  };
  return o.createElement(
    "div",
    { style: a.card, className: "github-picker " + f },
    o.createElement("div", { style: a.triangleShadow }),
    o.createElement("div", { style: a.triangle }),
    w(d, function(i) {
      return o.createElement(S, {
        color: i,
        key: i,
        onClick: x,
        onSwatchHover: m
      });
    })
  );
};
l.propTypes = {
  width: r.oneOfType([r.string, r.number]),
  colors: r.arrayOf(r.string),
  triangle: r.oneOf(["hide", "top-left", "top-right", "bottom-left", "bottom-right"]),
  styles: r.object
};
l.defaultProps = {
  width: 200,
  colors: ["#B80000", "#DB3E00", "#FCCB00", "#008B02", "#006B76", "#1273DE", "#004DCF", "#5300EB", "#EB9694", "#FAD0C3", "#FEF3BD", "#C1E1C5", "#BEDADC", "#C4DEF6", "#BED3F3", "#D4C4FB"],
  triangle: "top-left",
  styles: {}
};
y(l);
export {
  l as Github
};
//# sourceMappingURL=Github.js.map
