import { aC as d, a3 as g, a4 as t, a9 as u, dE as b, ab as p, a5 as w, h8 as h, h9 as y, aa as f, V as c, w as C, eg as P, U as m, H as a, _ as x, ad as i, I as v, ae as o, af as l, co as k, c0 as V, ag as $, aj as n, cD as S, ha as E } from "./56c67d3b.js";
import "react";
import { presets as j } from "./f8251044.js";
import "react-dom";
function A(e) {
  return d`
    border-radius: ${e.radius};
    &:not(.ant-input-disabled, .ant-input-affix-wrapper-disabled),
    input {
      background-color: ${e.background};
      color:${e.text};
      font-weight:${e.textWeight};
      font-family:${e.fontFamily};
      border-color: ${e.border};
      &:focus,
      &.ant-input-affix-wrapper-focused {
        border-color: ${e.accent};
      }
      &:hover {
        border-color: ${e.accent};
      }
      .ant-input-clear-icon svg:hover {
        opacity: 0.65;
      }
    }
  `;
}
const H = g(E)`
  width: 100%;
  display: flex;
  justify-content: flex-start;
  ${(e) => e.$style && A(e.$style)}
`, O = [{
  label: t("colorPicker.click"),
  value: "click"
}, {
  label: t("colorPicker.hover"),
  value: "hover"
}], D = u([S]), U = {
  ...b,
  value: p("value", "#3377ff"),
  style: w(h, "style"),
  color: y("color", {}),
  trigger: f(O, "click"),
  disabledAlpha: c,
  showPresets: c,
  onEvent: D,
  presets: C(P, JSON.stringify(j, null, 2))
}, J = new m(U, (e) => {
  var s;
  return e.label({
    children: /* @__PURE__ */ a(H, {
      $style: e.style,
      value: (s = e == null ? void 0 : e.value) == null ? void 0 : s.value,
      disabledAlpha: e.disabledAlpha,
      showText: (r) => r.toHexString().toUpperCase(),
      allowClear: !0,
      trigger: e.trigger,
      disabled: e.disabled,
      onChange: (r) => {
        e.value.onChange(r.toHexString().toUpperCase()), e.color.onChange({
          hex: r.toHexString().toUpperCase(),
          hsb: r.toHsb(),
          rgb: r.toRgb()
        }), e.onEvent("change");
      },
      presets: e.showPresets && !x.isEmpty(e.presets) ? [e.presets] : []
    }),
    style: e.style
  });
}).setPropertyViewFn((e) => /* @__PURE__ */ i(v, {
  children: [/* @__PURE__ */ a(o, {
    name: l.basic,
    children: e.value.propertyView({
      label: t("prop.defaultValue")
    })
  }), /* @__PURE__ */ a(k, {
    ...e
  }), e.label.getPropertyView(), /* @__PURE__ */ i(o, {
    name: l.interaction,
    children: [e.onEvent.getPropertyView(), V(e)]
  }), /* @__PURE__ */ i(o, {
    name: l.advanced,
    children: [e.trigger.propertyView({
      label: t("colorPicker.trigger"),
      radioButton: !0
    }), e.disabledAlpha.propertyView({
      label: t("colorPicker.disabledAlpha")
    }), e.showPresets.propertyView({
      label: t("colorPicker.showPresets")
    }), e.showPresets.getView() && e.presets.propertyView({
      label: t("colorPicker.recommended")
    })]
  }), /* @__PURE__ */ a(o, {
    name: l.layout,
    children: $(e)
  }), /* @__PURE__ */ a(o, {
    name: l.style,
    children: e.style.getPropertyView()
  })]
})).setExposeStateConfigs([new n("value", t("export.inputValueDesc")), new n("color", t("export.inputValueDesc")), new n("disabled", t("prop.disabled"))]).build();
export {
  J as ColorPickerComp,
  D as colorPickerEvent,
  A as getStyle
};
