@web-noise/core 0.0.6 → 0.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components.css +2 -0
- package/dist/components.css.map +1 -0
- package/dist/components.js +1147 -0
- package/dist/components.js.map +1 -0
- package/dist/lib.js +2 -0
- package/dist/lib.js.map +1 -0
- package/dist/main.js +81 -57
- package/dist/main.js.map +1 -1
- package/dist/module.js +132 -108
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +26 -1
package/dist/module.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{withTheme as i,ThemeProvider as l,Global as a,css as d,useTheme as s}from"@emotion/react";import c from"@emotion/styled";import{nanoid as p}from"nanoid";import{useState as h,useEffect as u,useMemo as g,useCallback as f,useRef as m}from"react";import{FaPlus as v}from"react-icons/fa6";import{MdClose as y,MdDragHandle as b,MdSettings as x,MdInfoOutline as w}from"react-icons/md";import"reactflow/dist/style.css";import C,{getConnectedEdges as $,addEdge as k,applyNodeChanges as N,applyEdgeChanges as P,useOnViewportChange as z,Background as j,BackgroundVariant as A,MiniMap as E,Controls as M,ReactFlowProvider as F,useReactFlow as S,Position as T,Handle as D,ControlButton as H,getBezierPath as O}from"reactflow";import{create as _}from"zustand";import{reverse as I,patch as W,create as L}from"jsondiffpatch";import{injectGlobal as R}from"@emotion/css";import{useContextMenu as B,Item as V,Menu as G,Separator as U}from"react-contexify";import"react-contexify/dist/ReactContexify.css";import J from"js-file-download";import X from"hotkeys-js";import{createPortal as Y}from"react-dom";import{FileDrop as q}from"react-file-drop";import{FaFileUpload as K,FaQuestion as Q,FaVolumeOff as Z,FaMap as ee,FaRegMap as eo}from"react-icons/fa";import{Resizable as et}from"re-resizable";import er from"react-grid-layout";import"react-grid-layout/css/styles.css";import{AiFillLock as en,AiFillUnlock as ei}from"react-icons/ai";import{RxDashboard as el}from"react-icons/rx";import ea from"react-modern-drawer";import"react-modern-drawer/dist/index.css";import{marked as ed}from"marked";function es(e){return e&&e.__esModule?e.default:e}let ec=[],ep={};let eh=new URL(es("data:application/javascript,class%20e%20extends%20AudioWorkletProcessor%7Bprocess%28%29%7Breturn%210%7D%7DregisterProcessor%28%22dump-node-processor%22%2Ce%29%3Bexport%7Be%20as%20DumpNodeProcessor%7D%3B"),"file:///packages/patch/src/createPatch.ts"),eu="web-noise-drag-handle",eg=`.${eu}`,ef=10;(ex=ew||(ew={})).Gate="gate",ex.Number="number",ex.Audio="audio",ex.Any="any";let em=e=>JSON.parse(JSON.stringify(e)),ev=(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))}},ey=e=>!("type"in e)||"patch"===e.type,eb=e=>"audio"===e.type;var ex,ew,eC=_((e=(...e)=>{let[o,t]=e;return{...((e,o)=>({nodes:[],edges:[],onNodesChange:o=>{e(({nodes:e})=>({nodes:N(o,e).map(e=>({dragHandle:eg,...e}))}))},onEdgesChange:o=>{e(({edges:e})=>({edges:P(o,e)}))},onConnect:o=>{e(({edges:e})=>({edges:k(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:n,skipCollect:i}=r;if(i)return void e({history:{...r,skipCollect:!1}});e(({history:e})=>{if(!e)return{};let{buffer:o,pointer:r}=e,i=o.slice(Math.max(r-n+1,0),r);return{history:{...e,buffer:[...i,t],pointer:Math.min(r+1,n)}}})},back:()=>{let{nodes:t,edges:r,controlPanel:n,history:i}=o(),{buffer:l,pointer:a}=i,d=l[a-1];if(!d)return;let s=I(d);s&&e({...W(em({nodes:t,edges:r,controlPanel:n}),s),history:{...i,pointer:a-1,skipCollect:!0}})},forward:()=>{let{nodes:t,edges:r,controlPanel:n,history:i}=o(),{buffer:l,pointer:a}=i,d=l[a];d&&e({...W(em({nodes:t,edges:r,controlPanel:n}),d),history:{...i,pointer:a+1,skipCollect:!0}})},clear:()=>{let{history:t}=o();e({history:{...t,buffer:[],pointer:0,skipCollect:!0}})}}}))(...e),...((e,o)=>({patch:((e=new AudioContext)=>{let o=e.audioWorklet.addModule(eh).then(()=>new AudioWorkletNode(e,"dump-node-processor")),t=new Map,r=new Map,n=async r=>{let{id:n,type:i,data:l}=r;if(!i)return void t.set(n,{loading:!1,error:Error(`Node: ${n} has no type`),node:null});let a=ep[i];if(!1!==a){if(!a)return void t.set(n,{loading:!1,error:Error(`Could not find handler for audio type ${i}`),node:null});t.set(n,{loading:!0,error:null,node:null});try{let r=await a(e,l),i=await o;t.set(n,{loading:!1,error:null,node:r}),Object.values(r.outputs||[]).forEach(({port:e})=>{i&&(e instanceof AudioWorkletNode&&e.connect(i),Array.isArray(e)&&e[0]instanceof AudioWorkletNode&&e[0].connect(i,e[1]))})}catch(e){t.set(n,{loading:!1,error:e,node:null})}}},i=async e=>Promise.all(e.map(n)),l=e=>{let{id:o,data:r}=e,n=t.get(o);if(!n)return void console.error(`Audio node #${o} does not exist`);let{loading:i,error:l,node:a}=n;return i?void console.error(`Audio node #${o} is yet not loaded`):l?void console.error(`Audio node #${o} is in error state: ${l.toString()}`):void(a.destroy&&a.destroy(),Object.values(a.inputs||{}).forEach(({port:e})=>e instanceof AudioNode&&e.disconnect&&e.disconnect()),Object.values(a.outputs||{}).forEach(({port:e})=>e instanceof AudioNode&&e.disconnect&&e.disconnect()),t.delete(o))},a=e=>{let{source:o,sourceHandle:n,target:i,targetHandle:l,id:a}=e,{node:d}=t.get(o)||{};if(!d)return void console.error(`can't find source node ${o}`);if(!n)return void console.error(`source handle is not defined in node ${o}`);let s=d.outputs?.[n],c=s?.port,{node:p}=t.get(i)||{};if(!p)return void console.error(`can't find target node ${p}`);if(!l)return void console.error(`source handle is not defined in node ${d}`);let h=p.inputs?.[l],u=h?.port;if(!c)return void console.error(`Can't find output port: ${o}:${n}`);if(!u)return void console.error(`Can't find input port: ${i}:${l}`);let g=u instanceof AudioNode,f=u instanceof AudioParam,m=u instanceof Array,v=g||f,y=c instanceof AudioNode,b=c instanceof Array;y&&v?c.connect(u):y&&m?c.connect(u[0],0,u[1]):b&&v?c[0].connect(u,c[1]):b&&m?c[0].connect(u[0],c[1],u[1]):(console.log(c,u),console.error("ports can be only AudioNode or AudioNodeChannel")),r.set(a,{output:s,input:h})},d=e=>{let{id:o,data:t}=e,n=r.get(o);if(!n)return void console.error(`can't find connection with id: ${o}`);let{input:{port:i},output:{port:l}}=n,a=i instanceof AudioNode,d=i instanceof AudioParam,s=i instanceof Array,c=a||d,p=l instanceof AudioNode,h=l instanceof Array;if(p&&c)l.disconnect(i);else if(p&&s)l.disconnect(i[0],0,i[1]);else if(h&&c)l[0].disconnect(i,l[1]);else if(h&&s)l[0].disconnect(i[0],l[1],i[1]);else throw console.log(l,i),Error("output port can not be only AudioNode or AudioNodeChannel");r.delete(o)};return{audioContext:e,audioNodes:t,registerAudioNode:n,registerAudioNodes:i,unregisterAudioNode:l,unregisterAudioNodes:e=>e.map(l),audioConnections:r,registerAudioConnection:a,registerAudioConnections:e=>e.map(a),unregisterAudioConnection:d,unregisterAudioConnections:e=>e.map(d)}})(),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:n}=o(),i=n.files[t];eb(i)||r(t,{...i,file:e()})},syncEditorWithCurrentFile:()=>{let{currentFileIndex:e,setEditorState:t,project:r}=o(),n=r.files[e];if("audio"===n.type)return void console.log("audio file. skipping");t(n.file)},currentFileIndex:0,setCurrentFileIndex(t){let{currentFileIndex:r}=o();t!==r&&e({currentFileIndex:t})},updateFileContent(t,r){let{project:n}=o();e({project:{...n,files:n.files.map((e,o)=>o===t?{...e,...r}:e)}})},updateFileName(t,r){let{project:n}=o();e({project:{...n,files:n.files.map((e,o)=>o===t?{...e,name:r}:e)}})},addFile(t){let{project:r}=o(),n=[...r.files,t];e({project:{...r,files:n}})},deleteFile:t=>{let{project:r,currentFileIndex:n}=o();e({project:{...r,files:r.files.filter((e,o)=>t!==o)}}),t<=n&&e({currentFileIndex:n-1})}}))(...e),setGraph:async({nodes:e,edges:o})=>{let{patch:r,createNodes:n,createEdges:i,setNodesAndEdges:l,nodes:a,edges:d}=t();l({nodes:[],edges:[]}),await n(e),i(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:n,id:i,data:l}=e;if(void 0===n)throw Error(`node type is not defined for node: ${i}`);o({...e,data:{...l,config:{...r[n]?.defaultConfig,...l?.config}}})},removeNode:e=>t().removeNodes([e]),removeNodes:e=>{let{edges:r,nodes:n,onNodesDelete:i,removeEdges:l,removeNodesFromControlPanel:a}=t(),d=e.map(({id:e})=>e),s=[...e,...n.filter(({parentNode:e})=>e&&d.includes(e))];a(s),l($(s,r)),i(s);let c=s.map(({id:e})=>e);o({nodes:n.filter(({id:e})=>!c.includes(e))})},removeEdges:e=>{let{edges:r,onEdgesDelete:n}=t(),i=e.map(({id:e})=>e);n(e),o({edges:r.filter(({id:e})=>!i.includes(e))})},createEdges:e=>{let{patch:o,edges:r,setEdges:n}=t();n(e)},onConnect:async e=>{let{edges:o,createEdges:r}=t();r(k(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 n=e.reduce((e,o)=>({...e,...o.components.reduce((e,o)=>({...e,[o.type]:o}),{})}),{}),i=Object.keys(n).reduce((e,o)=>({...e,[o]:n[o].node}),{});Object.assign(ep,Object.keys(n).reduce((e,o)=>({...e,[o]:n[o].audioNode}),{})),r(i),o(({nodesConfiguration:e})=>({nodesConfiguration:{...e,...n}}))},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:n,viewport:i})=>{let{setGraph:l}=t();await l({nodes:e,edges:r}),await new Promise(e=>setTimeout(e,1e3)),o({controlPanel:n,viewport:i})},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(),n=e.filter(({selected:e})=>e),i=o.filter(({selected:e})=>e);n.length&&r({nodes:n,edges:i})},pasteBuffer:(e=0,r=0)=>{let{copyBuffer:n,createNodes:i,setEdges:l,nodes:a,edges:d}=t(),{nodes:s,edges:c}=n;if(!s.length)return;o({nodes:a.map(e=>({...e,selected:!1}))});let p=s.reduce((e,o)=>!e||o.position.x<e.position.x&&o.position.y<e.position.y?o:e),h=p.position.x-e,u=p.position.y-r,{nodes:g,mapping:f}=s.reduce((e,o)=>{let t=(e=>{let o=+new Date+Math.floor(1e3*Math.random());return e?.type?`${e.type}-${o}`:o.toString()})(o);return{nodes:[...e.nodes,{...o,id:t,position:{x:o.position.x-h,y:o.position.y-u},selected:!0}],mapping:{...e.mapping,[o.id]:t}}},{nodes:[],mapping:{}});i(g);let m=c.map(e=>{let o=f[e.source]||e.source,t=f[e.target]||e.target;return{...e,id:e.id.replace(e.source,o).replace(e.target,t),source:o,target:t,selected:!0}});l([...d.map(e=>({...e,selected:!1})),...m])},getControlPanelNode:e=>{let{nodesConfiguration:o}=t(),{type:r}=e;if(!r)return null;let n=o[r]?.controlPanelNode;return n||(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(),n=e.type?r[e.type]?.defaultConfig:{},{height:i}=n?.size||{},l={id:e.id,...i?{height:i/ef}:{}};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 n=((e,o)=>{let t,r=L({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)}),n=o();return(e,i)=>{e.currentFileIndex!==i.currentFileIndex&&o().history.clear(),clearTimeout(t),n||(n=i),t=setTimeout(()=>{let t=r.diff(n,e);n=null,t&&o().history.push(t)},500)}})(0,t);return r.subscribe(n),e((...e)=>o(...e),t,r)},(e,t,r)=>{r.subscribe(async(e,o)=>{});let n=new Set,i={...t(),nodes:[],edges:[]};return o(async(...o)=>{let r=t(),[l]=o,a={...i,..."function"==typeof l?l({...i}):l},d=ev(i.nodes,a.nodes),s=ev(i.edges,a.edges);i=a;let c=d.added,p=s.added,h=s.removed,u=d.removed,{patch:g}=r;if(c.length){let e=g.registerAudioNodes(c);n.add(e),await e,n.delete(e)}if(!(p.length||h.length||u.length))return void e(...o);if(n.size)try{await Promise.all([...n.values()])}catch(e){console.log("some error",e)}p.length&&g.registerAudioConnections(p),h.length&&g.unregisterAudioConnections(h),u.length&&g.unregisterAudioNodes(u),e(...o)},t,r)})),e$={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}};R`
|
|
1
|
+
let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{withTheme as i,ThemeProvider as l,Global as a,css as s,useTheme as d}from"@emotion/react";import c from"@emotion/styled";import{nanoid as p}from"nanoid";import{useState as h,useEffect as u,useMemo as g,useCallback as f,useRef as m}from"react";import{FaPlus as v}from"react-icons/fa6";import{MdClose as y,MdDragHandle as x,MdSettings as b,MdInfoOutline as w}from"react-icons/md";import"reactflow/dist/style.css";import C,{getConnectedEdges as $,addEdge as k,applyNodeChanges as N,applyEdgeChanges as P,useOnViewportChange as z,Background as A,BackgroundVariant as j,MiniMap as E,Controls as M,ReactFlowProvider as F,useReactFlow as S,Position as T,Handle as D,ControlButton as H,getBezierPath as O}from"reactflow";import{create as _}from"zustand";import{reverse as I,patch as W,create as L}from"jsondiffpatch";import{injectGlobal as R}from"@emotion/css";import{useContextMenu as B,Item as V,Menu as G,Separator as U}from"react-contexify";import"react-contexify/dist/ReactContexify.css";import J from"js-file-download";import X from"hotkeys-js";import{createPortal as Y}from"react-dom";import{FileDrop as q}from"react-file-drop";import{FaFileUpload as K,FaQuestion as Q,FaVolumeOff as Z,FaMap as ee,FaRegMap as eo}from"react-icons/fa";import{Resizable as et}from"re-resizable";import er from"react-grid-layout";import"react-grid-layout/css/styles.css";import{AiFillLock as en,AiFillUnlock as ei}from"react-icons/ai";import{RxDashboard as el}from"react-icons/rx";import ea from"react-modern-drawer";import"react-modern-drawer/dist/index.css";import{marked as es}from"marked";function ed(e){return e&&e.__esModule?e.default:e}let ec=[],ep={};let eh=new URL(ed("data:application/javascript,class%20e%20extends%20AudioWorkletProcessor%7Bprocess%28%29%7Breturn%210%7D%7DregisterProcessor%28%22dump-node-processor%22%2Ce%29%3Bexport%7Be%20as%20DumpNodeProcessor%7D%3B"),"file:///packages/patch/src/createPatch.ts"),eu="web-noise-drag-handle",eg=`.${eu}`,ef=10;(eb=ew||(ew={})).Gate="gate",eb.Number="number",eb.Audio="audio",eb.Any="any";let em=e=>JSON.parse(JSON.stringify(e)),ev=(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))}},ey=e=>!("type"in e)||"patch"===e.type,ex=e=>"audio"===e.type;var eb,ew,eC=_((e=(...e)=>{let[o,t]=e;return{...((e,o)=>({nodes:[],edges:[],onNodesChange:o=>{e(({nodes:e})=>({nodes:N(o,e).map(e=>({dragHandle:eg,...e}))}))},onEdgesChange:o=>{e(({edges:e})=>({edges:P(o,e)}))},onConnect:o=>{e(({edges:e})=>({edges:k(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:n,skipCollect:i}=r;if(i)return void e({history:{...r,skipCollect:!1}});e(({history:e})=>{if(!e)return{};let{buffer:o,pointer:r}=e,i=o.slice(Math.max(r-n+1,0),r);return{history:{...e,buffer:[...i,t],pointer:Math.min(r+1,n)}}})},back:()=>{let{nodes:t,edges:r,controlPanel:n,history:i}=o(),{buffer:l,pointer:a}=i,s=l[a-1];if(!s)return;let d=I(s);d&&e({...W(em({nodes:t,edges:r,controlPanel:n}),d),history:{...i,pointer:a-1,skipCollect:!0}})},forward:()=>{let{nodes:t,edges:r,controlPanel:n,history:i}=o(),{buffer:l,pointer:a}=i,s=l[a];s&&e({...W(em({nodes:t,edges:r,controlPanel:n}),s),history:{...i,pointer:a+1,skipCollect:!0}})},clear:()=>{let{history:t}=o();e({history:{...t,buffer:[],pointer:0,skipCollect:!0}})}}}))(...e),...((e,o)=>({patch:((e=new AudioContext)=>{let o=e.audioWorklet.addModule(eh).then(()=>new AudioWorkletNode(e,"dump-node-processor")),t=new Map,r=new Map,n=async r=>{let{id:n,type:i,data:l}=r;if(!i)return void t.set(n,{loading:!1,error:Error(`Node: ${n} has no type`),node:null});let a=ep[i];if(!1!==a){if(!a)return void t.set(n,{loading:!1,error:Error(`Could not find handler for audio type ${i}`),node:null});t.set(n,{loading:!0,error:null,node:null});try{let r=await a(e,l),i=await o;t.set(n,{loading:!1,error:null,node:r}),Object.values(r.outputs||[]).forEach(({port:e})=>{i&&(e instanceof AudioWorkletNode&&e.connect(i),Array.isArray(e)&&e[0]instanceof AudioWorkletNode&&e[0].connect(i,e[1]))})}catch(e){t.set(n,{loading:!1,error:e,node:null})}}},i=async e=>Promise.all(e.map(n)),l=e=>{let{id:o,data:r}=e,n=t.get(o);if(!n)return void console.error(`Audio node #${o} does not exist`);let{loading:i,error:l,node:a}=n;return i?void console.error(`Audio node #${o} is yet not loaded`):l?void console.error(`Audio node #${o} is in error state: ${l.toString()}`):void(a.destroy&&a.destroy(),Object.values(a.inputs||{}).forEach(({port:e})=>e instanceof AudioNode&&e.disconnect&&e.disconnect()),Object.values(a.outputs||{}).forEach(({port:e})=>e instanceof AudioNode&&e.disconnect&&e.disconnect()),t.delete(o))},a=e=>{let{source:o,sourceHandle:n,target:i,targetHandle:l,id:a}=e,{node:s}=t.get(o)||{};if(!s)return void console.error(`can't find source node ${o}`);if(!n)return void console.error(`source handle is not defined in node ${o}`);let d=s.outputs?.[n],c=d?.port,{node:p}=t.get(i)||{};if(!p)return void console.error(`can't find target node ${p}`);if(!l)return void console.error(`source handle is not defined in node ${s}`);let h=p.inputs?.[l],u=h?.port;if(!c)return void console.error(`Can't find output port: ${o}:${n}`);if(!u)return void console.error(`Can't find input port: ${i}:${l}`);let g=u instanceof AudioNode,f=u instanceof AudioParam,m=u instanceof Array,v=g||f,y=c instanceof AudioNode,x=c instanceof Array;y&&v?c.connect(u):y&&m?c.connect(u[0],0,u[1]):x&&v?c[0].connect(u,c[1]):x&&m?c[0].connect(u[0],c[1],u[1]):(console.log(c,u),console.error("ports can be only AudioNode or AudioNodeChannel")),r.set(a,{output:d,input:h})},s=e=>{let{id:o,data:t}=e,n=r.get(o);if(!n)return void console.error(`can't find connection with id: ${o}`);let{input:{port:i},output:{port:l}}=n,a=i instanceof AudioNode,s=i instanceof AudioParam,d=i instanceof Array,c=a||s,p=l instanceof AudioNode,h=l instanceof Array;if(p&&c)l.disconnect(i);else if(p&&d)l.disconnect(i[0],0,i[1]);else if(h&&c)l[0].disconnect(i,l[1]);else if(h&&d)l[0].disconnect(i[0],l[1],i[1]);else throw console.log(l,i),Error("output port can not be only AudioNode or AudioNodeChannel");r.delete(o)};return{audioContext:e,audioNodes:t,registerAudioNode:n,registerAudioNodes:i,unregisterAudioNode:l,unregisterAudioNodes:e=>e.map(l),audioConnections:r,registerAudioConnection:a,registerAudioConnections:e=>e.map(a),unregisterAudioConnection:s,unregisterAudioConnections:e=>e.map(s)}})(),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:n}=o(),i=n.files[t];ex(i)||r(t,{...i,file:e()})},syncEditorWithCurrentFile:()=>{let{currentFileIndex:e,setEditorState:t,project:r}=o(),n=r.files[e];if("audio"===n.type)return void console.log("audio file. skipping");t(n.file)},currentFileIndex:0,setCurrentFileIndex(t){let{currentFileIndex:r}=o();t!==r&&e({currentFileIndex:t})},updateFileContent(t,r){let{project:n}=o();e({project:{...n,files:n.files.map((e,o)=>o===t?{...e,...r}:e)}})},updateFileName(t,r){let{project:n}=o();e({project:{...n,files:n.files.map((e,o)=>o===t?{...e,name:r}:e)}})},addFile(t){let{project:r}=o(),n=[...r.files,t];e({project:{...r,files:n}})},deleteFile:t=>{let{project:r,currentFileIndex:n}=o();e({project:{...r,files:r.files.filter((e,o)=>t!==o)}}),t<=n&&e({currentFileIndex:n-1})}}))(...e),setGraph:async({nodes:e,edges:o})=>{let{patch:r,createNodes:n,createEdges:i,setNodesAndEdges:l,nodes:a,edges:s}=t();l({nodes:[],edges:[]}),await n(e),i(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:n,id:i,data:l}=e;if(void 0===n)throw Error(`node type is not defined for node: ${i}`);o({...e,data:{...l,config:{...r[n]?.defaultConfig,...l?.config}}})},removeNode:e=>t().removeNodes([e]),removeNodes:e=>{let{edges:r,nodes:n,onNodesDelete:i,removeEdges:l,removeNodesFromControlPanel:a}=t(),s=e.map(({id:e})=>e),d=[...e,...n.filter(({parentNode:e})=>e&&s.includes(e))];a(d),l($(d,r)),i(d);let c=d.map(({id:e})=>e);o({nodes:n.filter(({id:e})=>!c.includes(e))})},removeEdges:e=>{let{edges:r,onEdgesDelete:n}=t(),i=e.map(({id:e})=>e);n(e),o({edges:r.filter(({id:e})=>!i.includes(e))})},createEdges:e=>{let{patch:o,edges:r,setEdges:n}=t();n(e)},onConnect:async e=>{let{edges:o,createEdges:r}=t();r(k(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 n=e.reduce((e,o)=>({...e,...o.components.reduce((e,o)=>({...e,[o.type]:o}),{})}),{}),i=Object.keys(n).reduce((e,o)=>({...e,[o]:n[o].node}),{});Object.assign(ep,Object.keys(n).reduce((e,o)=>({...e,[o]:n[o].audioNode}),{})),r(i),o(({nodesConfiguration:e})=>({nodesConfiguration:{...e,...n}}))},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:n,viewport:i})=>{let{setGraph:l}=t();await l({nodes:e,edges:r}),await new Promise(e=>setTimeout(e,1e3)),o({controlPanel:n,viewport:i})},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(),n=e.filter(({selected:e})=>e),i=o.filter(({selected:e})=>e);n.length&&r({nodes:n,edges:i})},pasteBuffer:(e=0,r=0)=>{let{copyBuffer:n,createNodes:i,setEdges:l,nodes:a,edges:s}=t(),{nodes:d,edges:c}=n;if(!d.length)return;o({nodes:a.map(e=>({...e,selected:!1}))});let p=d.reduce((e,o)=>!e||o.position.x<e.position.x&&o.position.y<e.position.y?o:e),h=p.position.x-e,u=p.position.y-r,{nodes:g,mapping:f}=d.reduce((e,o)=>{let t=(e=>{let o=+new Date+Math.floor(1e3*Math.random());return e?.type?`${e.type}-${o}`:o.toString()})(o);return{nodes:[...e.nodes,{...o,id:t,position:{x:o.position.x-h,y:o.position.y-u},selected:!0}],mapping:{...e.mapping,[o.id]:t}}},{nodes:[],mapping:{}});i(g);let m=c.map(e=>{let o=f[e.source]||e.source,t=f[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})),...m])},getControlPanelNode:e=>{let{nodesConfiguration:o}=t(),{type:r}=e;if(!r)return null;let n=o[r]?.controlPanelNode;return n||(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(),n=e.type?r[e.type]?.defaultConfig:{},{height:i}=n?.size||{},l={id:e.id,...i?{height:i/ef}:{}};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 n=((e,o)=>{let t,r=L({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)}),n=o();return(e,i)=>{e.currentFileIndex!==i.currentFileIndex&&o().history.clear(),clearTimeout(t),n||(n=i),t=setTimeout(()=>{let t=r.diff(n,e);n=null,t&&o().history.push(t)},500)}})(0,t);return r.subscribe(n),e((...e)=>o(...e),t,r)},(e,t,r)=>{r.subscribe(async(e,o)=>{});let n=new Set,i={...t(),nodes:[],edges:[]};return o(async(...o)=>{let r=t(),[l]=o,a={...i,..."function"==typeof l?l({...i}):l},s=ev(i.nodes,a.nodes),d=ev(i.edges,a.edges);i=a;let c=s.added,p=d.added,h=d.removed,u=s.removed,{patch:g}=r;if(c.length){let e=g.registerAudioNodes(c);n.add(e),await e,n.delete(e)}if(!(p.length||h.length||u.length))return void e(...o);if(n.size)try{await Promise.all([...n.values()])}catch(e){console.log("some error",e)}p.length&&g.registerAudioConnections(p),h.length&&g.unregisterAudioConnections(h),u.length&&g.unregisterAudioNodes(u),e(...o)},t,r)})),e$={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}};R`
|
|
2
2
|
.react-flow {
|
|
3
3
|
.react-flow__pane {
|
|
4
4
|
/* background: rgb(106 106 106); */
|
|
@@ -46,7 +46,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
46
46
|
} */
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
`;var ek=()=>
|
|
49
|
+
`;var ek=()=>d();let eN=c(V)``,eP=c(G)`
|
|
50
50
|
background: ${({colors:e})=>e.elevation2};
|
|
51
51
|
padding: 0;
|
|
52
52
|
border-radius: 0;
|
|
@@ -59,7 +59,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
59
59
|
background-color: ${({colors:e})=>e.elevation1};
|
|
60
60
|
margin: 0;
|
|
61
61
|
}
|
|
62
|
-
`,ez="editor-edge-menu";var
|
|
62
|
+
`,ez="editor-edge-menu";var eA=()=>{let e=ek(),o=eC(e=>e.removeEdges);return t(n,{children:t(eP,{id:ez,animation:!1,colors:e.colors,children:t(eN,{onClick:e=>o([e.props.edge]),children:"Delete Edge (DEL)"})})})};let ej=c.div`
|
|
63
63
|
position: fixed;
|
|
64
64
|
z-index: ${({theme:e})=>e.zIndex.modal};
|
|
65
65
|
width: 100%;
|
|
@@ -83,10 +83,67 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
83
83
|
top: 0.2rem;
|
|
84
84
|
right: 0.2rem;
|
|
85
85
|
cursor: pointer;
|
|
86
|
-
`;var eF=({children:e,onClose:o,...n})=>{let i=ek();return u(()=>{let e=e=>{"Escape"===e.key&&o?.()};return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}},[o]),Y(t(
|
|
86
|
+
`;var eF=({children:e,onClose:o,...n})=>{let i=ek();return u(()=>{let e=e=>{"Escape"===e.key&&o?.()};return document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}},[o]),Y(t(ej,{theme:i,onClick:o,children:r(eE,{...n,onClick:e=>{e.stopPropagation()},theme:i,children:[e,t(eM,{theme:i,onClick:o})]})}),document.body)};let eS=i(c.div`
|
|
87
|
+
width: 100%;
|
|
88
|
+
`),eT=i(c.div`
|
|
89
|
+
padding: 1rem;
|
|
90
|
+
display: flex;
|
|
91
|
+
flex-direction: column;
|
|
92
|
+
gap: 1rem;
|
|
93
|
+
`),eD=i(c.ul`
|
|
94
|
+
list-style: none;
|
|
95
|
+
margin: 0;
|
|
96
|
+
padding: 0;
|
|
97
|
+
padding-bottom: 10px;
|
|
98
|
+
columns: 2;
|
|
99
|
+
|
|
100
|
+
li {
|
|
101
|
+
display: flex;
|
|
102
|
+
flex-direction: column;
|
|
103
|
+
gap: 8px;
|
|
104
|
+
padding: 4px;
|
|
105
|
+
overflow: hidden;
|
|
106
|
+
border: 1px solid ${({theme:e})=>e.colors.elevation3};
|
|
107
|
+
border-radius: 4px;
|
|
108
|
+
margin-bottom: 0.5rem;
|
|
109
|
+
&:hover {
|
|
110
|
+
border-color: ${({theme:e})=>e.colors.accent2};
|
|
111
|
+
cursor: pointer;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
`),eH=i(c.div`
|
|
115
|
+
white-space: nowrap;
|
|
116
|
+
overflow: hidden;
|
|
117
|
+
text-overflow: ellipsis;
|
|
118
|
+
`),eO=i(c.div`
|
|
119
|
+
color: ${({theme:e})=>e.colors.highlight2};
|
|
120
|
+
font-size: 12px;
|
|
121
|
+
`),e_=i(c.div`
|
|
122
|
+
display: flex;
|
|
123
|
+
gap: 0.2rem;
|
|
124
|
+
flex-wrap: wrap;
|
|
125
|
+
`),eI=i(c.span`
|
|
126
|
+
cursor: pointer;
|
|
127
|
+
font-size: 10px;
|
|
128
|
+
background: ${({theme:e,isActive:o})=>o?e.colors.highlight1:e.colors.elevation3};
|
|
129
|
+
border-radius: 2px;
|
|
130
|
+
padding: 0.1rem 0.2rem;
|
|
131
|
+
border: 1px solid;
|
|
132
|
+
border-color: ${({theme:e})=>e.colors.elevation2};
|
|
133
|
+
&:hover {
|
|
134
|
+
border-color: ${({theme:e})=>e.colors.accent2};
|
|
135
|
+
}
|
|
136
|
+
`),eW=i(c.div``),eL=i(c.div`
|
|
137
|
+
font-size: 1.1rem;
|
|
138
|
+
padding: 0.25rem 0;
|
|
139
|
+
color: ${({theme:e})=>e.colors.highlight3};
|
|
140
|
+
`),eR=i(c.div`
|
|
141
|
+
color: ${({theme:e})=>e.colors.highlight2};
|
|
142
|
+
font-size: 12px;
|
|
143
|
+
`);var eB=({onComponentClick:e,filters:{plugin:o,search:n="",tags:i},onTagClick:l})=>{let a=eC(({plugins:e})=>e),s=g(()=>o?a.filter(({name:e})=>e===o):a,[a,o]);return t(eS,{children:g(()=>n||i?.length?s.map(e=>({...e,components:i?.length?e.components.filter(e=>i?.every(o=>e.tags?.includes(o))):e.components})).map(e=>({...e,components:e.components.filter(({type:e,name:o})=>e.toLocaleLowerCase().includes(n.toLocaleLowerCase())||o?.toLocaleLowerCase().includes(n.toLocaleLowerCase()))})):s,[s,n,i]).map(({name:o,description:n,components:a},s)=>a.length?r(eT,{children:[r(eW,{children:[t(eL,{children:o}),t(eR,{children:n})]}),t(eD,{children:a.sort((e,o)=>e.type.toLowerCase()>o.type.toLowerCase()?1:-1).map((o,n)=>r("li",{onClick:()=>e(o),children:[t(eH,{children:o.name||o.type}),o.description&&t(eO,{children:o.description}),t(e_,{children:o.tags?.map((e,o)=>t(eI,{isActive:i?.includes(e),onClickCapture:o=>{o.stopPropagation(),l(e)},children:e},o))})]},n))})]},s):null)})};let eV=c.div`
|
|
87
144
|
display: flex;
|
|
88
145
|
position: relative;
|
|
89
|
-
`,
|
|
146
|
+
`,eG=c.input`
|
|
90
147
|
padding-right: 2rem;
|
|
91
148
|
padding-left: 0.3rem;
|
|
92
149
|
width: 100%;
|
|
@@ -117,14 +174,14 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
117
174
|
-webkit-appearance: none;
|
|
118
175
|
margin-right: 1rem;
|
|
119
176
|
}
|
|
120
|
-
`,
|
|
177
|
+
`,eU=c.div`
|
|
121
178
|
display: flex;
|
|
122
179
|
flex-direction: column;
|
|
123
180
|
padding: 0.6rem;
|
|
124
181
|
gap: 0.6rem;
|
|
125
182
|
border-right: 1px solid ${({theme:e})=>e.colors.elevation3};
|
|
126
183
|
min-width: 14rem;
|
|
127
|
-
`,
|
|
184
|
+
`,eJ=c.label`
|
|
128
185
|
user-select: none;
|
|
129
186
|
input {
|
|
130
187
|
display: none;
|
|
@@ -136,58 +193,25 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
136
193
|
color: ${({theme:e})=>e.colors.accent3};
|
|
137
194
|
cursor: pointer;
|
|
138
195
|
}
|
|
139
|
-
|
|
140
|
-
width: 100%;
|
|
141
|
-
`),eI=i(c.div`
|
|
142
|
-
padding: 1rem;
|
|
143
|
-
display: flex;
|
|
144
|
-
flex-direction: column;
|
|
145
|
-
gap: 1rem;
|
|
146
|
-
`),eW=i(c.ul`
|
|
147
|
-
list-style: none;
|
|
148
|
-
margin: 0;
|
|
149
|
-
padding: 0;
|
|
150
|
-
padding-bottom: 10px;
|
|
151
|
-
columns: 2;
|
|
152
|
-
|
|
153
|
-
li {
|
|
154
|
-
display: flex;
|
|
155
|
-
flex-direction: column;
|
|
156
|
-
gap: 8px;
|
|
157
|
-
padding: 4px;
|
|
158
|
-
overflow: hidden;
|
|
159
|
-
border: 1px solid ${({theme:e})=>e.colors.elevation3};
|
|
160
|
-
border-radius: 4px;
|
|
161
|
-
margin-bottom: 0.5rem;
|
|
162
|
-
&:hover {
|
|
163
|
-
border-color: ${({theme:e})=>e.colors.accent2};
|
|
164
|
-
cursor: pointer;
|
|
165
|
-
}
|
|
166
|
-
}
|
|
167
|
-
`),eL=i(c.div`
|
|
168
|
-
white-space: nowrap;
|
|
169
|
-
overflow: hidden;
|
|
170
|
-
text-overflow: ellipsis;
|
|
171
|
-
`),eR=i(c.div`
|
|
172
|
-
color: ${({theme:e})=>e.colors.highlight2};
|
|
196
|
+
`,eX=i(c(eI)`
|
|
173
197
|
font-size: 12px;
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
`);var
|
|
198
|
+
padding: 0.2rem 0.4rem;
|
|
199
|
+
&:hover {
|
|
200
|
+
}
|
|
201
|
+
&::after {
|
|
202
|
+
content: "×";
|
|
203
|
+
margin-left: 0.4rem;
|
|
204
|
+
}
|
|
205
|
+
`);var eY=({onChange:e,value:o})=>{let n=ek(),i=eC(({plugins:e})=>e),l=m(null);return u(()=>{l.current&&l.current.focus()},[l]),r(eU,{theme:n,children:[t(eV,{children:t(eG,{ref:l,theme:n,value:o.search||"",placeholder:"search...",onChange:t=>e({...o,search:t.target.value})})}),t(e_,{children:o.tags?.map((r,n)=>t(eX,{isActive:!0,onClick:()=>{let t=o.tags?.filter(e=>e!==r)||[];e({...o,tags:t})},children:r},n))}),i.map(({name:i,components:l},a)=>i?r(eJ,{theme:n,children:[t("input",{type:"checkbox",name:"plugin",value:i,checked:i===o.plugin,onChange:()=>{e({...o,plugin:i===o.plugin?null:i})}}),t("span",{children:i})]},a):null)]})};let eq=c.div`
|
|
182
206
|
height: 100%;
|
|
183
207
|
width: 100%;
|
|
184
208
|
display: flex;
|
|
185
209
|
gap: 1rem;
|
|
186
|
-
`,
|
|
210
|
+
`,eK=c.div`
|
|
187
211
|
flex-grow: 1;
|
|
188
212
|
height: 100%;
|
|
189
213
|
overflow-y: scroll;
|
|
190
|
-
`;var
|
|
214
|
+
`;var eQ=({isOpen:e,closeMenu:o,mousePosition:n})=>{let i=ek(),{screenToFlowPosition:l}=S(),{createNode:a}=eC(({createNode:e})=>({createNode:e})),[s,d]=h({}),c=f(({type:e})=>{let{x:t,y:r}=l(n);a({id:`${e}-${+new Date}`,type:e,data:{label:e},position:{x:t,y:r},targetPosition:T.Left,sourcePosition:T.Right}),o()},[n,l,a,o,n]);return e?t(eF,{onClose:()=>{o(),d({})},children:r(eq,{theme:i,children:[t(eY,{onChange:d,value:s}),t(eK,{theme:i,children:t(eB,{filters:s,onTagClick:e=>{d(o=>({...o,tags:o.tags?.includes(e)?o.tags.filter(o=>o!==e):[...o.tags||[],e]}))},onComponentClick:e=>{c(e),d({})}})})]})}):null};let eZ=c.div`
|
|
191
215
|
display: flex;
|
|
192
216
|
align-items: center;
|
|
193
217
|
justify-content: center;
|
|
@@ -213,19 +237,19 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
213
237
|
.drop-zone-drag-over {
|
|
214
238
|
opacity: 1;
|
|
215
239
|
}
|
|
216
|
-
`,
|
|
240
|
+
`,e0=c.div`
|
|
217
241
|
display: flex;
|
|
218
242
|
flex-wrap: wrap;
|
|
219
243
|
align-items: center;
|
|
220
244
|
justify-content: center;
|
|
221
245
|
height: 100%;
|
|
222
246
|
width: 100%;
|
|
223
|
-
`,
|
|
247
|
+
`,e1=c(K)`
|
|
224
248
|
width: 100%;
|
|
225
249
|
height: 8rem;
|
|
226
|
-
`,
|
|
250
|
+
`,e2=c.div`
|
|
227
251
|
font-size: 2rem;
|
|
228
|
-
`;var
|
|
252
|
+
`;var e3=({isOpen:e,closeMenu:o})=>{let n=ek(),i=eC(({setGraph:e})=>e),l=eC(e=>e.setEditorState),a=m(null),s=f(e=>{let[t]=e||[];t.text().then(JSON.parse).then(e=>{l(e),o()}).catch(console.error)},[i,o]);return e?t(eF,{onClose:o,children:r(eZ,{theme:n,children:[t("input",{onChange:({target:{files:e}})=>s(e),ref:a,type:"file",className:"hidden",style:{display:"none"},accept:".json"}),t(q,{className:"drop-zone-wrapper",targetClassName:"drop-zone",draggingOverTargetClassName:"drop-zone-drag-over",onTargetClick:()=>{a.current?.click()},onDrop:e=>s(e),children:r(e0,{theme:n,children:[t(e1,{}),t(e2,{children:"click or drop file here"})]})})]})}):null};let e9=c.div`
|
|
229
253
|
display: flex;
|
|
230
254
|
align-items: center;
|
|
231
255
|
justify-content: center;
|
|
@@ -251,19 +275,19 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
251
275
|
.drop-zone-drag-over {
|
|
252
276
|
opacity: 1;
|
|
253
277
|
}
|
|
254
|
-
`,
|
|
278
|
+
`,e8=c.div`
|
|
255
279
|
display: flex;
|
|
256
280
|
flex-wrap: wrap;
|
|
257
281
|
align-items: center;
|
|
258
282
|
justify-content: center;
|
|
259
283
|
height: 100%;
|
|
260
284
|
width: 100%;
|
|
261
|
-
`,
|
|
285
|
+
`,e5=c(K)`
|
|
262
286
|
width: 100%;
|
|
263
287
|
height: 8rem;
|
|
264
|
-
`,
|
|
288
|
+
`,e4=c.div`
|
|
265
289
|
font-size: 2rem;
|
|
266
|
-
`;var
|
|
290
|
+
`;var e6=({isOpen:e,closeMenu:o})=>{let n=ek(),i=eC(e=>e.setProject),l=m(null),a=f(e=>{let[t]=e||[];t.text().then(JSON.parse).then(e=>{i(e),o()}).catch(console.error)},[i,o]);return e?t(eF,{onClose:o,children:r(e9,{theme:n,children:[t("input",{onChange:({target:{files:e}})=>a(e),ref:l,type:"file",className:"hidden",style:{display:"none"},accept:".json"}),t(q,{className:"drop-zone-wrapper",targetClassName:"drop-zone",draggingOverTargetClassName:"drop-zone-drag-over",onTargetClick:()=>{l.current?.click()},onDrop:e=>a(e),children:r(e8,{theme:n,children:[t(e5,{}),t(e4,{children:"click or drop file here"})]})})]})}):null};let e7="editor-menu";var oe=({editorContextMenu:e=[]})=>{let o=ek(),[i,l]=h({x:0,y:0}),[a,s]=h(!1),[d,c]=h(!1),[p,m]=h(!1),v=f((e,o)=>{l({x:e,y:o}),s(!0)},[s]),y=eC(e=>e.pasteBuffer),{screenToFlowPosition:x}=S(),b=f(e=>{let{x:o,y:t}=x(e);y(o,t)},[s,x]),w=eC(({clearGraph:e})=>e),C=eC(e=>e.getEditorState),$=eC(e=>e.getProject),k=f(()=>{w()},[w]),N=eC(e=>e.toggleHelp),P=eC(e=>e.history.back),z=eC(e=>e.history.forward),A=eC(e=>e.history.pointer),j=eC(e=>e.history.buffer),E=eC(e=>e.copySelectedItems),M=eC(e=>e.nodes),F=g(()=>M.filter(({selected:e})=>e),[M]),T=eC(e=>e.copyBuffer),D=S(),H=f(()=>{J(JSON.stringify({...C()},null,2),"web-noise-patch.json")},[C,D]),O=f(()=>{J(JSON.stringify({...$()},null,2),"web-noise-project.json")},[C,D]);return u(()=>(X("command+shift+a",()=>(v(200,50),!1)),X("shift+/",()=>(N(),!1)),X("command+z",()=>(P(),!1)),X("command+shift+z",()=>(z(),!1)),X("command+c",()=>(E(),!1)),X("command+v",()=>(b({x:200,y:50}),!1)),()=>{X.unbind()}),[v,b]),r(n,{children:[t(eQ,{isOpen:a,closeMenu:()=>s(!1),mousePosition:i}),t(e3,{isOpen:d,closeMenu:()=>c(!1)}),t(e6,{isOpen:p,closeMenu:()=>m(!1)}),r(eP,{id:e7,animation:!1,colors:o.colors,children:[t(eN,{onClick:({triggerEvent:{clientX:e,clientY:o}})=>v(e,o),children:"Add Node (⌘+⇧+A)"}),t(U,{}),t(eN,{onClick:k,children:"Delete All"}),t(U,{}),t(eN,{onClick:H,children:"Download patch"}),t(eN,{onClick:()=>c(!0),children:"Upload patch"}),t(U,{}),t(eN,{onClick:O,children:"Download project"}),t(eN,{onClick:()=>m(!0),children:"Upload project"}),t(U,{}),t(eN,{disabled:0===A,onClick:P,children:"Undo (⌘+z)"}),t(eN,{disabled:A===j.length,onClick:z,children:"Redo (⌘+⇧+Z)"}),t(U,{}),t(eN,{disabled:!F.length,onClick:E,children:"Copy Selected (⌘+c)"}),t(eN,{disabled:!T.nodes.length,onClick:({triggerEvent:{clientX:e,clientY:o}})=>b({x:e,y:o}),children:"Paste (⌘+v)"}),t(U,{}),e.map((e,o)=>t(eN,{children:e},o)),t(U,{}),t(eN,{onClick:N,children:"Help (⇧+?)"})]})]})};let oo="editor-node-menu";var ot=e=>{let o=ek(),i=eC(e=>e.removeNodes),l=eC(e=>e.addNodeToControlPanel),a=eC(e=>e.removeNodeFromControlPanel),s=eC(e=>e.copy),d=eC(e=>e.nodesConfiguration),c=eC(e=>e.controlPanel.nodes),p=f(({props:e})=>!!e?.node.type&&!!c.find(({id:o})=>o===e.node.id),[c]),h=f(({props:e})=>{if(!e?.node.type)return!1;let o=d[e.node.type];return!!o?.controlPanelNode},[d]);return t(n,{children:r(eP,{id:oo,animation:!1,colors:o.colors,children:[t(eN,{onClick:e=>i([e.props.node]),children:"Delete Node (DEL)"}),t(eN,{hidden:(...e)=>!h(...e)||p(...e),onClick:e=>l(e.props.node),children:"Add To Control Panel"}),t(eN,{hidden:(...e)=>!h(...e)||!p(...e),onClick:e=>a(e.props.node),children:"Remove From Control Panel"}),t(eN,{onClick:e=>s({nodes:[e.props.node],edges:[]}),children:"Copy (⌘+c)"})]})})},or=e=>eC(({patch:e})=>e).audioNodes.get(e),on=e=>{let o=eC(({updateNodeData:e})=>e),t=f(t=>o(e,{values:t}),[e,o]);return{updateNodeValues:t,updateNodeConfig:f(t=>o(e,{config:t}),[e,o]),updateNodeLabel:f(t=>o(e,{label:t}),[e,o])}};let oi=c.input`
|
|
267
291
|
width: 100%;
|
|
268
292
|
background: none;
|
|
269
293
|
border: none;
|
|
@@ -292,7 +316,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
292
316
|
padding: 0.3rem;
|
|
293
317
|
border-radius: 0.2rem;
|
|
294
318
|
}
|
|
295
|
-
`;var
|
|
319
|
+
`;var ol=({onChange:e,value:o="",className:r})=>{let n=m(null),[i,l]=h(!1),a=f(e=>{e.target?.select(),l(!0)},[l]),s=f(()=>{window.getSelection()?.collapseToEnd(),l(!1)},[l]),d=f(()=>{s(),n.current&&e(n.current.value)},[n,s,e]),c=f(()=>{s(),n.current&&o&&(n.current.value=o)},[n,s,o]);return u(()=>{n.current&&(n.current.value=o)},[o,n]),t(oi,{ref:n,type:"text",readOnly:!i,onDoubleClick:e=>a(e),onBlur:d,onKeyDown:e=>{switch(e.key){case"Escape":c();break;case"Enter":d()}},className:r})};let oa=i(c.div`
|
|
296
320
|
height: 100%;
|
|
297
321
|
width: 100%;
|
|
298
322
|
overflow: scroll;
|
|
@@ -320,13 +344,13 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
320
344
|
a {
|
|
321
345
|
color: ${({theme:e})=>e.colors.accent1};
|
|
322
346
|
}
|
|
323
|
-
`);var
|
|
347
|
+
`);var os=({isOpen:e,onClose:o,type:r,node:n})=>{let{info:i,portsDescription:l}=eC(e=>e.nodesConfiguration[r]),a=g(()=>{let e=[],o=n.inputs;if(o)for(let t in e.push("## Inputs"),o){let r=o[t];e.push(`### *${t}*`);let n=l?.inputs?.[t];n&&e.push(n),Array.isArray(r.type)?e.push(`**Types**: \`${r.type.join(", ")}\``):e.push(`**Type**: \`${r.type||"unknown"}\``),r.range&&e.push(`**Range**: \`[${r.range[0]}, ${r.range[1]}]\``),void 0!==r.defaultValue&&e.push(`**Default**: \`${r.defaultValue}\``)}let t=n.outputs;if(t)for(let o in e.push("## Outputs"),t){let r=t[o];e.push(`### *${o}*`);let n=l?.outputs?.[o];n&&e.push(n),Array.isArray(r.type)?e.push(`**Types**: \`${r.type.join(", ")}\``):e.push(`**Type**: \`${r.type||"unknown"}\``),r.range&&e.push(`**Range**: \`[${r.range[0]}, ${r.range[1]}]\``),void 0!==r.defaultValue&&e.push(`**Default**: \`${r.defaultValue}\``)}return e.join("\n\n")},[n,l]);return e?t(eF,{onClose:o,children:t(oa,{dangerouslySetInnerHTML:{__html:es((i||"")+"\n\n"+a||"")}})}):null};let od=c.div`
|
|
324
348
|
background-color: var(--leva-colors-elevation1);
|
|
325
|
-
`,
|
|
349
|
+
`,oc=c(od)`
|
|
326
350
|
padding: 2rem 5rem;
|
|
327
|
-
`,
|
|
351
|
+
`,op=c(od)`
|
|
328
352
|
padding: 1rem 2rem;
|
|
329
|
-
`,
|
|
353
|
+
`,oh=c(b)`
|
|
330
354
|
font-size: 1.2rem;
|
|
331
355
|
opacity: 0.4;
|
|
332
356
|
width: 1rem;
|
|
@@ -334,7 +358,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
334
358
|
opacity: 1;
|
|
335
359
|
cursor: pointer;
|
|
336
360
|
}
|
|
337
|
-
`,
|
|
361
|
+
`,ou=c(w)`
|
|
338
362
|
font-size: 1.2rem;
|
|
339
363
|
opacity: 0.4;
|
|
340
364
|
width: 1rem;
|
|
@@ -342,12 +366,12 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
342
366
|
opacity: 1;
|
|
343
367
|
cursor: pointer;
|
|
344
368
|
}
|
|
345
|
-
`,
|
|
369
|
+
`,og=c.div`
|
|
346
370
|
position: relative;
|
|
347
371
|
font-family: var(--leva-fonts-mono);
|
|
348
372
|
font-size: var(--leva-fontSizes-root);
|
|
349
373
|
background-color: var(--leva-colors-elevation1);
|
|
350
|
-
`,
|
|
374
|
+
`,of=c(og)`
|
|
351
375
|
display: flex;
|
|
352
376
|
height: var(--leva-sizes-titleBarHeight);
|
|
353
377
|
touch-action: none;
|
|
@@ -357,38 +381,38 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
357
381
|
color: var(--leva-colors-highlight1);
|
|
358
382
|
padding: 0 0.4rem;
|
|
359
383
|
gap: 0.3rem;
|
|
360
|
-
`,
|
|
384
|
+
`,om=c(og)(({theme:e})=>`
|
|
361
385
|
display: grid;
|
|
362
386
|
grid-template-areas: "inputs outputs";
|
|
363
387
|
background: ${e.colors.elevation2};
|
|
364
388
|
border-bottom: 1px solid ${e.colors.elevation1};
|
|
365
389
|
color: ${e.colors.highlight3};
|
|
366
390
|
font-size: 0.6rem;
|
|
367
|
-
`),
|
|
391
|
+
`),ov=c.div`
|
|
368
392
|
grid-area: inputs;
|
|
369
393
|
text-align: left;
|
|
370
|
-
`,
|
|
394
|
+
`,oy=c.div`
|
|
371
395
|
grid-area: outputs;
|
|
372
396
|
text-align: right;
|
|
373
|
-
`,
|
|
397
|
+
`,ox=c.div`
|
|
374
398
|
position: relative;
|
|
375
399
|
padding: 5px 10px;
|
|
376
|
-
`,
|
|
377
|
-
--port-color: ${e=>{if(!e.portType)return e.theme.colors.highlight2;if(!Array.isArray(e.portType))return
|
|
400
|
+
`,ob={[ew.Audio]:"#4ade80",[ew.Gate]:"#c084fc",[ew.Number]:"#38bdf8",[ew.Any]:"#ffffff"},ow=i(c(D,{shouldForwardProp:e=>"portType"!==e})`
|
|
401
|
+
--port-color: ${e=>{if(!e.portType)return e.theme.colors.highlight2;if(!Array.isArray(e.portType))return ob[e.portType];{let o=e.portType.map(e=>ob[e]);return`linear-gradient(0.25turn, ${o.join(", ")});`}}};
|
|
378
402
|
border-color: var(--port-color);
|
|
379
403
|
background: var(--port-color);
|
|
380
404
|
box-shadow: 0px 0px 0px 1px ${({theme:e})=>e.colors.elevation2} inset;
|
|
381
|
-
`),
|
|
405
|
+
`),oC=i(c(ow)`
|
|
382
406
|
left: -3px;
|
|
383
|
-
`),
|
|
407
|
+
`),o$=({...e})=>t(oC,{...e,type:"target",position:T.Left}),ok=i(c(ow)`
|
|
384
408
|
right: -3px;
|
|
385
|
-
`),
|
|
409
|
+
`),oN=e=>t(ok,{...e,type:"source",position:T.Right}),oP=({className:e,...o})=>t(of,{...o,className:[e,eu].join(" ")}),oz=e=>eC(o=>o.nodesConfiguration[e]),oA=e=>{let{id:o,children:n,selected:i,...l}=e,a=ek(),s=eC(({getNode:e})=>e),d=eC(e=>e.nodesConfiguration),[c,p]=h(!1),{info:u}=oz(e.type),f=g(()=>d[e.type].resizable??!1,[d,e.type]),{updateNodeLabel:m,updateNodeConfig:v}=on(o),{data:y}=s(o)||{},x=or(o),{ConfigNode:b}=(e=>{let{configNode:o}=oz(e);return{ConfigNode:o}})(l.type),[w,C]=h(!1);if(!x)return t(oc,{className:eu,children:"can't find audio node"});if(x.loading)return t(oc,{className:eu,children:"loading"});if(x.error)return r(op,{className:eu,children:["error: ",x.error.toString()]});if(!x.node)return t(oc,{className:eu,children:"can't find audio node"});let $=y?.config?.size,{node:{inputs:k,outputs:N}}=x;return r(od,{children:[r(oP,{children:[u&&t(ou,{onClickCapture:()=>p(!0)}),t(ol,{value:y?.label??"No Name",onChange:m}),b&&t(oh,{onClickCapture:()=>C(e=>!e)})]}),r(om,{theme:a,children:[t(ov,{children:k?Object.keys(k).map((e,o)=>r(ox,{children:[t(o$,{id:e,portType:k[e].type}),t("span",{children:e})]},o)):null}),t(oy,{children:N?Object.keys(N).map((e,o)=>r(ox,{children:[t(oN,{id:e,portType:N[e].type}),t("span",{children:e})]},o)):null})]}),b&&w&&i?t(b,{...e}):f?t(et,{size:$,minWidth:180,minHeight:30,enable:{bottom:!0,bottomRight:!0,right:!0},onResizeStop:(e,o,t,r)=>{let n=$?{width:$.width+r.width,height:$.height+r.height}:t.getBoundingClientRect();v({...y?.config,size:n})},children:n}):n,t(os,{isOpen:c,type:e.type,onClose:()=>p(!1),node:x.node})]})},oj=c.div`
|
|
386
410
|
width: 100%;
|
|
387
411
|
padding: 0.4rem 0;
|
|
388
412
|
white-space: nowrap;
|
|
389
413
|
overflow: hidden;
|
|
390
414
|
text-overflow: ellipsis;
|
|
391
|
-
`,
|
|
415
|
+
`,oE=c(oP)`
|
|
392
416
|
display: flex;
|
|
393
417
|
gap: 0.1rem;
|
|
394
418
|
padding: 0 0.4rem;
|
|
@@ -396,13 +420,13 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
396
420
|
font-size: 0.6rem;
|
|
397
421
|
height: auto;
|
|
398
422
|
min-width: 0;
|
|
399
|
-
`,
|
|
423
|
+
`,oM=c.div`
|
|
400
424
|
display: flex;
|
|
401
425
|
align-items: center;
|
|
402
426
|
height: 70%;
|
|
403
427
|
width: auto;
|
|
404
428
|
gap: 0.4rem;
|
|
405
|
-
`,
|
|
429
|
+
`,oF=c.span`
|
|
406
430
|
width: auto;
|
|
407
431
|
height: 100%;
|
|
408
432
|
cursor: pointer;
|
|
@@ -414,11 +438,11 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
414
438
|
color: ${({theme:e})=>e.colors.highlight2};
|
|
415
439
|
cursor: pointer;
|
|
416
440
|
}
|
|
417
|
-
`,
|
|
441
|
+
`,oS=c.div`
|
|
418
442
|
height: 100%;
|
|
419
443
|
display: grid;
|
|
420
444
|
grid-template-rows: auto 1fr;
|
|
421
|
-
`,
|
|
445
|
+
`,oT=e=>{let{node:o}=e,r=eC(e=>e.getControlPanelNode),n=g(()=>r(o),[o]);return n?t(n,{...e}):null};var oD=e=>{let{node:o,showControls:n,onDelete:i}=e,l=ek(),{id:a}=o,{node:s}=or(a)||{},{updateNodeValues:d}=on(a);return r(oS,{theme:l,children:[r(oE,{theme:l,children:[t(oj,{children:o.data.label}),n&&r(oM,{children:[t(oF,{theme:l,children:t(x,{className:"grid-item-handle"})}),t(oF,{theme:l,children:t(y,{onClick:()=>i(o)})})]})]}),t(oT,{node:o,audioNode:s,updateNodeValues:d})]})};let oH=c.div`
|
|
422
446
|
position: fixed;
|
|
423
447
|
z-index: 5;
|
|
424
448
|
box-shadow: 0px 1px 2px ${({theme:e})=>e.colors.elevation2};
|
|
@@ -438,34 +462,34 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
438
462
|
color: ${({theme:e})=>e.colors.highlight2};
|
|
439
463
|
cursor: pointer;
|
|
440
464
|
}
|
|
441
|
-
`,
|
|
465
|
+
`,oO=c(oM)`
|
|
442
466
|
height: 80%;
|
|
443
|
-
`,
|
|
467
|
+
`,o_=c(oF)`
|
|
444
468
|
font-size: 1rem;
|
|
445
469
|
display: flex;
|
|
446
470
|
align-items: center;
|
|
447
|
-
`,
|
|
471
|
+
`,oI=c(oE)`
|
|
448
472
|
grid-template-columns: 1fr auto;
|
|
449
473
|
border-bottom: 1px solid ${({theme:e})=>e.colors.elevation3};
|
|
450
474
|
font-size: 0.7rem;
|
|
451
|
-
`,
|
|
475
|
+
`,oW=c(oj)`
|
|
452
476
|
text-align: center;
|
|
453
|
-
`,
|
|
477
|
+
`,oL=c.div`
|
|
454
478
|
height: 100%;
|
|
455
479
|
width: 100%;
|
|
456
480
|
padding: 0.3rem 0.4rem;
|
|
457
481
|
box-sizing: border-box;
|
|
458
|
-
`,
|
|
482
|
+
`,oR=c.div`
|
|
459
483
|
height: auto;
|
|
460
484
|
padding: 0;
|
|
461
485
|
max-height: 95vh;
|
|
462
486
|
overflow-y: scroll;
|
|
463
487
|
border: 1px solid ${({theme:e})=>e.colors.elevation3};
|
|
464
|
-
`,
|
|
488
|
+
`,oB=c.div`
|
|
465
489
|
padding: 1rem 0;
|
|
466
490
|
font-family: var(--leva-fonts-mono);
|
|
467
491
|
font-size: 0.8rem;
|
|
468
|
-
`,
|
|
492
|
+
`,oV=c.div`
|
|
469
493
|
display: flex;
|
|
470
494
|
align-items: center;
|
|
471
495
|
gap: 0.5rem;
|
|
@@ -474,7 +498,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
474
498
|
&:hover {
|
|
475
499
|
color: ${({theme:e})=>e.colors.highlight2};
|
|
476
500
|
}
|
|
477
|
-
`,
|
|
501
|
+
`,oG=c.div`
|
|
478
502
|
position: absolute;
|
|
479
503
|
height: 1rem;
|
|
480
504
|
top: 0;
|
|
@@ -482,14 +506,14 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
482
506
|
margin: auto;
|
|
483
507
|
left: 0.5rem;
|
|
484
508
|
border-right: 1px solid ${({theme:e})=>e.colors.whitePrimary};
|
|
485
|
-
`,
|
|
509
|
+
`,oU=c.div`
|
|
486
510
|
box-sizing: border-box;
|
|
487
511
|
overflow: hidden;
|
|
488
512
|
.react-resizable-handle:after {
|
|
489
513
|
border-color: ${({theme:e})=>e.colors.whitePrimary};
|
|
490
514
|
border-width: 1px;
|
|
491
515
|
}
|
|
492
|
-
`;var
|
|
516
|
+
`;var oJ=()=>{let e=ek(),o=m(null),i=eC(e=>e.nodes),{show:l,nodes:a,size:s}=eC(e=>e.controlPanel),{width:d=200,height:c}=s,p=g(()=>{let e=a.map(({id:e})=>e);return i.filter(({id:o})=>e.includes(o))},[i,a]),u=eC(e=>e.showControlPanel),f=eC(e=>e.hideControlPanel),v=eC(e=>e.setControlPanelNodes),x=eC(e=>e.setControlPanelSize),b=eC(e=>e.removeNodeFromControlPanel),[w,C]=h(!0),$=g(()=>{let e=a.reduce((e,{height:o=ef,x:t,y:r=0})=>{let n=r+o;return n>e?n:e},0);return a.map(({id:o,width:t,height:r,x:n,y:i})=>({i:o,w:t||4,h:r||6,x:n??0,y:i??e}))},[a]);return p.length?r(n,{children:[t(oH,{theme:e,ref:o,onClick:u,children:t(el,{})}),r(ea,{open:l,onClose:f,direction:"left",className:"",size:"auto",enableOverlay:!1,style:{background:e.colors.elevation1,position:"absolute"},children:[r(oI,{theme:e,children:[t(oW,{children:"Control Panel"}),t(oO,{children:t(o_,{onClick:f,theme:e,children:t(y,{})})})]}),r(oL,{children:[t(oB,{children:w?r(oV,{theme:e,onClick:()=>C(!1),children:[t(en,{}),"Unlock grid"]}):r(oV,{theme:e,onClick:()=>C(!0),children:[t(ei,{}),"Lock grid"]})}),t(et,{enable:{top:!1,right:!w,bottom:!1,left:!1,topRight:!1,bottomRight:!1,bottomLeft:!1,topLeft:!1},handleComponent:{right:t(oG,{theme:e})},minWidth:120,size:{width:d,height:"auto"},onResizeStop:(e,o,t,r)=>{x({width:d+r.width,height:c+r.height})},children:t(oR,{theme:e,children:t(er,{layout:$,className:"layout",cols:4,rowHeight:ef,width:d,margin:[0,0],isResizable:!w,draggableHandle:".grid-item-handle",onLayoutChange:e=>{requestAnimationFrame(()=>{v(e.map(({i:e,w:o,h:t,x:r,y:n})=>({id:e,width:o,height:t,x:r,y:n})))})},children:p.map(o=>t(oU,{theme:e,children:t(oD,{node:o,showControls:!w,onDelete:b})},o.id))})})})]})]})]}):null},oX={};oX="# Quick start\n\n## Add node\n - Mouse right click\n - Select **'Add Node'** from context menu\n\n ### or\n\n - Press `CMD+SHIFT+A`\n\n<br/>\n\n## Connect nodes\n - Mouse left click and hold on source port\n - Drop on target port\n\n<br/>\n\n## Delete Node or Connection\n - Mouse right click on node/connection\n - Select **'Delete Node'**/**'Delete Connection'** from context menu\n\n ### or\n\n - Mouse left click on node/connection, then press `Backspace`\n\n<br/>\n\n\n## Move node\n - Drag and Drop\n\n";let oY=i(c.div`
|
|
493
517
|
font-family: var(--leva-fonts-mono);
|
|
494
518
|
font-size: 0.7rem;
|
|
495
519
|
box-sizing: border-box;
|
|
@@ -503,13 +527,13 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
503
527
|
color: ${({theme:e})=>e.colors.accent3};
|
|
504
528
|
filter: hue-rotate(180deg);
|
|
505
529
|
}
|
|
506
|
-
`),
|
|
530
|
+
`),oq=i(c.div`
|
|
507
531
|
padding: 1rem;
|
|
508
532
|
height: 100%;
|
|
509
533
|
width: 100%;
|
|
510
534
|
box-sizing: border-box;
|
|
511
535
|
overflow: hidden;
|
|
512
|
-
`);var
|
|
536
|
+
`);var oK=()=>{let e=eC(e=>e.isHelpShown),o=eC(e=>e.toggleHelp);return e?t(eF,{onClose:()=>{o()},children:t(oq,{children:t(oY,{dangerouslySetInnerHTML:{__html:es(ed(oX))},onWheelCapture:e=>e.stopPropagation()})})}):null};let oQ=()=>t(n,{children:t(H,{onClick:eC(e=>e.toggleHelp),children:t(Q,{})})}),oZ=c.div`
|
|
513
537
|
position: fixed;
|
|
514
538
|
z-index: ${({theme:e})=>e.zIndex.resumeContextLayout};
|
|
515
539
|
width: 100%;
|
|
@@ -523,34 +547,34 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
523
547
|
justify-content: center;
|
|
524
548
|
color: ${({theme:e})=>e.colors.whitePrimary};
|
|
525
549
|
cursor: pointer;
|
|
526
|
-
`,
|
|
550
|
+
`,o0=c.div`
|
|
527
551
|
display: flex;
|
|
528
552
|
width: 100%;
|
|
529
553
|
align-items: center;
|
|
530
554
|
justify-content: center;
|
|
531
|
-
`,
|
|
555
|
+
`,o1=c.div`
|
|
532
556
|
font-family: var(--leva-fonts-mono);
|
|
533
557
|
font-size: 2rem;
|
|
534
|
-
`,
|
|
558
|
+
`,o2=c(Z)`
|
|
535
559
|
width: 7rem;
|
|
536
560
|
height: 7rem;
|
|
537
|
-
`;var
|
|
561
|
+
`;var o3=()=>{let e=ek(),o=eC(({patch:e})=>e).audioContext,[n,i]=h("running"===o.state);return n?null:r(oZ,{theme:e,onClick:()=>{o.resume(),i(!0)},children:[t(o0,{children:t(o1,{theme:e,children:"Click anywhere to resume audio context"})}),t(o0,{children:t(o2,{})})]})},o9=()=>{let e=eC(({setConfig:e})=>e),{showMinimap:o}=eC(({config:e})=>e);return t(H,{onClick:()=>e({showMinimap:!o}),children:o?t(ee,{}):t(eo,{})})},o8=({id:e,sourceX:o,sourceY:i,targetX:l,targetY:a,sourcePosition:s,targetPosition:d,style:c={},data:p,markerStart:h,markerEnd:g,source:f,target:m,sourceHandleId:v,targetHandleId:y,selected:x})=>{let b=ek(),w=eC(({getNode:e})=>e),C=w(f),$=w(m),k=C?.selected||$?.selected;u(()=>{if(v&&y)return console.log(`connected ${f} to ${m}`),()=>{console.log(`disconnected ${f} from ${m}`)}},[f,v,m,y]);let[N]=O({targetX:l,targetY:a,targetPosition:d,sourceX:o,sourceY:i,sourcePosition:s});return r(n,{children:[t("path",{id:e,style:{...c,stroke:x?b.colors.accent2:k?b.colors.highlight3:b.colors.highlight2},className:"react-flow__edge-path Wire",d:N,markerEnd:g}),t("path",{style:{...c,strokeWidth:8,color:"transparent",opacity:0,cursor:"pointer"},d:N,markerEnd:g})]})};let o5=(e,o)=>console.log("drag stop",o),o4=(e,o)=>console.log("click",o),o6=[20,20],o7=({editorState:e,plugins:o=[],editorContextMenu:n=[],onChange:i=()=>{},...l})=>{let a=g(()=>({wire:o8}),[]),{nodes:s,edges:d,controlPanel:c,onNodesChange:p,onNodesDelete:m,onEdgesChange:v,onEdgesDelete:y,onConnect:x,setPlugins:b,setViewport:w,viewport:$}=eC(),k=eC(({config:e})=>e),N=eC(({nodeTypes:e})=>e);u(()=>{b(o)},[o]);let[P,F]=h(null);u(()=>{P&&i({nodes:s,edges:d,controlPanel:c,viewport:$})},[s,d,c,$]);let S=f(e=>{P||(F(e),console.log("flow loaded:",e))},[P]),{onContextMenu:T}=(()=>{let{show:e}=B({id:e7});return{onContextMenu:e}})(),{onContextMenu:D}=(()=>{let{show:e}=B({id:oo});return{onContextMenu:f((o,t)=>{o.stopPropagation(),e(o,{props:{node:t}})},[])}})(),{onContextMenu:H}=(()=>{let{show:e}=B({id:ez});return{onContextMenu:f((o,t)=>{o.stopPropagation(),e(o,{props:{edge:t}})},[e])}})();return u(()=>{$&&P?.setViewport($)},[$,P]),z({onEnd:w}),r(C,{nodes:s,edges:d,onNodesChange:p,onNodesDelete:m,onEdgesChange:v,onConnect:x,onNodeDragStop:o5,onEdgesDelete:y,onInit:S,onNodeClick:o4,onContextMenu:T,onNodeContextMenu:D,onEdgeContextMenu:H,nodeTypes:N,edgeTypes:a,snapGrid:o6,defaultViewport:e?.viewport,defaultEdgeOptions:{type:"wire"},snapToGrid:!0,fitView:!0,disableKeyboardA11y:!0,children:[t(A,{variant:j.Dots,gap:12}),k.showMinimap?t(E,{}):null,r(M,{style:{right:"1rem",left:"initial",bottom:"40%",top:"initial"},showInteractive:!1,children:[t(o9,{}),t(oQ,{})]}),t(o3,{}),t(oJ,{}),t(oK,{}),t(oe,{editorContextMenu:n}),t(ot,{}),t(eA,{})]})},te=e=>t(F,{children:t(o7,{...e})}),to={nodes:[],edges:[],controlPanel:{nodes:[],show:!1,size:{width:200,height:100}},viewport:{x:0,y:0,zoom:1.5}},tt=i(c.div`
|
|
538
562
|
display: flex;
|
|
539
563
|
flex-direction: column;
|
|
540
564
|
height: 100%;
|
|
541
565
|
width: 100%;
|
|
542
|
-
`),
|
|
566
|
+
`),tr=i(c.div`
|
|
543
567
|
height: 100%;
|
|
544
568
|
width: 100%;
|
|
545
569
|
display: flex;
|
|
546
570
|
position: relative;
|
|
547
|
-
`),
|
|
571
|
+
`),tn=i(c.div`
|
|
548
572
|
display: flex;
|
|
549
573
|
flex: 1;
|
|
550
574
|
align-items: center;
|
|
551
575
|
justify-content: center;
|
|
552
576
|
background: ${({theme:e})=>e.colors.elevation3};
|
|
553
|
-
`),
|
|
577
|
+
`),ti=i(c.div`
|
|
554
578
|
background: ${({theme:e})=>e.colors.elevation2};
|
|
555
579
|
opacity: 0.7;
|
|
556
580
|
position: absolute;
|
|
@@ -565,12 +589,12 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
565
589
|
align-items: center;
|
|
566
590
|
justify-content: center;
|
|
567
591
|
font-size: 6rem;
|
|
568
|
-
`),
|
|
592
|
+
`),tl=e=>{let o=eC(e=>e.pullEditorChanges),i=eC(e=>e.currentFileIndex),[l,a]=h(!0);u(()=>{a(!0),setTimeout(()=>{a(!1)},1600)},[i]);let{file:s}=e;return s?"audio"===s.type?t(tn,{children:t("audio",{src:s.file,controls:!0})}):r(n,{children:[t(te,{...e,onChange:e=>{o()},editorState:s.file||to}),t(ti,{show:l,children:"Loading..."})]}):null},ta=i(c.div`
|
|
569
593
|
height: 2rem;
|
|
570
594
|
display: flex;
|
|
571
595
|
align-items: center;
|
|
572
596
|
background: ${({theme:e})=>e.colors.elevation2};
|
|
573
|
-
`),
|
|
597
|
+
`),ts=i(c.div`
|
|
574
598
|
display: flex;
|
|
575
599
|
align-items: center;
|
|
576
600
|
cursor: pointer;
|
|
@@ -587,7 +611,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
587
611
|
background-color: ${({theme:e})=>e.colors.elevation1};
|
|
588
612
|
}
|
|
589
613
|
}
|
|
590
|
-
`),
|
|
614
|
+
`),td=i(c.div`
|
|
591
615
|
display: flex;
|
|
592
616
|
align-items: center;
|
|
593
617
|
height: 100%;
|
|
@@ -598,10 +622,10 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
598
622
|
&:hover {
|
|
599
623
|
color: ${({theme:e})=>e.colors.whitePrimary};
|
|
600
624
|
}
|
|
601
|
-
`),
|
|
625
|
+
`),tc=i(c(v)`
|
|
602
626
|
height: 40%;
|
|
603
627
|
width: auto;
|
|
604
|
-
`),
|
|
628
|
+
`),tp=i(c(y)`
|
|
605
629
|
height: 70%;
|
|
606
630
|
width: auto;
|
|
607
631
|
cursor: pointer;
|
|
@@ -609,7 +633,7 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
609
633
|
&:hover {
|
|
610
634
|
color: ${({theme:e})=>e.colors.whitePrimary};
|
|
611
635
|
}
|
|
612
|
-
`),
|
|
636
|
+
`),th=()=>({file:to,name:"Unnamed",type:"patch",id:p()});var tu=({...e})=>{let{projectState:o,theme:n}=e,i=eC(e=>e.currentFileIndex),d=eC(e=>e.project.files[e.currentFileIndex]),c=eC(e=>e.setCurrentFileIndex),p=eC(e=>e.project),h=eC(e=>e.setProject),g=eC(e=>e.getProject),f=eC(e=>e.updateFileName),m=eC(e=>e.addFile),v=eC(e=>e.deleteFile),y=eC(e=>e.syncEditorWithCurrentFile),x=eC(e=>e.setEditorState);return eC(e=>e.pullEditorChanges),u(()=>{h(o||{files:[th()]});let e=o?.files[0];e?.file&&e?.type!=="audio"&&x(e.file)},[o]),u(()=>{var e;return e=async(...e)=>{let o=new Request(...e),t=g().files,r=o.url.replace("project://",""),n=t.find(({id:e})=>e===r);return n?ey(n)?new Response(JSON.stringify(n.file??null)):ex(n)?fetch(n.file):new Response(null):new Response(`File not found: ${o.url}`,{status:404})},ec.push(["project://*",e]),()=>{}},[g]),u(()=>{y()},[i,y]),r(l,{theme:n||e$,children:[t(a,{styles:s`
|
|
613
637
|
:root {
|
|
614
638
|
--leva-colors-elevation1: #292d39;
|
|
615
639
|
--leva-colors-elevation2: #181c20;
|
|
@@ -666,5 +690,5 @@ let e,o;import{jsx as t,jsxs as r,Fragment as n}from"react/jsx-runtime";import{w
|
|
|
666
690
|
--leva-fontWeights-folder: normal;
|
|
667
691
|
--leva-fontWeights-button: normal;
|
|
668
692
|
}
|
|
669
|
-
`}),r(
|
|
693
|
+
`}),r(tt,{children:[r(ta,{children:[p.files.map((e,o)=>r(ts,{onClick:()=>{c(o)},active:o===i,children:[t(ol,{onChange:e=>f(o,e),value:e.name||"Unnamed"}),t(tp,{onClick:e=>{e.stopPropagation(),window.confirm("Do you really want to delete this file?")&&v(o)}})]},o)),t(td,{onClick:()=>{m(th()),c(p.files.length)},children:t(tc,{})})]}),t(tr,{children:t(tl,{file:d,...e})})]})]})};export{tu as Editor,to as EDITOR_DEFAULTS,o8 as Wire,oA as WNNode,oP as TitleBar,om as PortsPanel,oy as OutputPorts,oN as OutputHandle,ov as InputPorts,o$ as InputHandle,ox as Port,eF as Modal,ol as EditableLabel,or as useAudioNode,on as useNode,ek as useTheme,eC as useStore,e$ as theme,ex as isAudio,ey as isPatch,ew as PortType};
|
|
670
694
|
//# sourceMappingURL=module.js.map
|