kitchen-simulator
Version:
It is a kitchen simulator (self-contained micro-frontend).
100 lines • 3.77 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["hook", "label"];
import React from 'react';
import PropTypes from 'prop-types';
import { BASE_CABINET_LAYOUTPOS, TALL_CABINET_LAYOUTPOS, UNIT_INCH, UNITS_LENGTH } from "../../constants";
import { convert } from "../../utils/convert-units-lite";
import { FormLabel, FormNumberInput1, FormSelect } from "../../components/style/export";
import { Map } from 'immutable';
import { toFixedFloat } from "../../utils/math";
import PropertyStyle from "./shared-property-style";
var internalTableStyle = {
borderCollapse: 'collapse'
};
var secondTdStyle = {
padding: 0
};
var unitContainerStyle = {
width: '3em'
};
export default function PropertyLengthMeasureHole(_ref, _ref2) {
var value = _ref.value,
onUpdate = _ref.onUpdate,
onValid = _ref.onValid,
configs = _ref.configs,
sourceElement = _ref.sourceElement,
internalState = _ref.internalState,
state = _ref.state;
var catalog = _ref2.catalog;
var _unit = value.get('_unit') || UNIT_INCH;
var _length = value.get('_length') || 0;
var length = value.get('length') || _length;
var type = value.get('type') || BASE_CABINET_LAYOUTPOS;
var hook = configs.hook,
label = configs.label,
configRest = _objectWithoutProperties(configs, _excluded);
var update = function update(lengthInput, unitInput, type) {
var newLength = toFixedFloat(lengthInput);
var merged = null;
if (type === 0) {
merged = value.merge({
_length: newLength,
length: convert(newLength).from(unitInput).to('cm')
});
} else {
merged = value.merge({
_length: convert(newLength).from(UNIT_INCH).to(unitInput),
_unit: unitInput
});
}
if (hook) {
return hook(merged, sourceElement, internalState, state).then(function (val) {
return onUpdate(val);
});
}
return onUpdate(merged);
};
return /*#__PURE__*/React.createElement("table", {
className: "PropertyLengthMeasure",
style: PropertyStyle.tableStyle
}, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
style: PropertyStyle.firstTdStyle
}, /*#__PURE__*/React.createElement(FormLabel, null, label)), /*#__PURE__*/React.createElement("td", {
style: secondTdStyle
}, /*#__PURE__*/React.createElement("table", {
style: internalTableStyle
}, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement(FormNumberInput1, _extends({
disabled: type === TALL_CABINET_LAYOUTPOS,
value: _length,
onChange: function onChange(event) {
return update(event.target.value, _unit, 0);
},
onValid: onValid
}, configRest))), /*#__PURE__*/React.createElement("td", {
style: unitContainerStyle
}, /*#__PURE__*/React.createElement(FormSelect, {
disabled: type === TALL_CABINET_LAYOUTPOS,
value: _unit,
onChange: function onChange(event) {
return update(length, event.target.value, 1);
}
}, UNITS_LENGTH.map(function (el) {
return /*#__PURE__*/React.createElement("option", {
key: el,
value: el
}, el);
}))))))))));
}
PropertyLengthMeasureHole.propTypes = {
value: PropTypes.instanceOf(Map).isRequired,
onUpdate: PropTypes.func.isRequired,
onValid: PropTypes.func,
configs: PropTypes.object.isRequired,
sourceElement: PropTypes.object,
internalState: PropTypes.object,
state: PropTypes.object.isRequired
};
PropertyLengthMeasureHole.contextTypes = {
catalog: PropTypes.object.isRequired
};