@bubblydoo/uxp-toolkit-react 0.0.6 → 0.0.8

package/dist/index.d.ts

@@ -1,5 +1,6 @@
-import * as _tanstack_react_query from '@tanstack/react-query';
 import { Document } from 'photoshop/dom/Document';
+import * as _tanstack_react_query from '@tanstack/react-query';
+import { UTLayer } from '@bubblydoo/uxp-toolkit';
 
 declare function useEventListenerSkippable({ subscribe, trigger, skip, filter, }: {
     subscribe: (boundTrigger: () => void) => (() => void);
@@ -10,7 +11,11 @@ declare function useEventListenerSkippable({ subscribe, trigger, skip, filter, }
     filter: boolean;
 }): void;
 
-declare function useApplicationInfoQuery(refetchInterval?: number): _tanstack_react_query.UseQueryResult<{
+declare function useActiveDocument(): Document | null;
+
+declare function useApplicationInfoQuery({ refetchInterval }?: {
+    refetchInterval?: number;
+}): _tanstack_react_query.UseQueryResult<{
     active: boolean;
     autoShowHomeScreen: boolean;
     available: number;
@@ -41,14 +46,17 @@ declare function useApplicationInfoQuery(refetchInterval?: number): _tanstack_re
 declare function useIsPluginPanelVisible(panelId: string): boolean | null;
 
 declare function useOnDocumentEdited(document: Document, trigger: () => void): void;
-declare function useActiveDocument(): Document | null;
-
 declare function useOnDocumentLayersEdited(document: Document, trigger: () => void): void;
-
 declare function useOnDocumentLayersSelection(document: Document, trigger: () => void): void;
 
 declare function useOnEvent(document: Document, events: string[], trigger: () => void): void;
 
 declare function useOpenDocuments(): Document[];
 
-export { useActiveDocument, useApplicationInfoQuery, useEventListenerSkippable, useIsPluginPanelVisible, useOnDocumentEdited, useOnDocumentLayersEdited, useOnDocumentLayersSelection, useOnEvent, useOpenDocuments };
+declare function useDocumentTreeQuery<TSelect = UTLayer>(document: Document, { skip, invalidateRefetchType, select }?: {
+    skip?: boolean;
+    invalidateRefetchType?: 'none' | 'active' | 'inactive' | 'all';
+    select?: (utLayers: UTLayer[]) => TSelect;
+}): _tanstack_react_query.UseQueryResult<_tanstack_react_query.NoInfer<TSelect>, Error>;
+
+export { useActiveDocument, useApplicationInfoQuery, useDocumentTreeQuery, useEventListenerSkippable, useIsPluginPanelVisible, useOnDocumentEdited, useOnDocumentLayersEdited, useOnDocumentLayersSelection, useOnEvent, useOpenDocuments };

package/dist/index.js

@@ -27,23 +27,55 @@ function useEventListenerSkippable({
   }, [queuedWhileSkipped, trigger, skip]);
 }
 
+// src/useActiveDocument.ts
+import { action, app } from "photoshop";
+import { useSyncExternalStore } from "react";
+var DOCUMENT_CHANGE_EVENTS = [
+  "select",
+  "open",
+  "close",
+  "smartBrushWorkspace",
+  "layersFiltered"
+];
+var activeDocumentExternalStore = {
+  subscribe: (fn) => {
+    action.addNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
+    return () => {
+      action.removeNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
+    };
+  },
+  getSnapshot: () => app.activeDocument
+};
+function useActiveDocument() {
+  return useSyncExternalStore(
+    activeDocumentExternalStore.subscribe,
+    activeDocumentExternalStore.getSnapshot
+  );
+}
+
 // src/useIsPluginVisible.tsx
 import { useQuery } from "@tanstack/react-query";
 import { entrypoints } from "uxp";
 import { photoshopGetApplicationInfo, uxpEntrypointsSchema } from "@bubblydoo/uxp-toolkit";
-var pluginInfo = uxpEntrypointsSchema.parse(entrypoints)._pluginInfo;
-function useApplicationInfoQuery(refetchInterval = 1e3) {
-  return useQuery({
-    queryKey: ["application-info"],
+import { createQueryKeys } from "@lukemorales/query-key-factory";
+var applicationQueries = createQueryKeys("application", {
+  info: () => ({
+    queryKey: ["info"],
     queryFn: async () => {
       const appInfo = await photoshopGetApplicationInfo();
       return appInfo;
-    },
-    refetchInterval
+    }
+  })
+});
+var pluginInfo = uxpEntrypointsSchema.parse(entrypoints)._pluginInfo;
+function useApplicationInfoQuery({ refetchInterval } = {}) {
+  return useQuery({
+    ...applicationQueries.info(),
+    refetchInterval: refetchInterval ?? 1e3
   });
 }
 function useIsPluginPanelVisible(panelId) {
-  const appInfoQuery = useApplicationInfoQuery(1e3);
+  const appInfoQuery = useApplicationInfoQuery({ refetchInterval: 1e3 });
   if (!appInfoQuery.data) return null;
   const pluginPanel = appInfoQuery.data.panelList.find((panel) => {
     const idParts = panel.ID.split("/");
@@ -53,7 +85,7 @@ function useIsPluginPanelVisible(panelId) {
   return pluginPanel.visible;
 }
 function useIsAnyPluginPanelVisible() {
-  const appInfoQuery = useApplicationInfoQuery(1e3);
+  const appInfoQuery = useApplicationInfoQuery({ refetchInterval: 1e3 });
   if (!appInfoQuery.data) return null;
   const pluginPanel = appInfoQuery.data.panelList.find((panel) => {
     const idParts = panel.ID.split("/");
@@ -63,63 +95,39 @@ function useIsAnyPluginPanelVisible() {
   return pluginPanel.visible;
 }
 
-// src/useOnDocumentEdited.tsx
-import { action, app } from "photoshop";
-import { useSyncExternalStore } from "react";
-var EVENTS = [
-  "select",
-  "delete",
-  "make",
-  "set",
-  "move",
-  "close",
-  "show",
-  "hide",
-  "convertToProfile",
-  "selectNoLayers",
-  "historyStateChanged"
-  // this might have changed the document
-];
-function useOnDocumentEdited(document, trigger) {
+// src/useOnEvent.tsx
+import { action as action2, app as app2 } from "photoshop";
+function useOnEvent(document, events, trigger) {
   const isPluginPanelVisible = useIsAnyPluginPanelVisible() ?? true;
   useEventListenerSkippable({
     trigger,
     subscribe: (boundTrigger) => {
-      action.addNotificationListener(EVENTS, boundTrigger);
+      action2.addNotificationListener(events, boundTrigger);
       return () => {
-        action.removeNotificationListener(EVENTS, boundTrigger);
+        action2.removeNotificationListener(events, boundTrigger);
       };
     },
     skip: !isPluginPanelVisible,
-    filter: document === app.activeDocument
+    filter: document === app2.activeDocument
   });
 }
-var DOCUMENT_CHANGE_EVENTS = [
+
+// src/events.ts
+var DOCUMENT_EDITED_EVENTS = [
   "select",
-  "open",
+  "delete",
+  "make",
+  "set",
+  "move",
   "close",
-  "smartBrushWorkspace",
-  "layersFiltered"
+  "show",
+  "hide",
+  "convertToProfile",
+  "selectNoLayers",
+  "historyStateChanged"
+  // this might have changed the document
 ];
-var activeDocumentExternalStore = {
-  subscribe: (fn) => {
-    action.addNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
-    return () => {
-      action.removeNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
-    };
-  },
-  getSnapshot: () => app.activeDocument
-};
-function useActiveDocument() {
-  return useSyncExternalStore(
-    activeDocumentExternalStore.subscribe,
-    activeDocumentExternalStore.getSnapshot
-  );
-}
-
-// src/useOnDocumentLayersEdited.tsx
-import { action as action2, app as app2 } from "photoshop";
-var EVENTS2 = [
+var DOCUMENT_LAYERS_EDITED_EVENTS = [
   // "select",
   "delete",
   "make",
@@ -133,24 +141,7 @@ var EVENTS2 = [
   "historyStateChanged"
   // this might have changed the layers
 ];
-function useOnDocumentLayersEdited(document, trigger) {
-  const isPluginPanelVisible = useIsAnyPluginPanelVisible() ?? true;
-  useEventListenerSkippable({
-    trigger,
-    subscribe: (boundTrigger) => {
-      action2.addNotificationListener(EVENTS2, boundTrigger);
-      return () => {
-        action2.removeNotificationListener(EVENTS2, boundTrigger);
-      };
-    },
-    skip: !isPluginPanelVisible,
-    filter: document === app2.activeDocument
-  });
-}
-
-// src/useOnDocumentLayersSelection.tsx
-import { action as action3, app as app3 } from "photoshop";
-var EVENTS3 = [
+var DOCUMENT_LAYERS_SELECTION_EVENTS = [
   "select",
   "deselect",
   // "delete",
@@ -165,53 +156,33 @@ var EVENTS3 = [
   "historyStateChanged"
   // this might have changed the layers selection, e.g. when deleting an undo
 ];
-function useOnDocumentLayersSelection(document, trigger) {
-  const isPluginPanelVisible = useIsAnyPluginPanelVisible() ?? true;
-  useEventListenerSkippable({
-    trigger,
-    subscribe: (boundTrigger) => {
-      action3.addNotificationListener(EVENTS3, boundTrigger);
-      return () => {
-        action3.removeNotificationListener(EVENTS3, boundTrigger);
-      };
-    },
-    skip: !isPluginPanelVisible,
-    filter: document === app3.activeDocument
-  });
-}
 
-// src/useOnEvent.tsx
-import { action as action4, app as app4 } from "photoshop";
-function useOnEvent(document, events, trigger) {
-  const isPluginPanelVisible = useIsAnyPluginPanelVisible() ?? true;
-  useEventListenerSkippable({
-    trigger,
-    subscribe: (boundTrigger) => {
-      action4.addNotificationListener(events, boundTrigger);
-      return () => {
-        action4.removeNotificationListener(events, boundTrigger);
-      };
-    },
-    skip: !isPluginPanelVisible,
-    filter: document === app4.activeDocument
-  });
+// src/useDocumentEventsHooks.tsx
+function useOnDocumentEdited(document, trigger) {
+  return useOnEvent(document, DOCUMENT_EDITED_EVENTS, trigger);
+}
+function useOnDocumentLayersEdited(document, trigger) {
+  return useOnEvent(document, DOCUMENT_LAYERS_EDITED_EVENTS, trigger);
+}
+function useOnDocumentLayersSelection(document, trigger) {
+  return useOnEvent(document, DOCUMENT_LAYERS_SELECTION_EVENTS, trigger);
 }
 
 // src/useOpenDocuments.tsx
-import { action as action5, app as app5 } from "photoshop";
+import { action as action3, app as app3 } from "photoshop";
 import { useSyncExternalStore as useSyncExternalStore2 } from "react";
 var OPEN_DOCUMENTS_EVENTS = ["open", "close"];
 var cachedDocuments = null;
 var cachedDocumentsSnapshot = null;
 var openDocumentsExternalStore = {
   subscribe: (fn) => {
-    action5.addNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
+    action3.addNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
     return () => {
-      action5.removeNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
+      action3.removeNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
     };
   },
   getSnapshot: () => {
-    const currentDocuments = Array.from(app5.documents);
+    const currentDocuments = Array.from(app3.documents);
     const currentSnapshot = currentDocuments.map((doc) => doc.id || doc.name).join(",");
     if (currentSnapshot !== cachedDocumentsSnapshot) {
       cachedDocuments = currentDocuments;
@@ -226,9 +197,48 @@ function useOpenDocuments() {
     openDocumentsExternalStore.getSnapshot
   );
 }
+
+// src/useDocumentTreeQuery.ts
+import { useCallback } from "react";
+import { useQuery as useQuery2, useQueryClient } from "@tanstack/react-query";
+import { getDocumentLayerDescriptors } from "@bubblydoo/uxp-toolkit";
+import { photoshopLayerDescriptorsToUTLayers } from "@bubblydoo/uxp-toolkit";
+import { createQueryKeys as createQueryKeys2 } from "@lukemorales/query-key-factory";
+var documentQueries = createQueryKeys2("document", {
+  tree: (documentId) => ({
+    queryKey: [documentId, "tree"],
+    queryFn: async () => {
+      const layerDescriptors = await getDocumentLayerDescriptors(documentId);
+      return photoshopLayerDescriptorsToUTLayers(layerDescriptors);
+    }
+  })
+});
+function useDocumentTreeQuery(document, { skip, invalidateRefetchType, select } = {}) {
+  const queryClient = useQueryClient();
+  const isPluginVisible = useIsAnyPluginPanelVisible() ?? true;
+  const enabled = !skip && isPluginVisible;
+  const treeQuery = useQuery2({
+    ...documentQueries.tree(document.id),
+    enabled,
+    staleTime: Infinity,
+    refetchOnWindowFocus: false,
+    select
+  });
+  useOnDocumentLayersEdited(
+    document,
+    useCallback(() => {
+      queryClient.invalidateQueries({
+        queryKey: documentQueries.tree(document.id).queryKey,
+        refetchType: invalidateRefetchType
+      });
+    }, [queryClient, invalidateRefetchType, document.id])
+  );
+  return treeQuery;
+}
 export {
   useActiveDocument,
   useApplicationInfoQuery,
+  useDocumentTreeQuery,
   useEventListenerSkippable,
   useIsPluginPanelVisible,
   useOnDocumentEdited,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bubblydoo/uxp-toolkit-react",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "license": "MIT",
   "type": "module",
   "author": "Hans Otto Wirtz <hansottowirtz@gmail.com>",
@@ -22,11 +22,14 @@
   "publishConfig": {
     "access": "public"
   },
+  "dependencies": {
+    "@lukemorales/query-key-factory": "^1.3.4"
+  },
   "peerDependencies": {
     "@tanstack/react-query": "^5.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "zod": "^4.0.0",
-    "@bubblydoo/uxp-toolkit": "0.0.6"
+    "@bubblydoo/uxp-toolkit": "0.0.8"
   },
   "devDependencies": {
     "@adobe-uxp-types/uxp": "^0.0.9",
@@ -39,7 +42,7 @@
     "tsup": "^8.5.1",
     "zod": "^4.3.6",
     "@bubblydoo/tsconfig": "0.0.3",
-    "@bubblydoo/uxp-toolkit": "0.0.6"
+    "@bubblydoo/uxp-toolkit": "0.0.8"
   },
   "scripts": {
     "build": "tsup"