import{m as b,o as I,R as e,a0 as N,aY as P,aZ as R,ac as A,at as B,ae as H,a as E,P as L,B as m,a_ as T,a$ as _,b0 as U,b1 as W,b2 as G,u as g,c as K,D as $,e as O}from"./index-Bm2SqMk3.js";import{D as Y}from"./cjs-C0mL3dGh.js";import{C as j,a as z}from"./ColorPicker-Daqe9jmn.js";import{m as v,a as k}from"./util-C94x5Vwy.js";const F=b()(t=>({closeButton:{position:"absolute",right:t.spacing(1),top:t.spacing(1),color:t.palette.grey[500]}}));function Z(t){const l=E.useRef(null);return e.createElement(Y,{nodeRef:l,cancel:'[class*="MuiDialogContent-root"]',onStart:o=>{var c,r;return(r=(c=o.target)===null||c===void 0?void 0:c.className)===null||r===void 0?void 0:r.includes("MuiDialogTitle")}},e.createElement(L,{ref:l,...t}))}const q=I(function(l){const{classes:o}=F(),{title:c,children:r,onClose:i}=l;return e.createElement(N,{...l,PaperComponent:Z},e.createElement(P,null,e.createElement(R,{style:{cursor:"move"}},c,i?e.createElement(A,{className:o.closeButton,onClick:()=>{i()}},e.createElement(B,null)):null),e.createElement(H,null),r))}),J=b()({cell:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}});function Q({rows:t,onChange:l,showTips:o}){const{classes:c}=J(),[r,i]=E.useState(null),[a,h]=E.useState([]),{name:X,color:ee,baseUri:te,...y}=t[0],[D,w]=E.useState("blue"),[C,x]=E.useState({idx:0,field:null});return e.createElement("div",null,e.createElement(m,{disabled:!a.length,onClick:n=>{i(n.currentTarget)}},"Change color of selected items"),e.createElement(m,{onClick:()=>{l(v([...t],a))},disabled:!a.length},e.createElement(T,null),o?"Move selected items up":null),e.createElement(m,{onClick:()=>{l(k([...t],a))},disabled:!a.length},e.createElement(_,null),o?"Move selected items down":null),e.createElement(m,{onClick:()=>{l(v([...t],a,t.length))},disabled:!a.length},e.createElement(U,null),o?"Move selected items to top":null),e.createElement(m,{onClick:()=>{l(k([...t],a,t.length))},disabled:!a.length},e.createElement(W,null),o?"Move selected items to bottom":null),e.createElement(j.ColorPopover,{anchorEl:r,color:D,onChange:n=>{w(n),a.forEach(s=>{const d=t.find(u=>u.name===s);d&&(d.color=n)}),l([...t])},onClose:()=>{i(null)}}),e.createElement("div",{style:{height:400,width:"100%"}},e.createElement(G,{getRowId:n=>n.name,checkboxSelection:!0,disableRowSelectionOnClick:!0,onRowSelectionModelChange:n=>{h(n)},rows:t,rowHeight:25,columnHeaderHeight:33,columns:[{field:"color",headerName:"Color",renderCell:({value:n,id:s})=>e.createElement(z,{color:n||"blue",onChange:d=>{const u=t.find(p=>p.name===s);u&&(u.color=d),l([...t])}})},{field:"name",headerName:"Name",width:g.measureGridWidth(t.map(n=>n.name))},...Object.keys(y).map(n=>({field:n,renderCell:({value:s})=>e.createElement("div",{className:c.cell},e.createElement(K.SanitizedHTML,{html:g.getStr(s)})),width:g.measureGridWidth(t.map(s=>`${s[n]}`))}))],sortModel:[],onSortModelChange:n=>{const s=n[0],d=(C.idx+1)%2,u=s.field||C.field;x({idx:d,field:u}),l(u?[...t].sort((p,M)=>{const f=g.getStr(p[u]),S=g.getStr(M[u]);return d===1?f.localeCompare(S):S.localeCompare(f)}):t)}})))}const V=b()({content:{minWidth:800}});function re({model:t,handleClose:l}){const{classes:o}=V(),{sources:c}=t,[r,i]=E.useState(structuredClone(c||[])),[a,h]=g.useLocalStorage("multiwiggle-showTips",!1);return e.createElement(q,{open:!0,onClose:l,maxWidth:"xl",title:"Multi-wiggle color/arrangement editor"},e.createElement($,{className:o.content},e.createElement(m,{variant:"contained",style:{float:"right"},onClick:()=>{h(!a)}},a?"Hide tips":"Show tips"),e.createElement("br",null),a?e.createElement(e.Fragment,null,"Helpful tips",e.createElement("ul",null,e.createElement("li",null,"You can select rows in the table with the checkboxes"),e.createElement("li",null,"Multi-select is enabled with shift-click and control-click"),e.createElement("li",null,'The "Move selected items up/down" can re-arrange subtracks'),e.createElement("li",null,"Sorting the data grid itself can also re-arrange subtracks"),e.createElement("li",null,"Changes are applied when you hit Submit"),e.createElement("li",null,"You can click and drag the dialog box to move it on the screen"),e.createElement("li",null,"Columns in the table can be hidden using a vertical '...' menu on the right side of each column"))):null,e.createElement(Q,{rows:r,onChange:i,showTips:a})),e.createElement(O,null,e.createElement(m,{variant:"contained",type:"submit",color:"inherit",onClick:()=>{t.clearLayout(),i(t.sources||[])}},"Clear custom settings"),e.createElement(m,{variant:"contained",color:"secondary",onClick:()=>{l(),i([...t.sources||[]])}},"Cancel"),e.createElement(m,{variant:"contained",color:"primary",type:"submit",onClick:()=>{t.setLayout(r),l()}},"Submit")))}export{re as default};
