"use strict";var e=require('./../../../ext-esm/tslib/tslib.es6.js'),i=require("react/jsx-runtime"),r=require("react"),a=require("classnames"),s=require("lodash"),t=require("@material-ui/core"),l=require("@material-ui/icons/DragIndicator"),n=require("../../../utils/index.js"),o=require("../../IconButton/index.js"),d=require("../RealTimeSidebarContext.js"),u=require("./RealTimeBoxStyles.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=c(a),x=c(l);var g=r.memo((function(a){var l,c=a.item,g=void 0===c?null:c,j=a.isDraggable,v=void 0===j||j,_=a.dragHandle,h=void 0===_?s.noop:_,q=a.itemSelected,p=void 0===q?null:q,f=u.useStyles(),B=r.useContext(d),b=B.handleOpenCloseDialog,D=B.handleChangeParamToEdit,y=g?g.unitTo||n.getUnitDisplay(g.unitType):null,N=g?{borderLeft:"2px solid ".concat(g.color)}:null;return g?i.jsxs(i.Fragment,{children:[i.jsx("div",e.__assign({className:m.default(f.rtBox,(l={},l[f.rtBoxSelected]=!!p,l.notDraggable=!v,l)),"data-testid":"realtime_box"},{children:i.jsxs(i.Fragment,{children:[i.jsxs("div",e.__assign({className:f.rtBoxInner,style:N,onClick:function(){b(!0),D(g.key)},"data-testid":"".concat(g.name,"_edit_item")},{children:[i.jsx("div",e.__assign({className:f.rtBoxTitle},{children:g.name})),i.jsxs("div",e.__assign({className:f.rtBoxValue},{children:[g.value," ",i.jsx("span",{children:y})]}))]})),v&&h(i.jsx("div",e.__assign({className:f.rtBoxButtonContainer,"data-testid":"realTimeValuesItemDrag"},{children:i.jsx(o,e.__assign({tooltipProps:{title:"Drag to Reorder"}},{children:i.jsx(x.default,{className:f.dragIcon,color:"error"})}))})))]})})),v&&i.jsx(t.Divider,{className:f.divider})]}):null}));module.exports=g;
