@hisptz/react-ui/build/es/components/FormField/components/LegendMinMax.js

A collection of reusable complex DHIS2 react ui components.

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import { Field, InputField } from "@dhis2/ui";
import React, { useMemo } from "react";
import { uid } from "../../../core/utils";
import Legend from "../models/legend";
export default function LegendMinMax(_ref, ref) {
  var _value$min;

  let {
    name,
    value,
    onChange,
    legendDefinition,
    ...props
  } = _ref;
  const {
    id,
    color,
    name: legendName
  } = legendDefinition !== null && legendDefinition !== void 0 ? legendDefinition : {};
  const legend = useMemo(() => new Legend({
    legendDefinitionId: id !== null && id !== void 0 ? id : uid()
  }), [id]);

  if (!id) {
    return null;
  }

  return /*#__PURE__*/React.createElement(Field, _extends({}, props, {
    name: name,
    value: value,
    label: undefined
  }), /*#__PURE__*/React.createElement("div", {
    ref: ref,
    className: "row space-between w-100 align-items-end"
  }, /*#__PURE__*/React.createElement("div", {
    className: "row"
  }, /*#__PURE__*/React.createElement("div", {
    className: "pr-16",
    style: {
      backgroundColor: color,
      border: "1px solid ".concat(color),
      height: 24,
      width: 48,
      marginRight: 4
    }
  }), /*#__PURE__*/React.createElement("label", {
    className: "pl-8"
  }, legendName)), /*#__PURE__*/React.createElement("div", {
    className: "row space-between gap-16"
  }, /*#__PURE__*/React.createElement(InputField, {
    value: value === null || value === void 0 ? void 0 : value.startValue,
    type: "number",
    min: "0",
    max: "".concat(value === null || value === void 0 ? void 0 : value.max),
    onChange: _ref2 => {
      let {
        value: newValue
      } = _ref2;
      const object = value !== null && value !== void 0 ? value : legend;
      onChange({
        name,
        value: Legend.set(object, "startValue", newValue)
      });
    },
    className: "pr-8",
    label: "Min"
  }), /*#__PURE__*/React.createElement(InputField, {
    value: value === null || value === void 0 ? void 0 : value.endValue,
    type: "number",
    min: "".concat((_value$min = value === null || value === void 0 ? void 0 : value.min) !== null && _value$min !== void 0 ? _value$min : 0),
    onChange: _ref3 => {
      let {
        value: newValue
      } = _ref3;
      const object = value !== null && value !== void 0 ? value : legend;
      onChange({
        name,
        value: Legend.set(object, "endValue", newValue)
      });
    },
    label: "Max"
  }))));
}