@web-noise/core 0.0.1

package/dist/types.d.ts

@@ -0,0 +1,277 @@
+import { AudioNodeState, Patch } from "@web-noise/patch";
+import { JSX } from "react/jsx-runtime";
+import { HandleProps, NodeProps, Edge, Node, Viewport, OnConnect, OnEdgesChange, OnNodesChange, NodeTypes, EdgeProps } from "reactflow";
+import { Theme as _Theme1 } from "@emotion/react";
+import { ClassAttributes, HTMLAttributes, DetailedHTMLProps, ReactNode } from "react";
+import { StyledComponent } from "@emotion/styled";
+import { StateCreator, StoreApi, UseBoundStore } from "zustand";
+import { Delta } from "jsondiffpatch";
+export const useAudioNode: <T = WNAudioNode>(id: string) => AudioNodeState<T> | undefined;
+export const useNode: (id: string) => {
+    updateNodeValues: (values: WNNodeData["values"]) => void;
+    updateNodeConfig: (config: WNNodeData["config"]) => void;
+    updateNodeLabel: (label: string) => void;
+};
+export const theme: {
+    colors: {
+        readonly elevation1: "#292d39";
+        readonly elevation2: "#181c20";
+        readonly elevation3: "#373c4b";
+        readonly accent1: "#0066dc";
+        readonly accent2: "#007bff";
+        readonly accent3: "#3c93ff";
+        readonly highlight1: "#535760";
+        readonly highlight2: "#8c92a4";
+        readonly highlight3: "#fefefe";
+        readonly vivid1: "#14df42";
+        readonly whitePrimary: "#ffffff";
+        readonly error: "#db5353";
+    };
+    zIndex: {
+        readonly modal: 9998;
+        readonly controlPanel: 9999;
+        readonly resumeContextLayout: 10003;
+    };
+};
+export type Theme = typeof theme;
+export const useTheme: () => Theme;
+interface EditableLabelProps {
+    onChange: (value: string) => void;
+    value?: string;
+    className?: string;
+}
+export const EditableLabel: ({ onChange, value, className, }: EditableLabelProps) => JSX.Element;
+export const PortsPanel: StyledComponent<{
+    theme?: _Theme1;
+    as?: React.ElementType;
+} & ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+    theme?: _Theme1;
+} & {
+    theme: Theme;
+}, {}, {}>;
+export const InputPorts: StyledComponent<{
+    theme?: _Theme1;
+    as?: React.ElementType;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export const OutputPorts: StyledComponent<{
+    theme?: _Theme1;
+    as?: React.ElementType;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export const Port: StyledComponent<{
+    theme?: _Theme1;
+    as?: React.ElementType;
+}, DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export const InputHandle: (props: Partial<HandleProps>) => JSX.Element;
+export const OutputHandle: (props: Partial<HandleProps>) => JSX.Element;
+export type WNNodeProps<T = Record<string, unknown>> = NodeProps<T & WNNodeData>;
+interface TitleBarProps {
+    className?: string;
+    [key: string]: unknown;
+}
+export const TitleBar: ({ className, ...props }: TitleBarProps) => JSX.Element;
+interface WNNodeParameters extends NodeProps {
+    children?: any;
+}
+export const WNNode: (props: WNNodeParameters) => JSX.Element;
+type AudioNodeChannel = [AudioNode, number];
+export interface InputPort {
+    port: AudioNode | AudioNodeChannel | AudioParam;
+}
+export interface OutputPort {
+    port: AudioNode | AudioNodeChannel;
+}
+export interface WNAudioNode extends Record<string, any> {
+    inputs?: Record<string, InputPort | never>;
+    outputs?: Record<string, OutputPort | never>;
+    destroy?: () => void;
+    setValues?: (values?: any) => void;
+}
+export type CreateWNAudioNode<T = WNAudioNode> = (audioContext: AudioContext, data?: WNNodeData) => T | Promise<T>;
+type NodeDefaultConfig = {
+    size?: {
+        width: number;
+        height: number;
+    };
+};
+export interface WNNodeData<Values = Record<string, unknown>, Config = Record<string, unknown>> {
+    label: string;
+    values?: Values;
+    config?: Config & NodeDefaultConfig;
+}
+export type TWNNode = Node<WNNodeData>;
+export type TWNEdge = Edge;
+interface GraphState {
+    nodes: TWNNode[];
+    edges: TWNEdge[];
+}
+type ControlPanelNodes = Array<{
+    id: TWNNode["id"];
+    width?: number;
+    height?: number;
+    x?: number;
+    y?: number;
+}>;
+interface ControlPanelState {
+    show: boolean;
+    nodes: ControlPanelNodes;
+    size: {
+        width: number;
+        height: number;
+    };
+}
+export interface EditorStoreState extends GraphState {
+    controlPanel: ControlPanelState;
+}
+export interface EditorState extends EditorStoreState {
+    viewport: Viewport;
+}
+type ProjectFile = {
+    id: string;
+    name?: string;
+    type?: "patch" | "blob";
+    file: EditorState;
+};
+export interface Project {
+    files: Array<ProjectFile>;
+}
+export interface ControlPanelNodeProps {
+    node: TWNNode;
+    audioNode?: WNAudioNode | null;
+    updateNodeValues?: (param: any) => void;
+}
+export type ControlPanelNode = any;
+type ConfigNode = (props: WNNodeProps<WNNodeData>) => any;
+export interface PluginComponent {
+    id?: string;
+    type: string;
+    node: any;
+    audioNode: CreateWNAudioNode | false;
+    controlPanelNode?: ControlPanelNode;
+    configNode?: ConfigNode;
+    defaultConfig?: any;
+    resizable?: boolean;
+    description?: string;
+    name?: string;
+}
+export interface PluginConfig {
+    id?: string;
+    components: Array<PluginComponent>;
+    name?: string;
+    description?: string;
+}
+interface NodesState {
+    nodes: TWNNode[];
+    edges: TWNEdge[];
+    onNodesChange: OnNodesChange;
+    onEdgesChange: OnEdgesChange;
+    onConnect: OnConnect;
+    addNode: (node: TWNNode) => void;
+    setNodes: (nodes: TWNNode[]) => void;
+    setEdges: (edges: TWNEdge[]) => void;
+    setNodesAndEdges: (elements: GraphState) => void;
+    getNodesAndEdges: () => GraphState;
+    clearElements: () => void;
+    getNode: (id: string) => TWNNode | null;
+    updateNodeData: (id: string, data: Partial<WNNodeData>) => void;
+    nodeTypes: NodeTypes;
+    setNodeTypes: (nodeTypes: NodeTypes) => void;
+}
+interface HistoryState {
+    history: {
+        maxHistoryLength: number;
+        buffer: Array<Delta>;
+        pointer: number;
+        skipCollect: boolean;
+        push: (changes: Delta) => void;
+        back: () => void;
+        forward: () => void;
+        clear: () => void;
+    };
+}
+type StoreStateCreator = StateCreator<StoreState>;
+declare const history: (config: StoreStateCreator) => StoreStateCreator;
+interface AudioPatchState {
+    patch: Patch;
+    nodesState: Record<string, any>;
+}
+interface ProjectState {
+    project: Project;
+    setProject: (project: Project) => void;
+    getProject: () => Project;
+    pullEditorChanges: () => void;
+    currentFileIndex: number;
+    setCurrentFileIndex: (index: number) => void;
+    updateFileContent: (fileIndex: number, file: ProjectFile) => void;
+    updateFileName: (fileIndex: number, fileName: string) => void;
+    addFile: (file: ProjectFile, name?: string) => void;
+    deleteFile: (fileIndex: number) => void;
+}
+interface EditorConfig {
+    showMinimap: boolean;
+}
+type NodesConfiguration = Record<string, PluginComponent>;
+type StoreState = NodesState & HistoryState & ProjectState & AudioPatchState & {
+    setGraph: (elements: {
+        nodes: TWNNode[];
+        edges: TWNEdge[];
+    }) => Promise<void>;
+    clearGraph: () => void;
+    createNode: (node: TWNNode) => void;
+    createNodes: (node: TWNNode[]) => Promise<void>;
+    removeNode: (node: TWNNode) => void;
+    removeNodes: (nodes: TWNNode[]) => void;
+    removeEdges: (nodes: TWNEdge[]) => void;
+    onConnect: OnConnect;
+    createEdges: (edge: TWNEdge[]) => void;
+    onEdgesDelete: (edges: TWNEdge[]) => void;
+    onNodesDelete: (nodes: TWNNode[]) => Promise<void>;
+    plugins: Array<PluginConfig>;
+    setPlugins: (plugins: Array<PluginConfig>) => void;
+    nodesConfiguration: NodesConfiguration;
+    config: EditorConfig;
+    setConfig: (config: Partial<EditorConfig>) => void;
+    getEditorState: () => EditorState;
+    setEditorState: (state: EditorState) => Promise<void>;
+    isHelpShown: boolean;
+    toggleHelp: () => void;
+    copyBuffer: {
+        nodes: TWNNode[];
+        edges: TWNEdge[];
+    };
+    copy: (elements: {
+        nodes: TWNNode[];
+        edges: TWNEdge[];
+    }) => void;
+    copySelectedItems: () => void;
+    pasteBuffer: (x: number, y: number) => void;
+    getControlPanelNode: (node: TWNNode) => ControlPanelNode | null;
+    controlPanel: ControlPanelState;
+    setControlPanelNodes: (nodes: ControlPanelNodes) => void;
+    showControlPanel: () => void;
+    hideControlPanel: () => void;
+    setControlPanelSize: (width: {
+        width: number;
+        height: number;
+    }) => void;
+    addNodeToControlPanel: (node: TWNNode) => void;
+    removeNodeFromControlPanel: (node: TWNNode) => void;
+    removeNodesFromControlPanel: (nodes: TWNNode[]) => void;
+    viewport: Viewport;
+    setViewport: (viewport: Viewport) => void;
+};
+export const useStore: UseBoundStore<StoreApi<StoreState>>;
+interface ModalProps {
+    onClose?: () => void;
+    children: ReactNode;
+}
+export const Modal: ({ children, onClose, ...props }: ModalProps) => JSX.Element;
+export const Wire: ({ id, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, style, data, markerStart, markerEnd, source, target, sourceHandleId, targetHandleId, selected, }: EdgeProps) => JSX.Element;
+export const Editor: ({ ...props }: {
+    projectState?: Project;
+    plugins?: Array<PluginConfig>;
+    editorContextMenu?: Array<ReactNode>;
+    onChange?: ({ nodes, edges, controlPanel }: EditorState) => void;
+    theme?: Theme;
+}) => JSX.Element;
+
+//# sourceMappingURL=types.d.ts.map

package/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@web-noise/core",
+  "version": "0.0.1",
+  "source": "index.ts",
+  "main": "dist/main.js",
+  "module": "dist/module.js",
+  "types": "dist/types.d.ts",
+  "files": [
+    "dist/main.js",
+    "dist/module.js",
+    "dist/types.d.ts"
+  ],
+  "targets": {
+    "main": {
+      "isLibrary": true,
+      "includeNodeModules": [
+        "@web-noise/fetch",
+        "@web-noise/patch"
+      ],
+      "optimize": true
+    },
+    "module": {
+      "isLibrary": true,
+      "includeNodeModules": [
+        "@web-noise/fetch",
+        "@web-noise/patch"
+      ],
+      "optimize": true
+    }
+  },
+  "dependencies": {
+    "hotkeys-js": "^3.13.1",
+    "js-file-download": "^0.4.12",
+    "jsondiffpatch": "^0.5.0",
+    "marked": "^4.1.1",
+    "nanoid": "^3.3.7",
+    "re-resizable": "^6.9.9",
+    "react-contexify": "^5.0.0",
+    "react-draggable": "^4.4.5",
+    "react-file-drop": "^3.1.6",
+    "react-grid-layout": "^1.3.4",
+    "react-icons": "^4.10.1",
+    "react-modern-drawer": "^1.2.0",
+    "reactflow": "^11.10.3",
+    "zustand": "^4.4.1",
+    "@emotion/css": "^11.11.2",
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0"
+  },
+  "scripts": {
+    "test": "jest",
+    "build": "parcel build --no-scope-hoist"
+  },
+  "devDependencies": {
+    "@types/jest": "^29.2.4",
+    "@types/react-grid-layout": "^1.3.2",
+    "@types/react-modal": "^3.13.1",
+    "@types/react-copy-to-clipboard": "^5.0.4",
+    "jest": "^29.3.1",
+    "ts-jest": "^29.0.3",
+    "web-audio-engine": "^0.13.4",
+    "typescript": "^5.6.3",
+    "@types/react": "^19.1.12",
+    "@types/react-dom": "^19.1.9"
+  },
+  "peerDependencies": {
+    "@web-noise/fetch": "*",
+    "@web-noise/patch": "*",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1"
+  }
+}