@web-noise/core 0.0.18 → 0.0.19

package/dist/esm/components.js

@@ -1,4 +1,4 @@
-let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion/styled";import{useEffect as n,useState as l,useCallback as a,useRef as s}from"react";import{createPortal as d}from"react-dom";import{MdClose as c,MdSettings as h,MdInfoOutline as p}from"react-icons/md";import{useTheme as m,withTheme as g}from"@emotion/react";import"nanoid";import{FaPlus as u}from"react-icons/fa6";import"@web-noise/fetch";import{getConnectedEdges as f,addEdge as v,applyNodeChanges as b,applyEdgeChanges as x,Controls as w,Handle as y}from"@xyflow/react";import{create as $}from"zustand";import{setAudioNodeTypes as k,createPatch as C}from"@web-noise/patch";import{reverse as P,patch as z,create as N}from"jsondiffpatch";import{injectGlobal as _}from"@emotion/css";import"@xyflow/react/dist/style.css";import{Item as E,Menu as j}from"react-contexify";import"react-contexify/dist/ReactContexify.css";import"hotkeys-js";import"react-file-drop";import{FaFileUpload as S,FaVolumeOff as F,FaRegArrowAltCircleRight as A}from"react-icons/fa";import"re-resizable";import"react-grid-layout";import"react-grid-layout/css/styles.css";import"react-icons/ai";import"react-icons/rx";import"react-modern-drawer";import"react-modern-drawer/dist/index.css";import"marked";import{useThrottledCallback as I}from"use-debounce";import R from"rc-slider";import"rc-slider/assets/index.css";import{CanvasSpliner as T}from"CanvasSpliner";function L(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}var D,M,O={};L(O,"Modal",()=>U),L(O,"Checker",()=>ew),L(O,"RadioGroup",()=>e$),L(O,"Input",()=>eP),L(O,"DropdownInput",()=>eF),L(O,"ColorInput",()=>eR),L(O,"NumberInput",()=>eD),L(O,"Button",()=>eM),L(O,"Select",()=>eH),L(O,"Slider",()=>eG),L(O,"SplineEditor",()=>eV),L(O,"ConfigRowLabel",()=>eU),L(O,"ConfigRowControl",()=>eJ),L(O,"ConfigRowSeparator",()=>eK),L(O,"ConfigRow",()=>eY),L(O,"ConfigPanel",()=>eX),L(O,"ConfigRowInner",()=>eq);var H={colors:{elevation1:"#292d39",elevation2:"#181c20",elevation3:"#373c4b",accent1:"#0066dc",accent2:"#007bff",accent3:"#3c93ff",highlight1:"#535760",highlight2:"#8c92a4",highlight3:"#fefefe",vivid1:"#14df42",whitePrimary:"#ffffff",error:"#db5353"},zIndex:{modal:9998,controlPanel:9999,resumeContextLayout:10003}},G=()=>{let e=m();return{...H,...e}};let W=i.div`
+let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion/styled";import{useEffect as n,useState as l,useCallback as a,useRef as s}from"react";import{createPortal as d}from"react-dom";import{MdClose as c,MdSettings as h,MdInfoOutline as p}from"react-icons/md";import{useTheme as m,withTheme as g}from"@emotion/react";import"nanoid";import{FaPlus as u}from"react-icons/fa6";import"@web-noise/fetch";import{getConnectedEdges as f,addEdge as v,applyNodeChanges as b,applyEdgeChanges as x,Controls as w,Handle as y}from"@xyflow/react";import{create as $}from"zustand";import{setAudioNodeTypes as k,createPatch as C}from"@web-noise/patch";import{reverse as P,patch as z,create as N}from"jsondiffpatch";import{injectGlobal as _}from"@emotion/css";import"@xyflow/react/dist/style.css";import{Item as j,Menu as E}from"react-contexify";import"react-contexify/dist/ReactContexify.css";import"hotkeys-js";import"react-file-drop";import{FaFileUpload as S,FaVolumeOff as F,FaRegArrowAltCircleRight as A}from"react-icons/fa";import"re-resizable";import"react-grid-layout";import"react-grid-layout/css/styles.css";import"react-icons/ai";import"react-icons/rx";import"react-modern-drawer";import"react-modern-drawer/dist/index.css";import"marked";import{useThrottledCallback as I}from"use-debounce";import R from"rc-slider";import"rc-slider/assets/index.css";import{CanvasSpliner as T}from"CanvasSpliner";function L(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}var D,M,O={};L(O,"Modal",()=>U),L(O,"Checker",()=>ew),L(O,"RadioGroup",()=>e$),L(O,"Input",()=>eP),L(O,"DropdownInput",()=>eF),L(O,"ColorInput",()=>eR),L(O,"NumberInput",()=>eD),L(O,"Button",()=>eM),L(O,"Select",()=>eH),L(O,"Slider",()=>eG),L(O,"SplineEditor",()=>eV),L(O,"ConfigRowLabel",()=>eU),L(O,"ConfigRowControl",()=>eJ),L(O,"ConfigRowSeparator",()=>eK),L(O,"ConfigRow",()=>eY),L(O,"ConfigPanel",()=>eX),L(O,"ConfigRowInner",()=>eq);var H={colors:{elevation1:"#292d39",elevation2:"#181c20",elevation3:"#373c4b",accent1:"#0066dc",accent2:"#007bff",accent3:"#3c93ff",highlight1:"#535760",highlight2:"#8c92a4",highlight3:"#fefefe",vivid1:"#14df42",whitePrimary:"#ffffff",error:"#db5353"},zIndex:{modal:9998,controlPanel:9999,resumeContextLayout:10003}},G=()=>{let e=m();return{...H,...e}};let W=i.div`
   position: fixed;
   z-index: ${({theme:e})=>e.zIndex.modal};
   width: 100%;
