import e from"@babel/runtime/helpers/toConsumableArray";import r from"@babel/runtime/helpers/defineProperty";import t from"@babel/runtime/helpers/slicedToArray";import{useState as n}from"react";import i from"prop-types";import a from"uuid";import{withStyles as o,Grid as c,FormControl as s,TextField as l,IconButton as m,Button as u}from"@material-ui/core";import p from"@material-ui/icons/NavigateNext";import d from"@material-ui/icons/Add";import{MAX_TRACE_COUNT as f,DEFAULT_TRACE_SETTINGS as h}from"../constants.js";import g from"./TraceSettings.js";import v from"./TraceSelect.js";import b from"./TrackSettings.css.js";import y from"../../ColorPicker/ColorPicker.js";import k from"../../Modal/Modal.js";import{jsxs as N,jsx as O}from"react/jsx-runtime";function j(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function C(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?j(Object(n),!0).forEach((function(t){r(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):j(Object(n)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))}))}return e}var T=function(i){var o=i.settings,j=o.name,T=o.traces,P=i.onChange,S=i.classes,q=i.mapping,w=n(!1),D=t(w,2),R=D[0],B=D[1],A=n(),x=t(A,2),E=x[0],I=x[1],z=T&&T.length>f,L=function(){var e=T.map((function(e){return e.id===E.id?E:e}));P("traces",e),B(!1)};return N(c,{className:S.container,children:[O(s,{className:S.input,children:O(l,{label:"Track Name",value:j,className:S.input,onChange:function(e){var r=e.target.value;return P("name",r)}})}),O("div",{className:b.title,children:"Traces: "}),T&&!!T.length&&O("div",{className:b.tracesContainer,children:T.map((function(e,t){var n=e.id,i=e.key,a=e.color;return N("div",{className:b.tracesItem,children:[O(v,{value:i,onChange:function(e){return function(e,r){var t=T.map((function(t){var n=q.find((function(e){var t=e.key;return r===t}));return t.id===e?C(C({},t),n):t}));P("traces",t)}(n,e)},mapping:q}),O("div",{className:b.colorPicker,children:O(y,{value:a,onChange:function(e){return function(e,t,n){var i=T.map((function(i){return i.id===e?C(C({},i),{},r({},t,n)):i}));P("traces",i)}(n,"color",e)},hideLabel:!0,buttonClassName:S.picker})}),O(m,{onClick:function(){return function(e){I(T[e]),B(!0)}(t)},className:S.navBtn,children:O(p,{fontSize:"small",className:S.navIcon})})]},n)}))}),!z&&N(u,{color:"primary",onClick:function(){T&&T.length?P("traces",[].concat(e(T),[C({id:a()},h)])):P("traces",[C({id:a()},h)])},children:[O(d,{}),O("span",{children:"Add Trace"})]}),O(k,{open:R,title:N("div",{className:b.modalTitle,children:[N("span",{className:b.trackTitle,onClick:L,children:["Track Settings /"," "]}),E&&E.name||"Empty Trace"]}),actions:N("div",{className:b.actions,children:[O(u,{className:S.button,color:"primary",onClick:function(){var e=T.filter((function(e){return e.id!==E.id}));P("traces",e),B(!1)},children:"Delete Trace"}),O(u,{className:S.button,color:"primary",onClick:function(){return B(!1)},children:"Cancel"}),O(u,{className:S.button,variant:"contained",color:"primary",onClick:L,children:"Save"})]}),children:O(g,{traceSettings:E,onChange:function(e,t){I(C(C({},E),{},r({},e,t)))},mapping:q})})]})};T.propTypes={settings:i.shape({name:i.string.isRequired,traces:i.arrayOf(i.shape({}))}).isRequired,onChange:i.func.isRequired,classes:i.shape({}).isRequired,mapping:i.arrayOf(i.shape({name:i.string.isRequired,key:i.string.isRequired}).isRequired).isRequired};var P=o((function(e){return{container:{paddingTop:20,minWidth:300},input:{width:200},picker:{width:36,minWidth:36,height:24},navBtn:{position:"absolute",right:-10,top:"50%",transform:"translate(0, -50%)"},navIcon:{color:"#BDBDBD"},button:{fontSize:14,marginLeft:20}}}))(T);export{P as default};
//# sourceMappingURL=TrackSettings.js.map
