'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../config/index.js');
var color = require('../config/color.js');
var useOptions = require('../config/use-options.js');
require('../../../../utils/index.js');
var createNamespace = require('../../../../utils/create-namespace.js');
var preDefine = require('../config/pre-define.js');

"use strict";
const _hoisted_1 = ["onClick"];
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{ name: "PreDefine" },
  __name: "pre-define",
  props: preDefine.preDefineProps,
  setup(__props) {
    const props = __props;
    const bem = createNamespace.createNamespace("pre-define");
    const currentColor = useOptions.useOptions()?.currentColor;
    const rgbaColors = vue.ref(preDefine.parseColors(props.colors, props.color));
    const handleSelect = (index) => {
      props.color.fromString(props.colors[index]);
    };
    vue.watch(
      () => currentColor.value,
      (val) => {
        if (val) {
          const color$1 = new color.default();
          color$1.fromString(val);
          rgbaColors.value.forEach((item) => {
            item.selected = color$1.compare(item);
          });
        }
      }
    );
    vue.watchEffect(() => {
      rgbaColors.value = preDefine.parseColors(props.colors, props.color);
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock(
        "div",
        {
          class: vue.normalizeClass(vue.unref(bem).b())
        },
        [
          vue.createElementVNode(
            "div",
            {
              class: vue.normalizeClass(vue.unref(bem).m("colors"))
            },
            [
              (vue.openBlock(true), vue.createElementBlock(
                vue.Fragment,
                null,
                vue.renderList(rgbaColors.value, (item, index) => {
                  return vue.openBlock(), vue.createElementBlock("div", {
                    key: index,
                    class: vue.normalizeClass({
                      [vue.unref(bem).m("color-selector")]: true,
                      [vue.unref(bem).is("selected")]: item.selected,
                      [vue.unref(bem).is("alpha")]: item._alpha < 100
                    }),
                    onClick: ($event) => handleSelect(index)
                  }, [
                    vue.createElementVNode(
                      "div",
                      {
                        style: vue.normalizeStyle({ backgroundColor: item.value })
                      },
                      null,
                      4
                      /* STYLE */
                    )
                  ], 10, _hoisted_1);
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ],
            2
            /* CLASS */
          )
        ],
        2
        /* CLASS */
      );
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=pre-define.vue2.js.map