@@ -22,7 +22,7 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
   top: 0.2rem;
   right: 0.2rem;
   cursor: pointer;
-`,U=({children:e,onClose:o,...i})=>{let l=G();return n(()=>{let e=e=>{"Escape"===e.key&&o?.()};return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}},[o]),d(t(W,{theme:l,onClick:o,children:r(B,{...i,onClick:e=>{e.stopPropagation()},theme:l,children:[e,t(V,{theme:l,onClick:o})]})}),document.body)};var J={};L(J,"DRAG_HANDLE_CLASS",()=>K),L(J,"DRAG_HANDLE_SELECTOR",()=>Y),L(J,"CONTROL_PANEL_GRID_CONFIG",()=>X),L(J,"PortType",()=>M);let K="web-noise-drag-handle",Y=`.${K}`,X={rowHeight:10,cols:4};(D=M||(M={})).Gate="gate",D.Number="number",D.Audio="audio",D.Any="any";let q=e=>JSON.parse(JSON.stringify(e)),Q=(e,o)=>{let t=new Set(e.map(e=>e.id)),r=new Set(o.map(e=>e.id));return{added:o.filter(e=>!t.has(e.id)),removed:e.filter(e=>!r.has(e.id))}};$((e=(...e)=>{let[o,t]=e;return{...((e,o)=>({nodes:[],edges:[],onNodesChange:o=>{e(({nodes:e})=>({nodes:b(o,e).map(e=>({dragHandle:Y,...e,data:{label:"unknown",...e.data}}))}))},onEdgesChange:o=>{e(({edges:e})=>({edges:x(o,e)}))},onConnect:o=>{e(({edges:e})=>({edges:v(o,e)}))},addNode:o=>{e(({nodes:e})=>({nodes:e.concat(o)}))},setNodes:o=>{e({nodes:o})},setEdges:o=>{e({edges:o})},setNodesAndEdges:({nodes:o,edges:t})=>{e({nodes:o,edges:t})},getNodesAndEdges:()=>{let{nodes:e,edges:t}=o();return{nodes:e,edges:t}},clearElements:()=>{e({nodes:[],edges:[]})},getNode:e=>{let{nodes:t}=o();return t.find(o=>o.id===e)||null},updateNodeData:(o,t)=>{e(({nodes:e})=>({nodes:e.map(e=>e.id===o?{...e,data:{...e.data,...t}}:e)}))},nodeTypes:{},setNodeTypes:o=>e({nodeTypes:o})}))(...e),...((e,o)=>({history:{maxHistoryLength:5,buffer:[],pointer:0,skipCollect:!1,push:t=>{let{history:r}=o(),{maxHistoryLength:i,skipCollect:n}=r;n?e({history:{...r,skipCollect:!1}}):e(({history:e})=>{if(!e)return{};let{buffer:o,pointer:r}=e,n=o.slice(Math.max(r-i+1,0),r);return{history:{...e,buffer:[...n,t],pointer:Math.min(r+1,i)}}})},back:()=>{let{nodes:t,edges:r,controlPanel:i,history:n}=o(),{buffer:l,pointer:a}=n,s=l[a-1];if(!s)return;let d=P(s);d&&e({...z(q({nodes:t,edges:r,controlPanel:i}),d),history:{...n,pointer:a-1,skipCollect:!0}})},forward:()=>{let{nodes:t,edges:r,controlPanel:i,history:n}=o(),{buffer:l,pointer:a}=n,s=l[a];s&&e({...z(q({nodes:t,edges:r,controlPanel:i}),s),history:{...n,pointer:a+1,skipCollect:!0}})},clear:()=>{let{history:t}=o();e({history:{...t,buffer:[],pointer:0,skipCollect:!0}})}}}))(...e),...((e,o)=>({patch:C(),nodesState:{}}))(...e),...((e,o)=>({project:{files:[]},setProject(o){e({project:o,currentFileIndex:0})},getProject:()=>o().project,pullEditorChanges(){let{getEditorState:e,currentFileIndex:t,updateFileContent:r,project:i}=o(),n=i.files[t];"audio"!==n.type&&r(t,{...n,file:e()})},syncEditorWithCurrentFile:()=>{let{currentFileIndex:e,setEditorState:t,project:r}=o(),i=r.files[e];i?"audio"===i.type?console.log("audio file. skipping"):t(i.file):console.warn("No current file to sync with editor")},currentFileIndex:0,setCurrentFileIndex(t){let{currentFileIndex:r}=o();t!==r&&e({currentFileIndex:t})},updateFileContent(t,r){let{project:i}=o();e({project:{...i,files:i.files.map((e,o)=>o===t?{...e,...r}:e)}})},updateFileName(t,r){let{project:i}=o();e({project:{...i,files:i.files.map((e,o)=>o===t?{...e,name:r}:e)}})},addFile(t){let{project:r}=o(),i=[...r.files,t];e({project:{...r,files:i}})},deleteFile:t=>{let{project:r,currentFileIndex:i}=o();e({project:{...r,files:r.files.filter((e,o)=>t!==o)}}),t<=i&&e({currentFileIndex:Math.max(0,i-1)})}}))(...e),setGraph:async({nodes:e,edges:o})=>{let{patch:r,createNodes:i,createEdges:n,setNodesAndEdges:l,nodes:a,edges:s}=t();l({nodes:[],edges:[]}),await i(e),n(o)},clearGraph:()=>{let{setGraph:e}=t();e({nodes:[],edges:[]})},createNodes:async e=>{let{createNode:o}=t();await Promise.all(e.map(e=>o(e)))},createNode:e=>{let{addNode:o,nodesConfiguration:r}=t(),{type:i,id:n,data:l}=e;if(void 0===i)throw Error(`node type is not defined for node: ${n}`);o({...e,data:{...l,config:{...r[i]?.defaultConfig,...l?.config}}})},removeNode:e=>t().removeNodes([e]),removeNodes:e=>{let{edges:r,nodes:i,onNodesDelete:n,removeEdges:l,removeNodesFromControlPanel:a}=t(),s=e.map(({id:e})=>e),d=[...e,...i.filter(({parentId:e})=>e&&s.includes(e))];a(d),l(f(d,r)),n(d);let c=d.map(({id:e})=>e);o({nodes:i.filter(({id:e})=>!c.includes(e))})},removeEdges:e=>{let{edges:r,onEdgesDelete:i}=t(),n=e.map(({id:e})=>e);i(e),o({edges:r.filter(({id:e})=>!n.includes(e))})},createEdges:e=>{let{patch:o,edges:r,setEdges:i}=t();i(e)},onConnect:async e=>{let{edges:o,createEdges:r}=t();r(v(e,o))},onEdgesDelete:e=>{let{patch:o}=t()},onNodesDelete:async e=>{let{removeNodesFromControlPanel:o,patch:r}=t();o(e)},plugins:[],setPlugins:async e=>{let{setNodeTypes:r}=t();o({plugins:e});let i=e.reduce((e,o)=>({...e,...o.components.reduce((e,o)=>({...e,[o.type]:o}),{})}),{}),n=Object.keys(i).reduce((e,o)=>({...e,[o]:i[o].node}),{});k(Object.keys(i).reduce((e,o)=>({...e,[o]:i[o].audioNode}),{})),r(n),o(({nodesConfiguration:e})=>({nodesConfiguration:{...e,...i}}))},nodesConfiguration:{},config:{showMinimap:!1},setConfig:e=>{o(({config:o})=>({config:{...o,...e}}))},getEditorState:()=>{let{getNodesAndEdges:e,controlPanel:o,viewport:r}=t();return{...e(),controlPanel:o,viewport:r}},setEditorState:async({nodes:e,edges:r,controlPanel:i,viewport:n})=>{let{setGraph:l}=t();await l({nodes:e,edges:r}),await new Promise(e=>setTimeout(e,1e3)),o({controlPanel:i,viewport:n})},isHelpShown:!1,toggleHelp:()=>{let{isHelpShown:e}=t();o({isHelpShown:!e})},copyBuffer:{nodes:[],edges:[]},copy:e=>{o({copyBuffer:e})},copySelectedItems:()=>{let{nodes:e,edges:o,copy:r}=t(),i=e.filter(({selected:e})=>e),n=o.filter(({selected:e})=>e);i.length&&r({nodes:i,edges:n})},pasteBuffer:(e=0,r=0)=>{let{copyBuffer:i,createNodes:n,setEdges:l,nodes:a,edges:s}=t(),{nodes:d,edges:c}=i;if(!d.length)return;o({nodes:a.map(e=>({...e,selected:!1}))});let h=d.reduce((e,o)=>!e||o.position.x<e.position.x&&o.position.y<e.position.y?o:e),p=h.position.x-e,m=h.position.y-r,{nodes:g,mapping:u}=d.reduce((e,o)=>{let t,r=(t=+new Date+Math.floor(1e3*Math.random()),o?.type?`${o.type}-${t}`:t.toString());return{nodes:[...e.nodes,{...o,id:r,position:{x:o.position.x-p,y:o.position.y-m},selected:!0}],mapping:{...e.mapping,[o.id]:r}}},{nodes:[],mapping:{}});n(g);let f=c.map(e=>{let o=u[e.source]||e.source,t=u[e.target]||e.target;return{...e,id:e.id.replace(e.source,o).replace(e.target,t),source:o,target:t,selected:!0}});l([...s.map(e=>({...e,selected:!1})),...f])},getControlPanelNode:e=>{let{nodesConfiguration:o}=t(),{type:r}=e;if(!r)return null;let i=o[r]?.controlPanelNode;return i||(console.error(`could not find node for type ${r}`),null)},controlPanel:{show:!0,nodes:[],size:{width:200,height:100}},showControlPanel:()=>o(({controlPanel:e})=>({controlPanel:{...e,show:!0}})),hideControlPanel:()=>o(({controlPanel:e})=>({controlPanel:{...e,show:!1}})),addNodeToControlPanel:e=>{let{nodesConfiguration:r}=t(),i=e.type?r[e.type]?.defaultConfig:{},{height:n}=i?.size||{},l={id:e.id,...n?{height:n/X.rowHeight}:{}};o(({controlPanel:e})=>({controlPanel:{...e,nodes:[...e.nodes,l]}}))},removeNodeFromControlPanel:e=>t().removeNodesFromControlPanel([e]),removeNodesFromControlPanel:e=>{let t=e.map(({id:e})=>e);o(({controlPanel:e})=>{let o=e.nodes.filter(({id:e})=>!t.includes(e));return{controlPanel:{...e,nodes:o}}})},setControlPanelNodes:e=>{o(({controlPanel:o})=>({controlPanel:{...o,nodes:e}}))},setControlPanelSize:e=>{o(({controlPanel:o})=>({controlPanel:{...o,size:e}}))},viewport:{x:0,y:0,zoom:1},setViewport:e=>o({viewport:e})}},o=(o,t,r)=>{let i,n,l,a=(n=N({propertyFilter:(e,o)=>!!(o.parent?.parent?.childName==="controlPanel"||["data","position","controlPanel"].includes(o.parent?.childName))||["controlPanel","size","edges","nodes","data","label","config","values","position","x","y"].includes(e)}),l=t(),(e,o)=>{e.currentFileIndex!==o.currentFileIndex&&t().history.clear(),clearTimeout(i),l||(l=o),i=setTimeout(()=>{let o=n.diff(l,e);l=null,o&&t().history.push(o)},500)});return r.subscribe(a),e((...e)=>o(...e),t,r)},(e,t,r)=>{r.subscribe(async(e,o)=>{});let i={...t(),nodes:[],edges:[]},n=Promise.resolve();return o((...o)=>{n=n.then(async()=>{let r=t(),[n]=o,l={...i,..."function"==typeof n?n({...i}):n},a=Q(i.nodes,l.nodes),s=Q(i.edges,l.edges);i=l;let d=a.added,c=s.added,h=s.removed,p=a.removed,{patch:m}=r;d.length&&await m.registerAudioNodes(d),c.length&&m.registerAudioConnections(c),h.length&&m.unregisterAudioConnections(h),p.length&&m.unregisterAudioNodes(p),e(...o)}).catch(e=>{console.error("audioPatch middleware error:",e)})},t,r)})),_`
+`,U=({children:e,onClose:o,...i})=>{let l=G();return n(()=>{let e=e=>{"Escape"===e.key&&o?.()};return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}},[o]),d(t(W,{theme:l,onClick:o,children:r(B,{...i,onClick:e=>{e.stopPropagation()},theme:l,children:[e,t(V,{theme:l,onClick:o})]})}),document.body)};var J={};L(J,"DRAG_HANDLE_CLASS",()=>K),L(J,"DRAG_HANDLE_SELECTOR",()=>Y),L(J,"CONTROL_PANEL_GRID_CONFIG",()=>X),L(J,"PortType",()=>M);let K="web-noise-drag-handle",Y=`.${K}`,X={rowHeight:10,cols:4};(D=M||(M={})).Gate="gate",D.Number="number",D.Audio="audio",D.Any="any";let q=e=>JSON.parse(JSON.stringify(e)),Q=(e,o)=>{let t=new Set(e.map(e=>e.id)),r=new Set(o.map(e=>e.id));return{added:o.filter(e=>!t.has(e.id)),removed:e.filter(e=>!r.has(e.id))}};$((e=(...e)=>{let[o,t]=e;return{...((e,o)=>({nodes:[],edges:[],onNodesChange:o=>{e(({nodes:e})=>({nodes:b(o,e).map(e=>({dragHandle:Y,...e,data:{label:"unknown",...e.data}}))}))},onEdgesChange:o=>{e(({edges:e})=>({edges:x(o,e)}))},onConnect:o=>{e(({edges:e})=>({edges:v(o,e)}))},addNode:o=>{e(({nodes:e})=>({nodes:e.concat(o)}))},setNodes:o=>{e({nodes:o})},setEdges:o=>{e({edges:o})},setNodesAndEdges:({nodes:o,edges:t})=>{e({nodes:o,edges:t})},getNodesAndEdges:()=>{let{nodes:e,edges:t}=o();return{nodes:e,edges:t}},clearElements:()=>{e({nodes:[],edges:[]})},getNode:e=>{let{nodes:t}=o();return t.find(o=>o.id===e)||null},updateNodeData:(o,t)=>{e(({nodes:e})=>({nodes:e.map(e=>e.id===o?{...e,data:{...e.data,...t}}:e)}))},nodeTypes:{},setNodeTypes:o=>e({nodeTypes:o})}))(...e),...((e,o)=>({history:{maxHistoryLength:5,buffer:[],pointer:0,skipCollect:!1,push:t=>{let{history:r}=o(),{maxHistoryLength:i,skipCollect:n}=r;n?e({history:{...r,skipCollect:!1}}):e(({history:e})=>{if(!e)return{};let{buffer:o,pointer:r}=e,n=o.slice(Math.max(r-i+1,0),r);return{history:{...e,buffer:[...n,t],pointer:Math.min(r+1,i)}}})},back:()=>{let{nodes:t,edges:r,controlPanel:i,history:n}=o(),{buffer:l,pointer:a}=n,s=l[a-1];if(!s)return;let d=P(s);d&&e({...z(q({nodes:t,edges:r,controlPanel:i}),d),history:{...n,pointer:a-1,skipCollect:!0}})},forward:()=>{let{nodes:t,edges:r,controlPanel:i,history:n}=o(),{buffer:l,pointer:a}=n,s=l[a];s&&e({...z(q({nodes:t,edges:r,controlPanel:i}),s),history:{...n,pointer:a+1,skipCollect:!0}})},clear:()=>{let{history:t}=o();e({history:{...t,buffer:[],pointer:0,skipCollect:!0}})}}}))(...e),...((e,o)=>({patch:C(),nodesState:{}}))(...e),...((e,o)=>({project:{files:[],currentFileIndex:0},setProject(o){e({project:o})},getProject:()=>o().project,pullEditorChanges(){let{getEditorState:e,updateFileContent:t,project:r}=o(),i=r.currentFileIndex||0,n=r.files[i];"audio"!==n.type&&t(i,{...n,file:e()})},syncEditorWithCurrentFile:()=>{let{setEditorState:e,project:t}=o(),r=t.currentFileIndex||0,i=t.files[r];i?"audio"===i.type?console.log("audio file. skipping"):e(i.file):console.warn("No current file to sync with editor")},setCurrentFileIndex(t){let{project:r,getProject:i}=o();t!==(r.currentFileIndex??0)&&e({project:{...r,currentFileIndex:t}})},updateFileContent(t,r){let{project:i}=o();e({project:{...i,files:i.files.map((e,o)=>o===t?{...e,...r}:e)}})},updateFileName(t,r){let{project:i}=o();e({project:{...i,files:i.files.map((e,o)=>o===t?{...e,name:r}:e)}})},addFile(e){let{project:t,setProject:r}=o(),i=[...t.files,e];r({...t,files:i,currentFileIndex:i.length-1})},deleteFile:t=>{let{project:r}=o(),i=r.currentFileIndex??0,n=i===r.files.length-1?Math.max(0,i-1):i,l=r.files.filter((e,o)=>t!==o);e({project:{...r,files:l,currentFileIndex:n}})}}))(...e),setGraph:async({nodes:e,edges:o})=>{let{patch:r,createNodes:i,createEdges:n,setNodesAndEdges:l,nodes:a,edges:s}=t();l({nodes:[],edges:[]}),await i(e),n(o)},clearGraph:()=>{let{setGraph:e}=t();e({nodes:[],edges:[]})},createNodes:async e=>{let{createNode:o}=t();await Promise.all(e.map(e=>o(e)))},createNode:e=>{let{addNode:o,nodesConfiguration:r}=t(),{type:i,id:n,data:l}=e;if(void 0===i)throw Error(`node type is not defined for node: ${n}`);o({...e,data:{...l,config:{...r[i]?.defaultConfig,...l?.config}}})},removeNode:e=>t().removeNodes([e]),removeNodes:e=>{let{edges:r,nodes:i,onNodesDelete:n,removeEdges:l,removeNodesFromControlPanel:a}=t(),s=e.map(({id:e})=>e),d=[...e,...i.filter(({parentId:e})=>e&&s.includes(e))];a(d),l(f(d,r)),n(d);let c=d.map(({id:e})=>e);o({nodes:i.filter(({id:e})=>!c.includes(e))})},removeEdges:e=>{let{edges:r,onEdgesDelete:i}=t(),n=e.map(({id:e})=>e);i(e),o({edges:r.filter(({id:e})=>!n.includes(e))})},createEdges:e=>{let{patch:o,edges:r,setEdges:i}=t();i(e)},onConnect:async e=>{let{edges:o,createEdges:r}=t();r(v(e,o))},onEdgesDelete:e=>{let{patch:o}=t()},onNodesDelete:async e=>{let{removeNodesFromControlPanel:o,patch:r}=t();o(e)},plugins:[],setPlugins:async e=>{let{setNodeTypes:r}=t();o({plugins:e});let i=e.reduce((e,o)=>({...e,...o.components.reduce((e,o)=>({...e,[o.type]:o}),{})}),{}),n=Object.keys(i).reduce((e,o)=>({...e,[o]:i[o].node}),{});k(Object.keys(i).reduce((e,o)=>({...e,[o]:i[o].audioNode}),{})),r(n),o(({nodesConfiguration:e})=>({nodesConfiguration:{...e,...i}}))},nodesConfiguration:{},config:{showMinimap:!1},setConfig:e=>{o(({config:o})=>({config:{...o,...e}}))},getEditorState:()=>{let{getNodesAndEdges:e,controlPanel:o,viewport:r}=t();return{...e(),controlPanel:o,viewport:r}},setEditorState:async({nodes:e,edges:r,controlPanel:i,viewport:n})=>{let{setGraph:l}=t();await l({nodes:e,edges:r}),await new Promise(e=>setTimeout(e,1e3)),o({controlPanel:i,viewport:n})},isHelpShown:!1,toggleHelp:()=>{let{isHelpShown:e}=t();o({isHelpShown:!e})},copyBuffer:{nodes:[],edges:[]},copy:e=>{o({copyBuffer:e})},copySelectedItems:()=>{let{nodes:e,edges:o,copy:r}=t(),i=e.filter(({selected:e})=>e),n=o.filter(({selected:e})=>e);i.length&&r({nodes:i,edges:n})},pasteBuffer:(e=0,r=0)=>{let{copyBuffer:i,createNodes:n,setEdges:l,nodes:a,edges:s}=t(),{nodes:d,edges:c}=i;if(!d.length)return;o({nodes:a.map(e=>({...e,selected:!1}))});let h=d.reduce((e,o)=>!e||o.position.x<e.position.x&&o.position.y<e.position.y?o:e),p=h.position.x-e,m=h.position.y-r,{nodes:g,mapping:u}=d.reduce((e,o)=>{let t,r=(t=+new Date+Math.floor(1e3*Math.random()),o?.type?`${o.type}-${t}`:t.toString());return{nodes:[...e.nodes,{...o,id:r,position:{x:o.position.x-p,y:o.position.y-m},selected:!0}],mapping:{...e.mapping,[o.id]:r}}},{nodes:[],mapping:{}});n(g);let f=c.map(e=>{let o=u[e.source]||e.source,t=u[e.target]||e.target;return{...e,id:e.id.replace(e.source,o).replace(e.target,t),source:o,target:t,selected:!0}});l([...s.map(e=>({...e,selected:!1})),...f])},getControlPanelNode:e=>{let{nodesConfiguration:o}=t(),{type:r}=e;if(!r)return null;let i=o[r]?.controlPanelNode;return i||(console.error(`could not find node for type ${r}`),null)},controlPanel:{show:!0,nodes:[],size:{width:200,height:100}},showControlPanel:()=>o(({controlPanel:e})=>({controlPanel:{...e,show:!0}})),hideControlPanel:()=>o(({controlPanel:e})=>({controlPanel:{...e,show:!1}})),addNodeToControlPanel:e=>{let{nodesConfiguration:r}=t(),i=e.type?r[e.type]?.defaultConfig:{},{height:n}=i?.size||{},l={id:e.id,...n?{height:n/X.rowHeight}:{}};o(({controlPanel:e})=>({controlPanel:{...e,nodes:[...e.nodes,l]}}))},removeNodeFromControlPanel:e=>t().removeNodesFromControlPanel([e]),removeNodesFromControlPanel:e=>{let t=e.map(({id:e})=>e);o(({controlPanel:e})=>{let o=e.nodes.filter(({id:e})=>!t.includes(e));return{controlPanel:{...e,nodes:o}}})},setControlPanelNodes:e=>{o(({controlPanel:o})=>({controlPanel:{...o,nodes:e}}))},setControlPanelSize:e=>{o(({controlPanel:o})=>({controlPanel:{...o,size:e}}))},viewport:{x:0,y:0,zoom:1},setViewport:e=>o({viewport:e})}},o=(o,t,r)=>{let i,n,l,a=(n=N({propertyFilter:(e,o)=>!!(o.parent?.parent?.childName==="controlPanel"||["data","position","controlPanel"].includes(o.parent?.childName))||["controlPanel","size","edges","nodes","data","label","config","values","position","x","y"].includes(e)}),l=t(),(e,o)=>{e.project.currentFileIndex!==o.project.currentFileIndex&&t().history.clear(),clearTimeout(i),l||(l=o),i=setTimeout(()=>{let o=n.diff(l,e);l=null,o&&t().history.push(o)},500)});return r.subscribe(a),e((...e)=>o(...e),t,r)},(e,t,r)=>{r.subscribe(async(e,o)=>{});let i={...t(),nodes:[],edges:[]},n=Promise.resolve();return o((...o)=>{n=n.then(async()=>{let r=t(),[n]=o,l={...i,..."function"==typeof n?n({...i}):n},a=Q(i.nodes,l.nodes),s=Q(i.edges,l.edges);i=l;let d=a.added,c=s.added,h=s.removed,p=a.removed,{patch:m}=r;d.length&&await m.registerAudioNodes(d),c.length&&m.registerAudioConnections(c),h.length&&m.unregisterAudioConnections(h),p.length&&m.unregisterAudioNodes(p),e(...o)}).catch(e=>{console.error("audioPatch middleware error:",e)})},t,r)})),_`
   .react-flow {
     .react-flow__pane {
     /* background: rgb(106 106 106); */
@@ -71,11 +71,11 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
     } */
   }
 
