@revideo/2d 0.3.7-beta.987 → 0.3.7-blue.987

package/editor/index.css

@@ -30,4 +30,4 @@
   background-color: var(--background-color);
   border-radius: var(--radius);
   margin-right: 8px;
-}
+}

package/editor/index.js

@@ -1,101 +1,71 @@
-import {
-  computed,
-  signal,
-  useComputed,
-  useSignal,
-  useSignalEffect,
-} from '@preact/signals';
-import {NODE_NAME} from '@revideo/2d';
-import {SceneRenderEvent, Vector2} from '@revideo/core';
-import {
-  AccountTree,
-  AutoField,
-  Button,
-  Collapse,
-  Group,
-  Label,
-  MouseButton,
-  OverlayWrapper,
-  Pane,
-  Separator,
-  Tab,
-  Toggle,
-  UnknownField,
-  emphasize,
-  findAndOpenFirstUserFile,
-  makeEditorPlugin,
-  useApplication,
-  useCurrentScene,
-  usePanels,
-  useReducedMotion,
-  useViewportContext,
-  useViewportMatrix,
-} from '@revideo/ui';
-import {createContext} from 'preact';
-import {useContext, useEffect, useMemo, useRef} from 'preact/hooks';
-import {Fragment, jsx, jsxs} from 'preact/jsx-runtime';
+import { useApplication, useCurrentScene, Pane, Separator, Group, Label, Button, findAndOpenFirstUserFile, UnknownField, AutoField, useViewportContext, useViewportMatrix, OverlayWrapper, MouseButton, Toggle, Collapse, usePanels, useReducedMotion, emphasize, Tab, AccountTree, makeEditorPlugin } from '@revideo/ui';
+import { signal, computed, useSignalEffect, useComputed, useSignal } from '@preact/signals';
+import { jsx, jsxs, Fragment } from 'preact/jsx-runtime';
+import { SceneRenderEvent, Vector2 } from '@revideo/core';
+import { createContext } from 'preact';
+import { useMemo, useContext, useRef, useEffect } from 'preact/hooks';
+import { NODE_NAME } from '@revideo/2d';
 import './index.css';
 
 const PluginContext = createContext(null);
 const NodeInspectorKey = '@revideo/2d/node-inspector';
 function usePluginState() {
-  return useContext(PluginContext);
+    return useContext(PluginContext);
 }
