@bubblydoo/uxp-toolkit-react 0.0.8 → 0.0.10
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/index.d.ts +13 -13
- package/dist/index.js +117 -112
- package/package.json +15 -13
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,19 @@
|
|
|
1
|
-
import { Document } from 'photoshop
|
|
1
|
+
import { Document } from 'photoshop';
|
|
2
2
|
import * as _tanstack_react_query from '@tanstack/react-query';
|
|
3
3
|
import { UTLayer } from '@bubblydoo/uxp-toolkit';
|
|
4
4
|
|
|
5
|
+
declare function useActiveDocument(): Document | null;
|
|
6
|
+
|
|
7
|
+
declare function useOnDocumentEdited(document: Document, trigger: () => void): void;
|
|
8
|
+
declare function useOnDocumentLayersEdited(document: Document, trigger: () => void): void;
|
|
9
|
+
declare function useOnDocumentLayersSelection(document: Document, trigger: () => void): void;
|
|
10
|
+
|
|
11
|
+
declare function useDocumentTreeQuery<TSelect = UTLayer>(document: Document, { skip, invalidateRefetchType, select }?: {
|
|
12
|
+
skip?: boolean;
|
|
13
|
+
invalidateRefetchType?: 'none' | 'active' | 'inactive' | 'all';
|
|
14
|
+
select?: (utLayers: UTLayer[]) => TSelect;
|
|
15
|
+
}): _tanstack_react_query.UseQueryResult<_tanstack_react_query.NoInfer<TSelect>, Error>;
|
|
16
|
+
|
|
5
17
|
declare function useEventListenerSkippable({ subscribe, trigger, skip, filter, }: {
|
|
6
18
|
subscribe: (boundTrigger: () => void) => (() => void);
|
|
7
19
|
trigger: () => void;
|
|
@@ -11,8 +23,6 @@ declare function useEventListenerSkippable({ subscribe, trigger, skip, filter, }
|
|
|
11
23
|
filter: boolean;
|
|
12
24
|
}): void;
|
|
13
25
|
|
|
14
|
-
declare function useActiveDocument(): Document | null;
|
|
15
|
-
|
|
16
26
|
declare function useApplicationInfoQuery({ refetchInterval }?: {
|
|
17
27
|
refetchInterval?: number;
|
|
18
28
|
}): _tanstack_react_query.UseQueryResult<{
|
|
@@ -45,18 +55,8 @@ declare function useApplicationInfoQuery({ refetchInterval }?: {
|
|
|
45
55
|
}, Error>;
|
|
46
56
|
declare function useIsPluginPanelVisible(panelId: string): boolean | null;
|
|
47
57
|
|
|
48
|
-
declare function useOnDocumentEdited(document: Document, trigger: () => void): void;
|
|
49
|
-
declare function useOnDocumentLayersEdited(document: Document, trigger: () => void): void;
|
|
50
|
-
declare function useOnDocumentLayersSelection(document: Document, trigger: () => void): void;
|
|
51
|
-
|
|
52
58
|
declare function useOnEvent(document: Document, events: string[], trigger: () => void): void;
|
|
53
59
|
|
|
54
60
|
declare function useOpenDocuments(): Document[];
|
|
55
61
|
|
|
56
|
-
declare function useDocumentTreeQuery<TSelect = UTLayer>(document: Document, { skip, invalidateRefetchType, select }?: {
|
|
57
|
-
skip?: boolean;
|
|
58
|
-
invalidateRefetchType?: 'none' | 'active' | 'inactive' | 'all';
|
|
59
|
-
select?: (utLayers: UTLayer[]) => TSelect;
|
|
60
|
-
}): _tanstack_react_query.UseQueryResult<_tanstack_react_query.NoInfer<TSelect>, Error>;
|
|
61
|
-
|
|
62
62
|
export { useActiveDocument, useApplicationInfoQuery, useDocumentTreeQuery, useEventListenerSkippable, useIsPluginPanelVisible, useOnDocumentEdited, useOnDocumentLayersEdited, useOnDocumentLayersSelection, useOnEvent, useOpenDocuments };
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,77 @@
|
|
|
1
|
+
// src/useActiveDocument.ts
|
|
2
|
+
import { action, app } from "photoshop";
|
|
3
|
+
import { useSyncExternalStore } from "react";
|
|
4
|
+
var DOCUMENT_CHANGE_EVENTS = [
|
|
5
|
+
"select",
|
|
6
|
+
"open",
|
|
7
|
+
"close",
|
|
8
|
+
"smartBrushWorkspace",
|
|
9
|
+
"layersFiltered"
|
|
10
|
+
];
|
|
11
|
+
var activeDocumentExternalStore = {
|
|
12
|
+
subscribe: (fn) => {
|
|
13
|
+
action.addNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
|
|
14
|
+
return () => {
|
|
15
|
+
action.removeNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
|
|
16
|
+
};
|
|
17
|
+
},
|
|
18
|
+
getSnapshot: () => app.activeDocument
|
|
19
|
+
};
|
|
20
|
+
function useActiveDocument() {
|
|
21
|
+
return useSyncExternalStore(
|
|
22
|
+
activeDocumentExternalStore.subscribe,
|
|
23
|
+
activeDocumentExternalStore.getSnapshot
|
|
24
|
+
);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
// src/events.ts
|
|
28
|
+
var DOCUMENT_EDITED_EVENTS = [
|
|
29
|
+
"select",
|
|
30
|
+
"delete",
|
|
31
|
+
"make",
|
|
32
|
+
"set",
|
|
33
|
+
"move",
|
|
34
|
+
"close",
|
|
35
|
+
"show",
|
|
36
|
+
"hide",
|
|
37
|
+
"convertToProfile",
|
|
38
|
+
"selectNoLayers",
|
|
39
|
+
"historyStateChanged"
|
|
40
|
+
// this might have changed the document
|
|
41
|
+
];
|
|
42
|
+
var DOCUMENT_LAYERS_EDITED_EVENTS = [
|
|
43
|
+
// "select",
|
|
44
|
+
"delete",
|
|
45
|
+
"make",
|
|
46
|
+
"set",
|
|
47
|
+
"move",
|
|
48
|
+
"close",
|
|
49
|
+
// "show",
|
|
50
|
+
// "hide",
|
|
51
|
+
// "convertToProfile",
|
|
52
|
+
// "selectNoLayers",
|
|
53
|
+
"historyStateChanged"
|
|
54
|
+
// this might have changed the layers
|
|
55
|
+
];
|
|
56
|
+
var DOCUMENT_LAYERS_SELECTION_EVENTS = [
|
|
57
|
+
"select",
|
|
58
|
+
"deselect",
|
|
59
|
+
// "delete",
|
|
60
|
+
// "make",
|
|
61
|
+
// "set",
|
|
62
|
+
// "move",
|
|
63
|
+
// "close",
|
|
64
|
+
// "show",
|
|
65
|
+
// "hide",
|
|
66
|
+
// "convertToProfile",
|
|
67
|
+
// "selectNoLayers",
|
|
68
|
+
"historyStateChanged"
|
|
69
|
+
// this might have changed the layers selection, e.g. when deleting an undo
|
|
70
|
+
];
|
|
71
|
+
|
|
72
|
+
// src/useOnEvent.tsx
|
|
73
|
+
import { action as action2, app as app2 } from "photoshop";
|
|
74
|
+
|
|
1
75
|
// src/useEventListenerSkippable.ts
|
|
2
76
|
import { useEffect, useState } from "react";
|
|
3
77
|
function useEventListenerSkippable({
|
|
@@ -27,37 +101,11 @@ function useEventListenerSkippable({
|
|
|
27
101
|
}, [queuedWhileSkipped, trigger, skip]);
|
|
28
102
|
}
|
|
29
103
|
|
|
30
|
-
// src/useActiveDocument.ts
|
|
31
|
-
import { action, app } from "photoshop";
|
|
32
|
-
import { useSyncExternalStore } from "react";
|
|
33
|
-
var DOCUMENT_CHANGE_EVENTS = [
|
|
34
|
-
"select",
|
|
35
|
-
"open",
|
|
36
|
-
"close",
|
|
37
|
-
"smartBrushWorkspace",
|
|
38
|
-
"layersFiltered"
|
|
39
|
-
];
|
|
40
|
-
var activeDocumentExternalStore = {
|
|
41
|
-
subscribe: (fn) => {
|
|
42
|
-
action.addNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
|
|
43
|
-
return () => {
|
|
44
|
-
action.removeNotificationListener(DOCUMENT_CHANGE_EVENTS, fn);
|
|
45
|
-
};
|
|
46
|
-
},
|
|
47
|
-
getSnapshot: () => app.activeDocument
|
|
48
|
-
};
|
|
49
|
-
function useActiveDocument() {
|
|
50
|
-
return useSyncExternalStore(
|
|
51
|
-
activeDocumentExternalStore.subscribe,
|
|
52
|
-
activeDocumentExternalStore.getSnapshot
|
|
53
|
-
);
|
|
54
|
-
}
|
|
55
|
-
|
|
56
104
|
// src/useIsPluginVisible.tsx
|
|
57
|
-
import { useQuery } from "@tanstack/react-query";
|
|
58
|
-
import { entrypoints } from "uxp";
|
|
59
105
|
import { photoshopGetApplicationInfo, uxpEntrypointsSchema } from "@bubblydoo/uxp-toolkit";
|
|
60
106
|
import { createQueryKeys } from "@lukemorales/query-key-factory";
|
|
107
|
+
import { useQuery } from "@tanstack/react-query";
|
|
108
|
+
import { entrypoints } from "uxp";
|
|
61
109
|
var applicationQueries = createQueryKeys("application", {
|
|
62
110
|
info: () => ({
|
|
63
111
|
queryKey: ["info"],
|
|
@@ -76,27 +124,30 @@ function useApplicationInfoQuery({ refetchInterval } = {}) {
|
|
|
76
124
|
}
|
|
77
125
|
function useIsPluginPanelVisible(panelId) {
|
|
78
126
|
const appInfoQuery = useApplicationInfoQuery({ refetchInterval: 1e3 });
|
|
79
|
-
if (!appInfoQuery.data)
|
|
127
|
+
if (!appInfoQuery.data)
|
|
128
|
+
return null;
|
|
80
129
|
const pluginPanel = appInfoQuery.data.panelList.find((panel) => {
|
|
81
130
|
const idParts = panel.ID.split("/");
|
|
82
131
|
return idParts.includes(pluginInfo.id) && idParts.includes(panelId);
|
|
83
132
|
});
|
|
84
|
-
if (!pluginPanel)
|
|
133
|
+
if (!pluginPanel)
|
|
134
|
+
return false;
|
|
85
135
|
return pluginPanel.visible;
|
|
86
136
|
}
|
|
87
137
|
function useIsAnyPluginPanelVisible() {
|
|
88
138
|
const appInfoQuery = useApplicationInfoQuery({ refetchInterval: 1e3 });
|
|
89
|
-
if (!appInfoQuery.data)
|
|
139
|
+
if (!appInfoQuery.data)
|
|
140
|
+
return null;
|
|
90
141
|
const pluginPanel = appInfoQuery.data.panelList.find((panel) => {
|
|
91
142
|
const idParts = panel.ID.split("/");
|
|
92
143
|
return idParts.includes(pluginInfo.id);
|
|
93
144
|
});
|
|
94
|
-
if (!pluginPanel)
|
|
145
|
+
if (!pluginPanel)
|
|
146
|
+
return false;
|
|
95
147
|
return pluginPanel.visible;
|
|
96
148
|
}
|
|
97
149
|
|
|
98
150
|
// src/useOnEvent.tsx
|
|
99
|
-
import { action as action2, app as app2 } from "photoshop";
|
|
100
151
|
function useOnEvent(document, events, trigger) {
|
|
101
152
|
const isPluginPanelVisible = useIsAnyPluginPanelVisible() ?? true;
|
|
102
153
|
useEventListenerSkippable({
|
|
@@ -112,51 +163,6 @@ function useOnEvent(document, events, trigger) {
|
|
|
112
163
|
});
|
|
113
164
|
}
|
|
114
165
|
|
|
115
|
-
// src/events.ts
|
|
116
|
-
var DOCUMENT_EDITED_EVENTS = [
|
|
117
|
-
"select",
|
|
118
|
-
"delete",
|
|
119
|
-
"make",
|
|
120
|
-
"set",
|
|
121
|
-
"move",
|
|
122
|
-
"close",
|
|
123
|
-
"show",
|
|
124
|
-
"hide",
|
|
125
|
-
"convertToProfile",
|
|
126
|
-
"selectNoLayers",
|
|
127
|
-
"historyStateChanged"
|
|
128
|
-
// this might have changed the document
|
|
129
|
-
];
|
|
130
|
-
var DOCUMENT_LAYERS_EDITED_EVENTS = [
|
|
131
|
-
// "select",
|
|
132
|
-
"delete",
|
|
133
|
-
"make",
|
|
134
|
-
"set",
|
|
135
|
-
"move",
|
|
136
|
-
"close",
|
|
137
|
-
// "show",
|
|
138
|
-
// "hide",
|
|
139
|
-
// "convertToProfile",
|
|
140
|
-
// "selectNoLayers",
|
|
141
|
-
"historyStateChanged"
|
|
142
|
-
// this might have changed the layers
|
|
143
|
-
];
|
|
144
|
-
var DOCUMENT_LAYERS_SELECTION_EVENTS = [
|
|
145
|
-
"select",
|
|
146
|
-
"deselect",
|
|
147
|
-
// "delete",
|
|
148
|
-
// "make",
|
|
149
|
-
// "set",
|
|
150
|
-
// "move",
|
|
151
|
-
// "close",
|
|
152
|
-
// "show",
|
|
153
|
-
// "hide",
|
|
154
|
-
// "convertToProfile",
|
|
155
|
-
// "selectNoLayers",
|
|
156
|
-
"historyStateChanged"
|
|
157
|
-
// this might have changed the layers selection, e.g. when deleting an undo
|
|
158
|
-
];
|
|
159
|
-
|
|
160
166
|
// src/useDocumentEventsHooks.tsx
|
|
161
167
|
function useOnDocumentEdited(document, trigger) {
|
|
162
168
|
return useOnEvent(document, DOCUMENT_EDITED_EVENTS, trigger);
|
|
@@ -168,42 +174,11 @@ function useOnDocumentLayersSelection(document, trigger) {
|
|
|
168
174
|
return useOnEvent(document, DOCUMENT_LAYERS_SELECTION_EVENTS, trigger);
|
|
169
175
|
}
|
|
170
176
|
|
|
171
|
-
// src/useOpenDocuments.tsx
|
|
172
|
-
import { action as action3, app as app3 } from "photoshop";
|
|
173
|
-
import { useSyncExternalStore as useSyncExternalStore2 } from "react";
|
|
174
|
-
var OPEN_DOCUMENTS_EVENTS = ["open", "close"];
|
|
175
|
-
var cachedDocuments = null;
|
|
176
|
-
var cachedDocumentsSnapshot = null;
|
|
177
|
-
var openDocumentsExternalStore = {
|
|
178
|
-
subscribe: (fn) => {
|
|
179
|
-
action3.addNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
|
|
180
|
-
return () => {
|
|
181
|
-
action3.removeNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
|
|
182
|
-
};
|
|
183
|
-
},
|
|
184
|
-
getSnapshot: () => {
|
|
185
|
-
const currentDocuments = Array.from(app3.documents);
|
|
186
|
-
const currentSnapshot = currentDocuments.map((doc) => doc.id || doc.name).join(",");
|
|
187
|
-
if (currentSnapshot !== cachedDocumentsSnapshot) {
|
|
188
|
-
cachedDocuments = currentDocuments;
|
|
189
|
-
cachedDocumentsSnapshot = currentSnapshot;
|
|
190
|
-
}
|
|
191
|
-
return cachedDocuments || [];
|
|
192
|
-
}
|
|
193
|
-
};
|
|
194
|
-
function useOpenDocuments() {
|
|
195
|
-
return useSyncExternalStore2(
|
|
196
|
-
openDocumentsExternalStore.subscribe,
|
|
197
|
-
openDocumentsExternalStore.getSnapshot
|
|
198
|
-
);
|
|
199
|
-
}
|
|
200
|
-
|
|
201
177
|
// src/useDocumentTreeQuery.ts
|
|
202
|
-
import {
|
|
203
|
-
import { useQuery as useQuery2, useQueryClient } from "@tanstack/react-query";
|
|
204
|
-
import { getDocumentLayerDescriptors } from "@bubblydoo/uxp-toolkit";
|
|
205
|
-
import { photoshopLayerDescriptorsToUTLayers } from "@bubblydoo/uxp-toolkit";
|
|
178
|
+
import { getDocumentLayerDescriptors, photoshopLayerDescriptorsToUTLayers } from "@bubblydoo/uxp-toolkit";
|
|
206
179
|
import { createQueryKeys as createQueryKeys2 } from "@lukemorales/query-key-factory";
|
|
180
|
+
import { useQuery as useQuery2, useQueryClient } from "@tanstack/react-query";
|
|
181
|
+
import { useCallback } from "react";
|
|
207
182
|
var documentQueries = createQueryKeys2("document", {
|
|
208
183
|
tree: (documentId) => ({
|
|
209
184
|
queryKey: [documentId, "tree"],
|
|
@@ -235,6 +210,36 @@ function useDocumentTreeQuery(document, { skip, invalidateRefetchType, select }
|
|
|
235
210
|
);
|
|
236
211
|
return treeQuery;
|
|
237
212
|
}
|
|
213
|
+
|
|
214
|
+
// src/useOpenDocuments.tsx
|
|
215
|
+
import { action as action3, app as app3 } from "photoshop";
|
|
216
|
+
import { useSyncExternalStore as useSyncExternalStore2 } from "react";
|
|
217
|
+
var OPEN_DOCUMENTS_EVENTS = ["open", "close"];
|
|
218
|
+
var cachedDocuments = null;
|
|
219
|
+
var cachedDocumentsSnapshot = null;
|
|
220
|
+
var openDocumentsExternalStore = {
|
|
221
|
+
subscribe: (fn) => {
|
|
222
|
+
action3.addNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
|
|
223
|
+
return () => {
|
|
224
|
+
action3.removeNotificationListener(OPEN_DOCUMENTS_EVENTS, fn);
|
|
225
|
+
};
|
|
226
|
+
},
|
|
227
|
+
getSnapshot: () => {
|
|
228
|
+
const currentDocuments = Array.from(app3.documents);
|
|
229
|
+
const currentSnapshot = currentDocuments.map((doc) => doc.id || doc.name).join(",");
|
|
230
|
+
if (currentSnapshot !== cachedDocumentsSnapshot) {
|
|
231
|
+
cachedDocuments = currentDocuments;
|
|
232
|
+
cachedDocumentsSnapshot = currentSnapshot;
|
|
233
|
+
}
|
|
234
|
+
return cachedDocuments || [];
|
|
235
|
+
}
|
|
236
|
+
};
|
|
237
|
+
function useOpenDocuments() {
|
|
238
|
+
return useSyncExternalStore2(
|
|
239
|
+
openDocumentsExternalStore.subscribe,
|
|
240
|
+
openDocumentsExternalStore.getSnapshot
|
|
241
|
+
);
|
|
242
|
+
}
|
|
238
243
|
export {
|
|
239
244
|
useActiveDocument,
|
|
240
245
|
useApplicationInfoQuery,
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bubblydoo/uxp-toolkit-react",
|
|
3
|
-
"version": "0.0.8",
|
|
4
|
-
"license": "MIT",
|
|
5
3
|
"type": "module",
|
|
4
|
+
"version": "0.0.10",
|
|
6
5
|
"author": "Hans Otto Wirtz <hansottowirtz@gmail.com>",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"homepage": "https://github.com/bubblydoo/uxp-toolkit/tree/main/packages/uxp-toolkit-react",
|
|
7
8
|
"repository": {
|
|
8
9
|
"type": "git",
|
|
9
10
|
"url": "https://github.com/bubblydoo/uxp-toolkit.git"
|
|
10
11
|
},
|
|
11
|
-
"homepage": "https://github.com/bubblydoo/uxp-toolkit/tree/main/packages/uxp-toolkit-react",
|
|
12
12
|
"exports": {
|
|
13
13
|
".": {
|
|
14
14
|
"types": "./dist/index.d.ts",
|
|
@@ -22,29 +22,31 @@
|
|
|
22
22
|
"publishConfig": {
|
|
23
23
|
"access": "public"
|
|
24
24
|
},
|
|
25
|
-
"dependencies": {
|
|
26
|
-
"@lukemorales/query-key-factory": "^1.3.4"
|
|
27
|
-
},
|
|
28
25
|
"peerDependencies": {
|
|
29
26
|
"@tanstack/react-query": "^5.0.0",
|
|
30
27
|
"react": "^18.0.0 || ^19.0.0",
|
|
31
28
|
"zod": "^4.0.0",
|
|
32
|
-
"@bubblydoo/uxp-toolkit": "0.0.
|
|
29
|
+
"@bubblydoo/uxp-toolkit": "0.0.10"
|
|
30
|
+
},
|
|
31
|
+
"dependencies": {
|
|
32
|
+
"@lukemorales/query-key-factory": "^1.3.4"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"@adobe-uxp-types/uxp": "^0.0.9",
|
|
36
35
|
"@tanstack/react-query": "^5.0.0",
|
|
37
|
-
"@types/photoshop": "^25.0.2",
|
|
38
|
-
"@types/react": "^19.0.0",
|
|
39
36
|
"@types/node": "^20.8.7",
|
|
37
|
+
"@types/react": "^19.0.0",
|
|
40
38
|
"react": "^19.0.0",
|
|
41
|
-
"typescript": "^5.8.3",
|
|
42
39
|
"tsup": "^8.5.1",
|
|
40
|
+
"typescript": "^5.8.3",
|
|
43
41
|
"zod": "^4.3.6",
|
|
42
|
+
"@adobe-uxp-types/photoshop": "0.1.1",
|
|
43
|
+
"@adobe-uxp-types/uxp": "0.1.1",
|
|
44
44
|
"@bubblydoo/tsconfig": "0.0.3",
|
|
45
|
-
"@bubblydoo/uxp-toolkit": "0.0.
|
|
45
|
+
"@bubblydoo/uxp-toolkit": "0.0.10"
|
|
46
46
|
},
|
|
47
47
|
"scripts": {
|
|
48
|
-
"build": "tsup"
|
|
48
|
+
"build": "tsup",
|
|
49
|
+
"typecheck": "tsc --noEmit",
|
|
50
|
+
"docs-json": "typedoc --json docs.json"
|
|
49
51
|
}
|
|
50
52
|
}
|