-`;let Z=i(E)``;g(i(Z)`
+`;let Z=i(j)``;g(i(Z)`
   .react-contexify__item__content {
     color: ${({theme:e})=>e.colors.error};
   }
-`),i(j)`
+`),i(E)`
   background: ${({colors:e})=>e.elevation2};
   padding: 0;
   border-radius: 0;
@@ -721,6 +721,9 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
   &:hover {
     color: ${({theme:e})=>e.colors.whitePrimary};
   }
+  ${({hide:e})=>e?`
+    display: none;
+                   `:""};
 `);let ef=i.div`
   display: flex;
   align-items: center;
@@ -848,7 +851,7 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
   &::-webkit-scrollbar-thumb:hover {
     background: ${({theme:e})=>e.colors.highlight1};
   }
-`),eE=g(i.div`
+`),ej=g(i.div`
   padding: 0.4rem 0.5rem;
   cursor: pointer;
   color: ${({theme:e})=>e.colors.highlight1};
@@ -860,7 +863,7 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
     background-color: ${({theme:e})=>e.colors.elevation3};
     color: ${({theme:e})=>e.colors.highlight2};
   }
-`),ej=i.div`
+`),eE=i.div`
   font-size: 0.85em;
   opacity: 0.7;
   margin-top: 2px;
