import e from "react";
import l from "../../../../../../../../_virtual/index5.js";
import m from "../../../../../../lodash-es@4.17.21/node_modules/lodash-es/map.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 "../../../../../../tinycolor2@1.6.0/node_modules/tinycolor2/esm/tinycolor.js";
import p from "../common/Swatch.js";
var y = function(t) {
  var a = t.colors, c = t.onClick, i = t.onSwatchHover, o = l({
    default: {
      swatches: {
        marginRight: "-10px"
      },
      swatch: {
        width: "22px",
        height: "22px",
        float: "left",
        marginRight: "10px",
        marginBottom: "10px",
        borderRadius: "4px"
      },
      clear: {
        clear: "both"
      }
    }
  });
  return e.createElement(
    "div",
    { style: o.swatches },
    m(a, function(r) {
      return e.createElement(p, {
        key: r,
        color: r,
        style: o.swatch,
        onClick: c,
        onHover: i,
        focusStyle: {
          boxShadow: "0 0 4px " + r
        }
      });
    }),
    e.createElement("div", { style: o.clear })
  );
};
export {
  y as BlockSwatches,
  y as default
};
//# sourceMappingURL=BlockSwatches.js.map
