taxonium-component/dist/SetColorDialog-C6d0hPER.js

React component for exploring large phylogenetic trees in the browser

import { jsxs as t, jsx as o, Fragment as s } from "react/jsx-runtime";
import { useState as p } from "react";
import { o as g, a as f, D as u, T as l, d as k, B as C } from "./JBrowsePanel-uJIA-L6s.js";
import { C as n } from "./ColorPicker-BkeYpg1W.js";
import { F as d } from "./FormControlLabel-CwjOxa71.js";
import { R as h } from "./Radio-D7as17u0.js";
const x = g(function({ model: r, handleClose: c }) {
  const [i, a] = p(!1);
  return t(f.Dialog, { open: !0, onClose: c, title: "Set color", children: [t(u, { children: [o(l, { children: "Select either an overall color, or the positive/negative colors. Note that density renderers only work properly with positive/negative colors" }), o(d, { checked: !i, onClick: () => {
    a(!1);
  }, control: o(h, {}), label: "Overall color" }), o(d, { checked: i, onClick: () => {
    a(!0);
  }, control: o(h, {}), label: "Positive/negative color" }), i ? t(s, { children: [o(l, { children: "Positive color" }), o(n.ColorPicker, { color: r.posColor || "black", onChange: (e) => {
    r.setPosColor(e), r.setColor(void 0);
  } }), o(l, { children: "Negative color" }), o(n.ColorPicker, { color: r.negColor || "black", onChange: (e) => {
    r.setNegColor(e), r.setColor(void 0);
  } })] }) : t(s, { children: [o(l, { children: "Overall color" }), o(n.ColorPicker, { color: r.color || "black", onChange: (e) => {
    r.setColor(e);
  } })] })] }), t(k, { children: [o(C, { onClick: () => {
    r.setPosColor(void 0), r.setNegColor(void 0), r.setColor(void 0);
  }, color: "secondary", variant: "contained", children: "Restore default" }), o(C, { variant: "contained", color: "primary", type: "submit", onClick: () => {
    c();
  }, children: "Submit" })] })] });
});
export {
  x as default
};
//# sourceMappingURL=SetColorDialog-C6d0hPER.js.map