-function Provider({children}) {
-  const {inspection} = useApplication();
-  const currentScene = useCurrentScene();
-  const state = useMemo(() => {
-    const scene = signal(currentScene);
-    const selectedKey = signal(null);
-    const afterRender = signal(0);
-    const hoveredKey = signal(null);
-    const openNodes = new Map();
-    const selectedChain = computed(() => {
-      const chain = new Set();
-      const key = selectedKey.value;
-      const selectedNode = scene.value?.getNode(key);
-      if (selectedNode) {
-        let node = selectedNode.parent() ?? null;
-        while (node) {
-          chain.add(node.key);
-          node = node.parent();
+function Provider({ children }) {
+    const { inspection } = useApplication();
+    const currentScene = useCurrentScene();
+    const state = useMemo(() => {
+        const scene = signal(currentScene);
+        const selectedKey = signal(null);
+        const afterRender = signal(0);
+        const hoveredKey = signal(null);
+        const openNodes = new Map();
+        const selectedChain = computed(() => {
+            const chain = new Set();
+            const key = selectedKey.value;
+            const selectedNode = scene.value?.getNode(key);
+            if (selectedNode) {
+                let node = selectedNode.parent() ?? null;
+                while (node) {
+                    chain.add(node.key);
+                    node = node.parent();
+                }
+            }
+            return chain;
+        });
+        return {
+            selectedKey,
+            hoveredKey,
+            afterRender,
+            openNodes,
+            selectedChain,
+            scene,
+        };
+    }, []);
+    state.scene.value = currentScene;
+    useSignalEffect(() => state.scene.value?.onRenderLifecycle.subscribe(([event]) => {
+        if (event === SceneRenderEvent.AfterRender) {
+            state.afterRender.value++;
+        }
+    }));
+    useSignalEffect(() => {
+        const { key, payload } = inspection.value;
+        if (key === NodeInspectorKey) {
+            state.selectedKey.value = payload;
         }
-      }
-      return chain;
     });
-    return {
-      selectedKey,
-      hoveredKey,
-      afterRender,
-      openNodes,
-      selectedChain,
-      scene,
-    };
-  }, []);
-  state.scene.value = currentScene;
-  useSignalEffect(() =>
-    state.scene.value?.onRenderLifecycle.subscribe(([event]) => {
-      if (event === SceneRenderEvent.AfterRender) {
-        state.afterRender.value++;
-      }
-    }),
-  );
-  useSignalEffect(() => {
-    const {key, payload} = inspection.value;
-    if (key === NodeInspectorKey) {
-      state.selectedKey.value = payload;
-    }
-  });
-  useSignalEffect(() => {
-    const nodeKey = state.selectedKey.value;
-    const {key, payload} = inspection.peek();
-    if (key === NodeInspectorKey && !nodeKey) {
-      inspection.value = {key: '', payload: null};
-    } else if (payload !== nodeKey) {
-      inspection.value = {key: NodeInspectorKey, payload: nodeKey};
-    }
-  });
-  return jsx(PluginContext.Provider, {value: state, children: children});
+    useSignalEffect(() => {
+        const nodeKey = state.selectedKey.value;
+        const { key, payload } = inspection.peek();
+        if (key === NodeInspectorKey && !nodeKey) {
+            inspection.value = { key: '', payload: null };
+        }
+        else if (payload !== nodeKey) {
+            inspection.value = { key: NodeInspectorKey, payload: nodeKey };
+        }
+    });
+    return (jsx(PluginContext.Provider, { value: state, children: children }));
 }
 
 function Component$1() {
@@ -168,46 +138,43 @@ const NodeInspectorConfig = {
   component: Component$1,
 };
 
-function Component({children}) {
-  const state = useViewportContext();
-  const {scene, selectedKey} = usePluginState();
-  const matrix = useViewportMatrix();
-  return jsx(OverlayWrapper, {
-    onPointerDown: event => {
-      if (event.button !== MouseButton.Left || event.shiftKey) return;
-      if (!scene.value) return;
-      event.stopPropagation();
-      const position = new Vector2(
-        event.x - state.rect.x,
-        event.y - state.rect.y,
-      ).transformAsPoint(matrix.inverse());
-      selectedKey.value = scene.value.inspectPosition(position.x, position.y);
-    },
-    children: children,
-  });
+function Component({ children }) {
+    const state = useViewportContext();
+    const { scene, selectedKey } = usePluginState();
+    const matrix = useViewportMatrix();
+    return (jsx(OverlayWrapper, { onPointerDown: event => {
+            if (event.button !== MouseButton.Left || event.shiftKey)
+                return;
+            if (!scene.value)
+                return;
+            event.stopPropagation();
+            const position = new Vector2(event.x - state.rect.x, event.y - state.rect.y).transformAsPoint(matrix.inverse());
+            selectedKey.value = scene.value.inspectPosition(position.x, position.y);
+        }, children: children }));
 }
 function drawHook() {
-  const {selectedKey, hoveredKey, afterRender, scene} = usePluginState();
-  selectedKey.value;
-  hoveredKey.value;
-  afterRender.value;
-  return (ctx, matrix) => {
-    const currentScene = scene.peek();
-    if (!currentScene) return;
-    let node = currentScene.getNode(selectedKey.value);
-    if (node) {
-      currentScene.drawOverlay(node.key, matrix, ctx);
-    }
-    node = currentScene.getNode(hoveredKey.value);
-    if (node && hoveredKey.value !== selectedKey.value) {
-      ctx.globalAlpha = 0.5;
-      currentScene.drawOverlay(hoveredKey.value, matrix, ctx);
-    }
-  };
+    const { selectedKey, hoveredKey, afterRender, scene } = usePluginState();
+    selectedKey.value;
+    hoveredKey.value;
+    afterRender.value;
+    return (ctx, matrix) => {
+        const currentScene = scene.peek();
+        if (!currentScene)
+            return;
+        let node = currentScene.getNode(selectedKey.value);
+        if (node) {
+            currentScene.drawOverlay(node.key, matrix, ctx);
+        }
+        node = currentScene.getNode(hoveredKey.value);
+        if (node && hoveredKey.value !== selectedKey.value) {
+            ctx.globalAlpha = 0.5;
+            currentScene.drawOverlay(hoveredKey.value, matrix, ctx);
+        }
+    };
 }
 const PreviewOverlayConfig = {
-  drawHook,
-  component: Component,
+    drawHook,
+    component: Component,
 };
 
 function CircleIcon() {
@@ -391,31 +358,9 @@ const IconMap = {
   View2D: View2DIcon,
 };
 
-function r(e) {
-  var t,
-    f,
-    n = '';
-  if ('string' == typeof e || 'number' == typeof e) n += e;
-  else if ('object' == typeof e)
-    if (Array.isArray(e)) {
-      var o = e.length;
-      for (t = 0; t < o; t++)
-        e[t] && (f = r(e[t])) && (n && (n += ' '), (n += f));
-    } else for (f in e) e[f] && (n && (n += ' '), (n += f));
-  return n;
-}
-function clsx() {
-  for (var e, t, f = 0, n = '', o = arguments.length; f < o; f++)
-    (e = arguments[f]) && (t = r(e)) && (n && (n += ' '), (n += t));
-  return n;
-}
+function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
 
-var styles = {
-  root: 'index-module_root__omEd0',
-  label: 'index-module_label__9BJvW',
-  active: 'index-module_active__KevXv',
-  parent: 'index-module_parent__5nc9I',
-};
+var styles = {"root":"index-module_root__omEd0","label":"index-module_label__9BJvW","active":"index-module_active__KevXv","parent":"index-module_parent__5nc9I"};
 
 const DEPTH_VAR = '--depth';
 function TreeElement({
@@ -620,5 +565,5 @@ var index = makeEditorPlugin(() => {
   };
 });
 
-export {index as default};
+export { index as default };
 //# sourceMappingURL=index.js.map