@@ -872,7 +875,7 @@ let e,o;import{jsx as t,jsxs as r}from"react/jsx-runtime";import i from"@emotion
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-`,eF=({value:e="",placeholder:o="",onSubmit:i=()=>{},options:d=[],...c})=>{let[h,p]=l(e),[m,g]=l(!1),[u,f]=l(-1),v=s(null),b=s(null),x=d.filter(e=>""===h||e.value.toLowerCase().includes(h.toLowerCase())||e.label?.toLowerCase().includes(h.toLowerCase())),w=a(()=>{i(h),g(!1),f(-1)},[h,i]),y=a(e=>{p(e.value),i(e.value),g(!1),f(-1)},[i]),$=a(e=>{switch(e.key){case"Escape":g(!1),f(-1);break;case"Enter":m&&u>=0&&x[u]?(e.preventDefault(),y(x[u])):w();break;case"ArrowDown":e.preventDefault(),m?f(e=>e<x.length-1?e+1:e):(g(!0),f(0));break;case"ArrowUp":e.preventDefault(),m&&f(e=>e>0?e-1:e)}},[w,m,u,x,y]);return n(()=>{let e=e=>{b.current&&!b.current.contains(e.target)&&v.current&&!v.current.contains(e.target)&&(g(!1),f(-1))};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]),n(()=>{if(u>=0&&b.current){let e=b.current.children[u];e&&e.scrollIntoView({block:"nearest",behavior:"smooth"})}},[u]),r(eN,{children:[r(ek,{children:[t(eC,{...c,ref:v,value:h,placeholder:o,onKeyDown:$,onChange:e=>{p(e.target.value),g(!0),f(-1)},onFocus:()=>{d.length>0&&g(!0)},onBlur:()=>{setTimeout(()=>{g(!1),f(-1)},200)},autoComplete:"off"}),t(ez,{onClick:w,children:t(A,{})})]}),d.length>0&&t(e_,{ref:b,isOpen:m&&x.length>0,children:x.map((e,o)=>r(eE,{isHighlighted:o===u,onClick:()=>y(e),onMouseEnter:()=>f(o),children:[t(eS,{children:e.label||e.value}),e.value&&t(ej,{children:e.value})]},e.value+o))})]})},eA=i(ek)`
+`,eF=({value:e="",placeholder:o="",onSubmit:i=()=>{},options:d=[],...c})=>{let[h,p]=l(e),[m,g]=l(!1),[u,f]=l(-1),v=s(null),b=s(null),x=d.filter(e=>""===h||e.value.toLowerCase().includes(h.toLowerCase())||e.label?.toLowerCase().includes(h.toLowerCase())),w=a(()=>{i(h),g(!1),f(-1)},[h,i]),y=a(e=>{p(e.value),i(e.value),g(!1),f(-1)},[i]),$=a(e=>{switch(e.key){case"Escape":g(!1),f(-1);break;case"Enter":m&&u>=0&&x[u]?(e.preventDefault(),y(x[u])):w();break;case"ArrowDown":e.preventDefault(),m?f(e=>e<x.length-1?e+1:e):(g(!0),f(0));break;case"ArrowUp":e.preventDefault(),m&&f(e=>e>0?e-1:e)}},[w,m,u,x,y]);return n(()=>{let e=e=>{b.current&&!b.current.contains(e.target)&&v.current&&!v.current.contains(e.target)&&(g(!1),f(-1))};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]),n(()=>{if(u>=0&&b.current){let e=b.current.children[u];e&&e.scrollIntoView({block:"nearest",behavior:"smooth"})}},[u]),r(eN,{children:[r(ek,{children:[t(eC,{...c,ref:v,value:h,placeholder:o,onKeyDown:$,onChange:e=>{p(e.target.value),g(!0),f(-1)},onFocus:()=>{d.length>0&&g(!0)},onBlur:()=>{setTimeout(()=>{g(!1),f(-1)},200)},autoComplete:"off"}),t(ez,{onClick:w,children:t(A,{})})]}),d.length>0&&t(e_,{ref:b,isOpen:m&&x.length>0,children:x.map((e,o)=>r(ej,{isHighlighted:o===u,onClick:()=>y(e),onMouseEnter:()=>f(o),children:[t(eS,{children:e.label||e.value}),e.value&&t(eE,{children:e.value})]},e.value+o))})]})},eA=i(ek)`
   gap: 0.5rem;
 `,eI=i(eC)`
   padding: 0;