@bubblydoo/uxp-toolkit 0.0.4 → 0.0.6

package/src/ut-tree/photoshopLayerDescriptorsToUTLayers.ts

@@ -1,6 +1,4 @@
-import { type LayerDescriptor } from "./getFlattenedLayerDescriptorsList";
-import { executeAsModal } from "../core/executeAsModal";
-import { createGetLayerCommand } from "./getLayerEffects";
+import type { LayerDescriptor } from "./getDocumentLayerDescriptors";
 
 type UTLayerKind = "pixel" | "adjustment-layer" | "text" | "curves" | "smartObject" | "video" | "group" | "threeD" | "gradientFill" | "pattern" | "solidColor" | "background";
 
@@ -15,6 +13,7 @@ type UTLayerBuilder = {
   blendMode: UTBlendMode;
   effects: Record<string, boolean>;
   isClippingMask: boolean;
+  background: boolean;
   layers?: UTLayerBuilder[];
 };
 
@@ -22,6 +21,8 @@ export type UTLayer = Readonly<Omit<UTLayerBuilder, "layers">> & {
   layers?: UTLayer[];
 };
 
+export type UTLayerMultiGetOnly = Omit<UTLayer, "effects">;
+
 const layerKindMap = new Map<number, UTLayerKind>([
   [1, "pixel"],
   [2, "adjustment-layer"], // All adjustment layers
@@ -68,20 +69,6 @@ const blendModes: string[] = [
   "passThrough",
 ] satisfies UTBlendMode[];
 
-const getLayerSectionValue = (layer: LayerDescriptor): string | undefined => {
-  if (typeof layer.layerSection === "string") {
-    return layer.layerSection;
-  }
-  if (
-    layer.layerSection &&
-    typeof layer.layerSection === "object" &&
-    "_value" in layer.layerSection
-  ) {
-    return layer.layerSection._value;
-  }
-  return undefined;
-};
-
 const getLayerKind = (layer: LayerDescriptor): UTLayerKind => {
   const kind = layerKindMap.get(layer.layerKind);
   if (!kind) {
@@ -98,54 +85,16 @@ const getBlendMode = (layer: LayerDescriptor): UTBlendMode => {
   return mode as UTBlendMode;
 };
 
-const determineLayerSection = (layer: LayerDescriptor): string => {
-  const section = getLayerSectionValue(layer);
-  const isGroupEnd =
-    layer.name === "</Layer group>" ||
-    layer.name === "</Layer set>" ||
-    section === "layerSectionEnd";
-
-  const isGroupStart = section === "layerSectionStart";
-  return isGroupStart ? "start" : isGroupEnd ? "end" : "normal";
-};
-
-// Generate a tree from a flat list of layer descriptors
-export const photoshopLayerDescriptorsToUTLayers = async (layers: LayerDescriptor[]): Promise<UTLayer[]> => {
+export function photoshopLayerDescriptorsToUTLayers(layers: LayerDescriptor[]): UTLayer[] {
   const root: UTLayerBuilder[] = [];
   const stack: {
     layers: UTLayerBuilder[];
   }[] = [{ layers: root }];
 
-  // 1. Prepare a single batch request for all layers
-  const commands = layers.map((layer) => createGetLayerCommand({ docId: layer.docId, id: layer.layerID }));
-
-  // 2. Execute one batch command instead of N commands
-  const batchResults = await executeAsModal("Get Layer Effects Data", async (ctx) => {
-    return await ctx.batchPlayCommands(commands);
-  });
-
-  // 3. Create a fast lookup map for the results
-  const effectsMap = new Map<number, UTLayerBuilder["effects"]>();
-  batchResults.forEach((result, index) => {
-    const layerId = layers[index]!.layerID;
-    const data = result.layerEffects;
-    const effects: UTLayerBuilder["effects"] = {};
-    if (data) {
-      for (const effect in data) {
-        effects[effect] = Array.isArray(data[effect]) ? data[effect].some((e) => e.enabled) : !!data[effect]?.enabled;
-      }
-    }
-    effectsMap.set(layerId, effects);
-  });
-
   for (const layer of layers) {
     // Determine if the layer is a group start or end
     const sectionType = determineLayerSection(layer);
 
-    const isClippingMask = !!batchResults.find((res, index) => {
-      return layer.layerID === res.layerID;
-    })?.group;
-
     // Handle group end
     if (sectionType === "end") {
       if (stack.length > 1) {
@@ -153,6 +102,7 @@ export const photoshopLayerDescriptorsToUTLayers = async (layers: LayerDescripto
       }
       continue;
     }
+
     // Create the node
     const node: UTLayerBuilder = {
       name: layer.name,
@@ -161,8 +111,9 @@ export const photoshopLayerDescriptorsToUTLayers = async (layers: LayerDescripto
       visible: layer.visible,
       kind: getLayerKind(layer),
       blendMode: getBlendMode(layer),
-      isClippingMask,
-      effects: effectsMap.get(layer.layerID) || {},
+      isClippingMask: layer.group,
+      effects: getEffects(layer),
+      background: layer.background,
     };
 
     // Add the node to the current level
@@ -180,3 +131,24 @@ export const photoshopLayerDescriptorsToUTLayers = async (layers: LayerDescripto
   // Cast to the readonly Tree type
   return root as UTLayer[];
 };
+
+const determineLayerSection = (layer: LayerDescriptor): "start" | "end" | "normal" => {
+  const section = layer.layerSection._value;
+  const isGroupEnd =
+    layer.name === "</Layer group>" ||
+    layer.name === "</Layer set>" ||
+    section === "layerSectionEnd";
+
+  const isGroupStart = section === "layerSectionStart";
+  return isGroupStart ? "start" : isGroupEnd ? "end" : "normal";
+};
+
+function getEffects(layer: LayerDescriptor): Record<string, boolean> {
+  const effects: Record<string, boolean> = {};
+  if (layer.layerEffects) {
+    for (const effect in layer.layerEffects) {
+      effects[effect] = Array.isArray(layer.layerEffects[effect]) ? layer.layerEffects[effect].some((e) => e.enabled) : !!layer.layerEffects[effect]?.enabled;
+    }
+  }
+  return effects;
+}

package/src/ut-tree/photoshopLayerDescriptorsToUTLayers.uxp-test.ts

@@ -1,16 +1,19 @@
 import type { Test } from "@bubblydoo/uxp-test-framework";
 import { photoshopLayerDescriptorsToUTLayers } from "./photoshopLayerDescriptorsToUTLayers";
 import { openFileByPath } from "../filesystem/openFileByPath";
-import { getFlattenedLayerDescriptorsList } from "./getFlattenedLayerDescriptorsList";
 import { expect } from "chai";
+import { getDocumentLayerDescriptors } from "./getDocumentLayerDescriptors";
 
 export const photoshopLayerDescriptorsToUTLayersTest: Test = {
   name: "photoshopLayerDescriptorsToUTLayers",
   description: "Test the photoshopLayerDescriptorsToUTLayers function",
   run: async () => {
     const doc = await openFileByPath("plugin:/fixtures/clipping-layers.psd");
-    const descriptors = await getFlattenedLayerDescriptorsList(doc.id);
-    const layers = await photoshopLayerDescriptorsToUTLayers(descriptors);
+    const descriptors = await getDocumentLayerDescriptors(doc.id);
+
+    console.log(descriptors);
+
+    const layers = photoshopLayerDescriptorsToUTLayers(descriptors);
     expect(layers).to.containSubset([
       {
         name: "circle",
@@ -50,3 +53,33 @@ export const photoshopLayerDescriptorsToUTLayersTest: Test = {
     ]);
   },
 };
+
+export const photoshopLayerDescriptorsToUTLayersTest2: Test = {
+  name: "photoshopLayerDescriptorsToUTLayers",
+  description: "Test the photoshopLayerDescriptorsToUTLayers function",
+  run: async () => {
+    const doc = await openFileByPath("plugin:/fixtures/one-layer-with-bg.psd");
+    const descriptors = await getDocumentLayerDescriptors(doc.id);
+    console.log(descriptors);
+    const layers = photoshopLayerDescriptorsToUTLayers(descriptors);
+    console.log(layers);
+    expect(layers).to.containSubset([
+      {
+        name: "Layer 1",
+        visible: true,
+        kind: "pixel",
+        blendMode: "normal",
+        isClippingMask: false,
+        effects: {},
+      },
+      {
+        name: "Background",
+        visible: true,
+        kind: "background",
+        blendMode: "normal",
+        isClippingMask: false,
+        effects: {},
+      },
+    ]);
+  },
+};

package/src/ut-tree/utLayersToText.test.ts

@@ -0,0 +1,94 @@
+import { expect, it } from "vitest";
+import { utLayersToText } from "./utLayersToText";
+
+it("converts a single layer to text", () => {
+  expect(utLayersToText([
+    {
+      name: "circle",
+      effects: {},
+      blendMode: "normal",
+      isClippingMask: false,
+      kind: "pixel",
+      visible: true,
+    },
+  ])).toMatchInlineSnapshot(`"◯ circle"`)
+});
+
+it("converts a nested layer to text", () => {
+  expect(utLayersToText([
+    {
+      name: "group",
+      effects: {},
+      blendMode: "passThrough",
+      isClippingMask: false,
+      kind: "group",
+      visible: true,
+      layers: [
+        {
+          name: "circle",
+          effects: {},
+          blendMode: "normal",
+          isClippingMask: false,
+          kind: "pixel",
+          visible: true,
+        },
+        {
+          name: "square",
+          effects: {},
+          blendMode: "normal",
+          isClippingMask: false,
+          kind: "pixel",
+          visible: true,
+        },
+        {
+          name: "other",
+          effects: {},
+          blendMode: "passThrough",
+          isClippingMask: false,
+          kind: "group",
+          visible: true,
+          layers: [
+            {
+              name: "nested",
+              effects: {},
+              blendMode: "normal",
+              isClippingMask: false,
+              kind: "pixel",
+              visible: true,
+            },
+          ],
+        },
+      ],
+    },
+  ])).toMatchInlineSnapshot(`
+    "◯ ▾ group
+    ◯    circle
+    ◯    square
+    ◯    ▾ other
+    ◯      nested"
+  `)
+});
+
+it("converts a nested layer with a clipping mask to text", () => {
+  expect(utLayersToText([
+    {
+      name: "clipper",
+      effects: {},
+      blendMode: "normal",
+      isClippingMask: true,
+      kind: "pixel",
+      visible: true,
+    },
+    {
+      name: "circle",
+      effects: {},
+      blendMode: "normal",
+      isClippingMask: false,
+      kind: "pixel",
+      visible: true,
+    },
+  ])).toMatchInlineSnapshot(`
+    "◯ ⬐ clipper
+    ◯ circle"
+  `)
+});

package/src/ut-tree/utLayersToText.ts

@@ -0,0 +1,32 @@
+import type { UTLayerPickKeys } from "../util/utLayerPickKeysType";
+import type { UTLayer } from "./photoshopLayerDescriptorsToUTLayers";
+
+const VISIBLE_ICON = "◯";
+const INVISIBLE_ICON = "⊘";
+const CLIPPING_MASK_ICON = "⬐";
+const GROUP_ICON = "▾";
+const EFFECTS_ICON = "ƒ";
+const BLEND_ICON = "⁕"
+
+type MinimalUTLayer = UTLayerPickKeys<"effects" | "visible" | "isClippingMask" | "kind" | "blendMode" | "name">;
+
+export function utLayersToText(tree: MinimalUTLayer[], depth = 0): string {
+  return tree.map((layer) => {
+    const prefix = " ".repeat(depth * 2);
+    const name = layer.name;
+    const effects = Object.keys(layer.effects).length > 0 ? EFFECTS_ICON : "";
+    const blend = isSpecialBlendMode(layer) ? BLEND_ICON : "";
+    const clippingMask = layer.isClippingMask ? CLIPPING_MASK_ICON : "";
+    const group = layer.kind === "group" ? GROUP_ICON : "";
+    const visible = layer.visible ? VISIBLE_ICON : INVISIBLE_ICON;
+    const line = [visible, prefix, clippingMask, group, name, effects, blend].filter(Boolean).join(" ");
+    if (layer.layers) {
+      return line + "\n" + utLayersToText(layer.layers, depth + 1);
+    }
+    return line;
+  }).join("\n");
+}
+
+function isSpecialBlendMode(layer: Pick<UTLayer, "kind" | "blendMode">): boolean {
+  return layer.kind === "group" ? layer.blendMode !== "passThrough" : layer.blendMode !== "normal";
+}

package/src/ut-tree/utLayersToTree.ts

@@ -14,8 +14,9 @@ export function utLayersToTree(layer: UTLayer[]): Tree<UTLayerWithoutChildren> {
       blendMode: layer.blendMode,
       isClippingMask: layer.isClippingMask,
       effects: layer.effects,
+      background: layer.background,
     },
     name: layer.name,
     children: layer.layers ? utLayersToTree(layer.layers) : undefined,
   }));
-}
+}

package/src/util/utLayerPickKeysType.ts

@@ -0,0 +1,5 @@
+import type { UTLayer } from "../ut-tree/photoshopLayerDescriptorsToUTLayers";
+
+export type UTLayerPickKeys<TKey extends keyof Omit<UTLayer, "layers">> = Pick<Omit<UTLayer, "layers">, TKey> & {
+  layers?: UTLayerPickKeys<TKey>[];
+}

package/test/index.ts

@@ -5,9 +5,10 @@ import { executeAsModalErrorTest } from "./meta-tests/executeAsModal.uxp-test";
 import { suspendHistoryTest } from "../src/core/suspendHistory.uxp-test";
 import { sourcemapsTest } from "../src/error-sourcemaps/sourcemaps.uxp-test";
 import { clipboardTest } from "../src/other/clipboard.uxp-test";
-import { photoshopLayerDescriptorsToUTLayersTest } from "../src/ut-tree/photoshopLayerDescriptorsToUTLayers.uxp-test";
+import { photoshopLayerDescriptorsToUTLayersTest, photoshopLayerDescriptorsToUTLayersTest2 } from "../src/ut-tree/photoshopLayerDescriptorsToUTLayers.uxp-test";
 import { metadataStorageTest } from "../src/metadata-storage/metadataStorage.uxp-test";
 import { builtinModulesTest } from "./meta-tests/builtinModules.uxp-test";
+import { backgroundLayerTest } from "../src/ut-tree/hasBackgroundLayer.uxp-test";
 
 export const tests = [
   applicationInfoTest,
@@ -18,6 +19,8 @@ export const tests = [
   sourcemapsTest,
   clipboardTest,
   photoshopLayerDescriptorsToUTLayersTest,
+  photoshopLayerDescriptorsToUTLayersTest2,
+  backgroundLayerTest,
   metadataStorageTest,
   builtinModulesTest,
 ];

package/vitest-photoshop-alias-plugin.ts

@@ -0,0 +1,41 @@
+import { Plugin } from "vitest/config";
+import dedent from "dedent";
+
+const nativeModules = [
+  "photoshop",
+  "uxp",
+];
+
+const pluginPrefix = "photoshop-builtin"
+
+const minimalModules = {
+  photoshop: dedent`
+export const core = UNIMPLEMENTED;
+export const action = UNIMPLEMENTED;
+export const app = UNIMPLEMENTED;
+  `,
+  uxp: dedent`
+export const entrypoints = UNIMPLEMENTED;
+export const storage = UNIMPLEMENTED;
+  `,
+}
+
+export const vitestPhotoshopAliasPlugin = (): Plugin => ({
+  name: "vitest-photoshop-alias",
+  resolveId(id) {
+    if (nativeModules.includes(id)) {
+      return `${id}?${pluginPrefix}`
+    }
+  },
+  load(id) {
+    if (id.endsWith(`?${pluginPrefix}`)) {
+      const origModuleId = id.replace(`?${pluginPrefix}`, "");
+      const mod = dedent`
+        // This is a photoshop builtin module, not available in Vitest. This is an alias to provide minimal compatibility.
+        const UNIMPLEMENTED = { __vitest_photoshop_alias_unimplemented__: true };
+        ${minimalModules[origModuleId]}
+      `;
+      return mod;
+    }
+  }
+});

package/vitest.config.ts

@@ -0,0 +1,17 @@
+import { defineConfig } from "vitest/config";
+import { vitestPhotoshopAliasPlugin } from "./vitest-photoshop-alias-plugin";
+
+export default defineConfig({
+  test: {
+    include: ["src/**/*.test.ts"],
+    reporters: process.env.CI ? ["default", "junit"] : ["default"],
+    outputFile: {
+      junit: "./test-results/junit.xml",
+    },
+    typecheck: {
+      enabled: true,
+      include: ["src/**/*.test-d.ts"],
+    },
+  },
+  plugins: [vitestPhotoshopAliasPlugin()],
+});

package/src/commands-library/getLayerProperties.ts

@@ -1,32 +0,0 @@
-import type { Document } from "photoshop/dom/Document";
-import { z } from "zod";
-import { batchPlayCommand, createCommand } from "../core/command";
-
-// get layer properties like name and layerID for all layers in the document (by index)
-export const getLayerProperties = async (document: Document) => {
-  const command = createCommand({
-    modifying: false,
-    descriptor: {
-      _obj: "multiGet",
-      _target: { _ref: [{ _ref: "document", _id: document.id }] },
-      extendedReference: [
-        ["name", "layerID", "visible"],
-        { _obj: "layer", index: 1, count: -1 },
-      ],
-    },
-    schema: z.object({
-      list: z.array(
-        z.object({
-          name: z.string(),
-          layerID: z.number(),
-          visible: z.boolean().optional(),
-        })
-      )
-    })
-  });
-  
-  const result = await batchPlayCommand(command);
-
-  // Reverse to get bottom-up order
-  return [...result.list].reverse();
-};

package/src/ut-tree/getFlattenedLayerDescriptorsList.ts

@@ -1,72 +0,0 @@
-import { getLayerProperties } from "./getLayerProperties";
-import { z } from "zod";
-import { batchPlayCommands, createCommand } from "../core/command";
-
-// export interface LayerDescriptor {
-//   name: string;
-//   layerID: number;
-//   layerSection?: string | { _value: string; _enum: string };
-//   [key: string]: any;
-// }
-
-const layerDescriptorSchema = z.object({
-  name: z.string(),
-  // id: z.number(),
-  layerID: z.number(),
-  // _docId: z.number(),
-  mode: z.object({
-    _enum: z.literal("blendMode"),
-    _value: z.string(), // passThrough, normal, multiply, screen, overlay, etc.
-  }),
-  background: z.boolean(),
-  itemIndex: z.number(),
-  visible: z.boolean(),
-  layerKind: z.number(),
-  layerSection: z.object({
-    _value: z.enum([
-      "layerSectionStart",
-      "layerSectionEnd",
-      "layerSectionContent",
-    ]),
-    _enum: z.literal("layerSectionType"),
-  }),
-});
-
-export type LayerDescriptor = z.infer<typeof layerDescriptorSchema> & {
-  docId: number;
-};
-
-// get all layers (including nested in groups)
-export const getFlattenedLayerDescriptorsList = async (
-  documentId: number
-) => {
-  const layerProperties = await getLayerProperties(documentId);
-
-  const commands = layerProperties.map((layerProp) =>
-    createCommand({
-      modifying: false,
-      descriptor: {
-        _obj: "get",
-        _target: [
-          {
-            _ref: "layer",
-            _id: layerProp.layerID,
-          },
-        ],
-        makeVisible: false,
-        layerID: [layerProp.layerID],
-        _isCommand: false,
-      },
-      schema: layerDescriptorSchema,
-    })
-  );
-
-  const layerDescriptors = await batchPlayCommands(commands);
-
-  return layerDescriptors.map((desc) => {
-    return {
-      ...desc,
-      docId: documentId,
-    };
-  });
-};

package/src/ut-tree/getLayerProperties.ts

@@ -1,35 +0,0 @@
-import { z } from "zod";
-import { batchPlayCommand, createCommand } from "../core/command";
-
-export function createGetLayerPropertiesCommand(docId: number) {
-  return createCommand({
-    modifying: false,
-    descriptor: {
-      _obj: "multiGet",
-      _target: { _ref: [{ _ref: "document", _id: docId }] },
-      extendedReference: [
-        ["name", "layerID", "visible"],
-        { _obj: "layer", index: 1, count: -1 },
-      ],
-    },
-    schema: z.object({
-      list: z.array(
-        z.object({
-          name: z.string(),
-          layerID: z.number(),
-          visible: z.boolean().optional(),
-        })
-      )
-    })
-  });
-}
-
-// get layer properties like name and layerID for all layers in the document (by index)
-export const getLayerProperties = async (documentId: number) => {
-  const command = createGetLayerPropertiesCommand(documentId);
-
-  const result = await batchPlayCommand(command);
-
-  // Reverse to get bottom-up order
-  return [...result.list].reverse();
-};