@apptane/react-ui-charts/dist/parts/ChartMarker.js

Chart components in Apptane React UI framework

function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }

import { css } from "@emotion/react";
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
const StyleContainer = process.env.NODE_ENV === "production" ? {
  name: "1v6o9kg",
  styles: "display:block;flex:none"
} : {
  name: "1mskdn1-StyleContainer",
  styles: "display:block;flex:none;label:StyleContainer;",
  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9wYXJ0cy9DaGFydE1hcmtlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSTBCIiwiZmlsZSI6Ii4uLy4uL3NyYy9wYXJ0cy9DaGFydE1hcmtlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb2xvciB9IGZyb20gXCJAYXBwdGFuZS9yZWFjdC11aS1jb3JlXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IENoYXJ0TWFya2VyUHJvcHMgfSBmcm9tIFwiLi9DaGFydE1hcmtlci50eXBlcy5qc1wiO1xuXG5jb25zdCBTdHlsZUNvbnRhaW5lciA9IGNzc2BcbiAgZGlzcGxheTogYmxvY2s7XG4gIGZsZXg6IG5vbmU7XG5gO1xuXG5jb25zdCBTdHlsZU1hcmtlciA9IChjb2xvcjogQ29sb3IsIG9wYWNpdHk6IG51bWJlciwgYm9yZGVyOiBDb2xvcikgPT4gY3NzYFxuICBmaWxsOiAke2NvbG9yfTtcbiAgc3Ryb2tlOiAke2JvcmRlcn07XG4gIHN0cm9rZS13aWR0aDogMTtcbiAgZmlsbC1vcGFjaXR5OiAke29wYWNpdHl9O1xuICBzdHJva2Utb3BhY2l0eTogJHtvcGFjaXR5fTtcbmA7XG5cbi8qKlxuICogQ2hhcnQgbWFya2VyIGNvbXBvbmVudC5cbiAqL1xuZXhwb3J0IGZ1bmN0aW9uIENoYXJ0TWFya2VyKHsgdGhlbWUsIGNvbG9yTW9kZSwgYXBwZWFyYW5jZSA9IFwiY2lyY2xlXCIsIGNvbG9yLCBtdXRlZCwgc2l6ZSA9IDEwIH06IENoYXJ0TWFya2VyUHJvcHMpIHtcbiAgY29uc3QgYm9yZGVyID0gdGhlbWUucGFsZXR0ZVtjb2xvck1vZGVdLndoaXRlO1xuICBjb25zdCBvcGFjaXR5ID0gbXV0ZWQgPyAwLjMgOiAxO1xuXG4gIGxldCBtYXJrZXI7XG4gIHN3aXRjaCAoYXBwZWFyYW5jZSkge1xuICAgIGNhc2UgXCJsaW5lXCI6XG4gICAgICBtYXJrZXIgPSAoXG4gICAgICAgIDxsaW5lIGNzcz17U3R5bGVNYXJrZXIoY29sb3IsIG9wYWNpdHksIGJvcmRlcil9IHgxPXswfSB5MT17c2l6ZSAvIDJ9IHgyPXtzaXplfSB5Mj17c2l6ZSAvIDJ9IHN0cm9rZVdpZHRoPXsyfSAvPlxuICAgICAgKTtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgXCJzcXVhcmVcIjpcbiAgICAgIG1hcmtlciA9IDxyZWN0IGNzcz17U3R5bGVNYXJrZXIoY29sb3IsIG9wYWNpdHksIGJvcmRlcil9IHg9ezB9IHk9ezB9IHdpZHRoPXtzaXplfSBoZWlnaHQ9e3NpemV9IC8+O1xuICAgICAgYnJlYWs7XG4gICAgZGVmYXVsdDpcbiAgICAgIG1hcmtlciA9IChcbiAgICAgICAgPGNpcmNsZSBjc3M9e1N0eWxlTWFya2VyKGNvbG9yLCBvcGFjaXR5LCBib3JkZXIpfSBjeD17c2l6ZSAvIDJ9IGN5PXtzaXplIC8gMn0gcj17TWF0aC5jZWlsKHNpemUgLyAyIC0gMSl9IC8+XG4gICAgICApO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8c3ZnXG4gICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgICAgIHZpZXdCb3g9e2AwIDAgJHtzaXplfSAke3NpemV9YH1cbiAgICAgIHdpZHRoPXtzaXplfVxuICAgICAgaGVpZ2h0PXtzaXplfVxuICAgICAgY3NzPXtTdHlsZUNvbnRhaW5lcn0+XG4gICAgICB7bWFya2VyfVxuICAgIDwvc3ZnPlxuICApO1xufVxuIl19 */",
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
};

const StyleMarker = (color, opacity, border) => /*#__PURE__*/css("fill:", color, ";stroke:", border, ";stroke-width:1;fill-opacity:", opacity, ";stroke-opacity:", opacity, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:StyleMarker;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9wYXJ0cy9DaGFydE1hcmtlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU3lFIiwiZmlsZSI6Ii4uLy4uL3NyYy9wYXJ0cy9DaGFydE1hcmtlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb2xvciB9IGZyb20gXCJAYXBwdGFuZS9yZWFjdC11aS1jb3JlXCI7XG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IENoYXJ0TWFya2VyUHJvcHMgfSBmcm9tIFwiLi9DaGFydE1hcmtlci50eXBlcy5qc1wiO1xuXG5jb25zdCBTdHlsZUNvbnRhaW5lciA9IGNzc2BcbiAgZGlzcGxheTogYmxvY2s7XG4gIGZsZXg6IG5vbmU7XG5gO1xuXG5jb25zdCBTdHlsZU1hcmtlciA9IChjb2xvcjogQ29sb3IsIG9wYWNpdHk6IG51bWJlciwgYm9yZGVyOiBDb2xvcikgPT4gY3NzYFxuICBmaWxsOiAke2NvbG9yfTtcbiAgc3Ryb2tlOiAke2JvcmRlcn07XG4gIHN0cm9rZS13aWR0aDogMTtcbiAgZmlsbC1vcGFjaXR5OiAke29wYWNpdHl9O1xuICBzdHJva2Utb3BhY2l0eTogJHtvcGFjaXR5fTtcbmA7XG5cbi8qKlxuICogQ2hhcnQgbWFya2VyIGNvbXBvbmVudC5cbiAqL1xuZXhwb3J0IGZ1bmN0aW9uIENoYXJ0TWFya2VyKHsgdGhlbWUsIGNvbG9yTW9kZSwgYXBwZWFyYW5jZSA9IFwiY2lyY2xlXCIsIGNvbG9yLCBtdXRlZCwgc2l6ZSA9IDEwIH06IENoYXJ0TWFya2VyUHJvcHMpIHtcbiAgY29uc3QgYm9yZGVyID0gdGhlbWUucGFsZXR0ZVtjb2xvck1vZGVdLndoaXRlO1xuICBjb25zdCBvcGFjaXR5ID0gbXV0ZWQgPyAwLjMgOiAxO1xuXG4gIGxldCBtYXJrZXI7XG4gIHN3aXRjaCAoYXBwZWFyYW5jZSkge1xuICAgIGNhc2UgXCJsaW5lXCI6XG4gICAgICBtYXJrZXIgPSAoXG4gICAgICAgIDxsaW5lIGNzcz17U3R5bGVNYXJrZXIoY29sb3IsIG9wYWNpdHksIGJvcmRlcil9IHgxPXswfSB5MT17c2l6ZSAvIDJ9IHgyPXtzaXplfSB5Mj17c2l6ZSAvIDJ9IHN0cm9rZVdpZHRoPXsyfSAvPlxuICAgICAgKTtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgXCJzcXVhcmVcIjpcbiAgICAgIG1hcmtlciA9IDxyZWN0IGNzcz17U3R5bGVNYXJrZXIoY29sb3IsIG9wYWNpdHksIGJvcmRlcil9IHg9ezB9IHk9ezB9IHdpZHRoPXtzaXplfSBoZWlnaHQ9e3NpemV9IC8+O1xuICAgICAgYnJlYWs7XG4gICAgZGVmYXVsdDpcbiAgICAgIG1hcmtlciA9IChcbiAgICAgICAgPGNpcmNsZSBjc3M9e1N0eWxlTWFya2VyKGNvbG9yLCBvcGFjaXR5LCBib3JkZXIpfSBjeD17c2l6ZSAvIDJ9IGN5PXtzaXplIC8gMn0gcj17TWF0aC5jZWlsKHNpemUgLyAyIC0gMSl9IC8+XG4gICAgICApO1xuICB9XG5cbiAgcmV0dXJuIChcbiAgICA8c3ZnXG4gICAgICB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCJcbiAgICAgIHZpZXdCb3g9e2AwIDAgJHtzaXplfSAke3NpemV9YH1cbiAgICAgIHdpZHRoPXtzaXplfVxuICAgICAgaGVpZ2h0PXtzaXplfVxuICAgICAgY3NzPXtTdHlsZUNvbnRhaW5lcn0+XG4gICAgICB7bWFya2VyfVxuICAgIDwvc3ZnPlxuICApO1xufVxuIl19 */");
/**
 * Chart marker component.
 */


export function ChartMarker(_ref) {
  let {
    theme,
    colorMode,
    appearance = "circle",
    color,
    muted,
    size = 10
  } = _ref;
  const border = theme.palette[colorMode].white;
  const opacity = muted ? 0.3 : 1;
  let marker;

  switch (appearance) {
    case "line":
      marker = _jsx("line", {
        css: StyleMarker(color, opacity, border),
        x1: 0,
        y1: size / 2,
        x2: size,
        y2: size / 2,
        strokeWidth: 2
      });
      break;

    case "square":
      marker = _jsx("rect", {
        css: StyleMarker(color, opacity, border),
        x: 0,
        y: 0,
        width: size,
        height: size
      });
      break;

    default:
      marker = _jsx("circle", {
        css: StyleMarker(color, opacity, border),
        cx: size / 2,
        cy: size / 2,
        r: Math.ceil(size / 2 - 1)
      });
  }

  return _jsx("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 ".concat(size, " ").concat(size),
    width: size,
    height: size,
    css: StyleContainer,
    children: marker
  });
}
//# sourceMappingURL=ChartMarker.js.map