@kittl/sdk 0.0.9 → 1.0.0-alpha.1

package/dist/sharedFileBrowser/sdk.esm.js

@@ -2,6 +2,10 @@
 /*! Kittl SDK - https://kittl.com - see license for terms */
 
 var FROM_EXTENSION_COMMANDS = {
+  /** Capability-owned AI callback registration. */
+  AI_GENERATOR_SUBSCRIBE: "ai-generator-subscribe",
+  /** Capability-owned AI callback teardown. */
+  AI_GENERATOR_UNSUBSCRIBE: "ai-generator-unsubscribe",
   /** SDK API call */
   SDK_CALL: "sdk-call",
   /** AI handler registration */
@@ -50,6 +54,8 @@ var FROM_EXTENSION_COMMANDS = {
   LOADED: "loaded"
 };
 var TO_EXTENSION_COMMANDS = {
+  /** Callback payload for generator or pending-set subscriptions. */
+  AI_GENERATOR_UPDATE: "ai-generator-update",
   /** SDK API response */
   SDK_RESPONSE: "sdk-response",
   /** File browser fetch content request */
@@ -66,6 +72,10 @@ var TO_EXTENSION_COMMANDS = {
   APP_STATE_UPDATE: "app-state-update"
 };
 
+function isAIGeneratorUpdateMessage(data) {
+  return !!data && typeof data === "object" && "command" in data && data.command === "ai-generator-update" && "subscriptionId" in data && typeof data.subscriptionId === "string";
+}
+
 var isSDKResponseMessage = (data) => {
   return typeof data === "object" && data !== null && "command" in data && data.command === TO_EXTENSION_COMMANDS.SDK_RESPONSE && "messageId" in data && typeof data.messageId === "string";
 };
@@ -135,7 +145,10 @@ var APPROVED_EXTENSION_COMMUNICATION_DOMAINS = [
   "https://app.stagingdesigner.com",
   "https://*.stagingdesigner.com",
   "http://localhost:3000",
-  "https://app.kittl.com"
+  "https://app.kittl.com",
+  // website, for sandboxed standalone dashboard pages
+  "http://localhost:3003",
+  "https://www.kittl.com"
 ];
 var toOrigin = (value) => {
   if (!value) {
@@ -190,8 +203,15 @@ var getParentDomain = () => {
 };
 
 var pendingRequests = /* @__PURE__ */ new Map();
+var sdkVersion;
+function setSDKVersion(version2) {
+  sdkVersion = version2;
+}
 var postMessageToParent = (message) => {
-  window.parent.postMessage(message, getParentDomain());
+  window.parent.postMessage(
+    sdkVersion === void 0 ? message : { ...message, sdkVersion },
+    getParentDomain()
+  );
 };
 var sendMessage = (message) => {
   postMessageToParent(message);
@@ -214,6 +234,27 @@ var sendLoaded = () => {
 };
 
 var createSDKCallMessage = {
+  aiGenerator: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "aiGenerator"
+  }),
+  mockup: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "mockup"
+  }),
+  fileBrowser: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "fileBrowser"
+  }),
   ai: (dots, args, messageId) => ({
     command: FROM_EXTENSION_COMMANDS.SDK_CALL,
     dots,
@@ -249,6 +290,13 @@ var createSDKCallMessage = {
     messageId,
     apiType: "font"
   }),
+  project: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "project"
+  }),
   state: (dots, args, messageId) => ({
     command: FROM_EXTENSION_COMMANDS.SDK_CALL,
     dots,
@@ -269,6 +317,27 @@ var createSDKCallMessage = {
     args,
     messageId,
     apiType: "data"
+  }),
+  brandKit: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "brandKit"
+  }),
+  openMicroEditor: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "openMicroEditor"
+  }),
+  openMainEditor: (dots, args, messageId) => ({
+    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+    dots,
+    args,
+    messageId,
+    apiType: "openMainEditor"
   })
 };
 function createApiProxy(apiType) {
@@ -285,6 +354,64 @@ function createApiProxy(apiType) {
   });
 }
 
+function createAIGeneratorBridgeApi() {
+  const callbacks = /* @__PURE__ */ new Map();
+  const proxy = createApiProxy("aiGenerator");
+  async function subscribe(request, callback) {
+    const subscriptionId = generateMessageId();
+    callbacks.set(subscriptionId, callback);
+    let response;
+    try {
+      response = await sendMessage({
+        command: "ai-generator-subscribe",
+        ...request,
+        subscriptionId,
+        messageId: generateMessageId()
+      });
+    } catch (error) {
+      callbacks.delete(subscriptionId);
+      throw error;
+    }
+    if (!response.isOk) {
+      callbacks.delete(subscriptionId);
+      throw new Error(response.error.message);
+    }
+    return () => {
+      callbacks.delete(subscriptionId);
+      postMessageToParent({
+        command: "ai-generator-unsubscribe",
+        subscriptionId
+      });
+    };
+  }
+  const methods = {
+    registerGenerator: (id, callback) => subscribe({ method: "registerGenerator", args: [id] }, (update) => {
+      if (update) callback(update);
+    }),
+    subscribeToGenerationUpdates: (ids, callback) => subscribe(
+      { method: "subscribeToGenerationUpdates", args: [ids] },
+      (update) => {
+        if (update) callback(update);
+      }
+    ),
+    subscribeToPendingGenerations: (callback) => subscribe(
+      { method: "subscribeToPendingGenerations", args: [] },
+      () => callback()
+    ),
+    /** Callers may reuse richer internal submission objects; never send their local abort callbacks. */
+    cancelGenerations: (submission) => proxy.cancelGenerations({
+      generationIds: submission.generationIds,
+      until: submission.until
+    })
+  };
+  return {
+    api: new Proxy(proxy, {
+      get: (target, property, receiver) => property in methods ? methods[property] : Reflect.get(target, property, receiver)
+    }),
+    dispatch: (message) => callbacks.get(message.subscriptionId)?.(message.update)
+  };
+}
+
 var generationHandlers = /* @__PURE__ */ new Map();
 var generationSubscriptions = /* @__PURE__ */ new Map();
 var dispatchAIGenerationUpdate = (subscriptionId, update) => {
@@ -652,7 +779,7 @@ var SandboxedAuthClient = class {
   }
 };
 
-var createBatch = async () => {
+var createBatchFor = async (apiType) => {
   const response = await sendMessage({
     command: FROM_EXTENSION_COMMANDS.BATCH_CREATE,
     messageId: generateMessageId()
@@ -661,14 +788,17 @@ var createBatch = async () => {
     throw response.error;
   }
   const { batchKey } = response.result;
-  const sendDesignCall = (dots, args) => sendMessage({
-    command: FROM_EXTENSION_COMMANDS.SDK_CALL,
-    dots,
-    args,
-    messageId: generateMessageId(),
-    apiType: "design",
-    batchKey
-  });
+  const sendDesignCall = (dots, args) => {
+    const message = {
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots: apiType === "project" ? ["design", "api", ...dots] : dots,
+      args,
+      messageId: generateMessageId(),
+      apiType,
+      batchKey
+    };
+    return sendMessage(message);
+  };
   const commit = async () => {
     const res = await sendMessage({
       command: FROM_EXTENSION_COMMANDS.BATCH_COMMIT,
@@ -695,6 +825,8 @@ var createBatch = async () => {
   };
   return buildNode([]);
 };
+var createBatch = () => createBatchFor("design");
+var createProjectBatch = () => createBatchFor("project");
 
 var createContextBridgeApi = () => {
   const contextProxy = createApiProxy("context");
@@ -862,6 +994,7 @@ var designStateApi = createDesignStateBridgeApi();
 var appStateApi = createAppStateBridgeApi();
 var { api: contextApi, dispatch: dispatchContextUpdate } = createContextBridgeApi();
 var authClient = new SandboxedAuthClient();
+var aiGeneratorBridge = createAIGeneratorBridgeApi();
 var handleIncomingMessage = (event) => {
   const parent = window.parent;
   if (!parent || parent === window) {
@@ -884,6 +1017,10 @@ var handleIncomingMessage = (event) => {
     statelessApi.dispatch(data.type, data.payload);
     return;
   }
+  if (isAIGeneratorUpdateMessage(data)) {
+    aiGeneratorBridge.dispatch(data);
+    return;
+  }
   if (isAIGenerationUpdatePushMessage(data)) {
     dispatchAIGenerationUpdate(data.subscriptionId, data.update);
     return;
@@ -908,7 +1045,28 @@ var handleIncomingMessage = (event) => {
     );
   }
 };
+var projectProxy = createApiProxy("project");
+var projectApi = {
+  design: {
+    state: {
+      getState: projectProxy.design.state.getState,
+      subscribe: designStateApi.subscribe
+    },
+    api: projectProxy.design.api,
+    createBatch: createProjectBatch
+  },
+  app: {
+    state: {
+      getState: projectProxy.app.state.getState,
+      subscribe: appStateApi.subscribe
+    },
+    api: projectProxy.app.api
+  }
+};
 var bridgeHandlers = {
+  aiGenerator: aiGeneratorBridge.api,
+  brandKit: createApiProxy("brandKit"),
+  mockup: createApiProxy("mockup"),
   ai: createAIApiProxy(),
   context: contextApi,
   data: createApiProxy("data"),
@@ -917,12 +1075,17 @@ var bridgeHandlers = {
   appStore: appStateApi,
   export: createApiProxy("export"),
   font: createApiProxy("font"),
+  project: projectApi,
   state: createApiProxy("state"),
   upload: createApiProxy("upload"),
-  fileBrowser: createFileBrowserApiProxy(),
+  fileBrowser: { getFiles: createApiProxy("fileBrowser").getFiles },
+  fileBrowserRegistration: createFileBrowserApiProxy(),
+  openMicroEditor: createApiProxy("openMicroEditor"),
+  openMainEditor: createApiProxy("openMainEditor"),
   auth: authClient,
   stateless: statelessApi,
-  createBatch
+  createBatch,
+  createProjectBatch
 };
 
 // src/api/utils.ts
@@ -933,6 +1096,9 @@ function unwrapResult(result) {
   throw result.error;
 }
 
+// package.json
+var version = "1.0.0";
+
 // src/utils/syncHtmlDataThemeFromHostContext.ts
 async function syncHtmlDataThemeFromHostContext(kittl2) {
   if (typeof document === "undefined") {
@@ -973,12 +1139,17 @@ function createKittlSDK(apis) {
         handleIncomingMessage(event);
       }
     );
-    void syncHtmlDataThemeFromHostContext(kittl2).then(() => {
+    const { context } = apis;
+    const themeSynced = context?.get && context.subscribe ? syncHtmlDataThemeFromHostContext({
+      context
+    }) : Promise.resolve();
+    void themeSynced.catch(() => void 0).then(() => {
       kittl2.onLoadedCallback?.();
       sendLoaded();
     });
   };
   if (typeof document !== "undefined" && typeof window !== "undefined") {
+    setSDKVersion(version);
     window.kittl = kittl2;
     if (document.readyState === "loading") {
       document.addEventListener("DOMContentLoaded", initSdk);
@@ -992,8 +1163,13 @@ function createKittlSDK(apis) {
 // src/sharedFileBrowser.ts
 var kittl = createKittlSDK({
   auth: bridgeHandlers.auth,
-  context: bridgeHandlers.context,
-  fileBrowser: bridgeHandlers.fileBrowser
+  // context only carries tab registration here: the file browser is hidden, so
+  // it has no theme to follow and nothing to drag
+  context: {
+    registerUploadBrowser: bridgeHandlers.fileBrowserRegistration.registerUploadBrowser
+  },
+  // Both locations share callback tracking so existing file-browser extensions work unchanged.
+  fileBrowser: bridgeHandlers.fileBrowserRegistration
 });
 export {
   kittl,

package/dist/sharedFileBrowser/sdk.js

@@ -5,6 +5,10 @@
 (() => {
 
   var FROM_EXTENSION_COMMANDS = {
+    /** Capability-owned AI callback registration. */
+    AI_GENERATOR_SUBSCRIBE: "ai-generator-subscribe",
+    /** Capability-owned AI callback teardown. */
+    AI_GENERATOR_UNSUBSCRIBE: "ai-generator-unsubscribe",
     /** SDK API call */
     SDK_CALL: "sdk-call",
     /** AI handler registration */
@@ -53,6 +57,8 @@
     LOADED: "loaded"
   };
   var TO_EXTENSION_COMMANDS = {
+    /** Callback payload for generator or pending-set subscriptions. */
+    AI_GENERATOR_UPDATE: "ai-generator-update",
     /** SDK API response */
     SDK_RESPONSE: "sdk-response",
     /** File browser fetch content request */
@@ -69,6 +75,10 @@
     APP_STATE_UPDATE: "app-state-update"
   };
 
+  function isAIGeneratorUpdateMessage(data) {
+    return !!data && typeof data === "object" && "command" in data && data.command === "ai-generator-update" && "subscriptionId" in data && typeof data.subscriptionId === "string";
+  }
+
   var isSDKResponseMessage = (data) => {
     return typeof data === "object" && data !== null && "command" in data && data.command === TO_EXTENSION_COMMANDS.SDK_RESPONSE && "messageId" in data && typeof data.messageId === "string";
   };
@@ -138,7 +148,10 @@
     "https://app.stagingdesigner.com",
     "https://*.stagingdesigner.com",
     "http://localhost:3000",
-    "https://app.kittl.com"
+    "https://app.kittl.com",
+    // website, for sandboxed standalone dashboard pages
+    "http://localhost:3003",
+    "https://www.kittl.com"
   ];
   var toOrigin = (value) => {
     if (!value) {
@@ -193,8 +206,15 @@
   };
 
   var pendingRequests = /* @__PURE__ */ new Map();
+  var sdkVersion;
+  function setSDKVersion(version2) {
+    sdkVersion = version2;
+  }
   var postMessageToParent = (message) => {
-    window.parent.postMessage(message, getParentDomain());
+    window.parent.postMessage(
+      sdkVersion === void 0 ? message : { ...message, sdkVersion },
+      getParentDomain()
+    );
   };
   var sendMessage = (message) => {
     postMessageToParent(message);
@@ -217,6 +237,27 @@
   };
 
   var createSDKCallMessage = {
+    aiGenerator: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "aiGenerator"
+    }),
+    mockup: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "mockup"
+    }),
+    fileBrowser: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "fileBrowser"
+    }),
     ai: (dots, args, messageId) => ({
       command: FROM_EXTENSION_COMMANDS.SDK_CALL,
       dots,
@@ -252,6 +293,13 @@
       messageId,
       apiType: "font"
     }),
+    project: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "project"
+    }),
     state: (dots, args, messageId) => ({
       command: FROM_EXTENSION_COMMANDS.SDK_CALL,
       dots,
@@ -272,6 +320,27 @@
       args,
       messageId,
       apiType: "data"
+    }),
+    brandKit: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "brandKit"
+    }),
+    openMicroEditor: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "openMicroEditor"
+    }),
+    openMainEditor: (dots, args, messageId) => ({
+      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+      dots,
+      args,
+      messageId,
+      apiType: "openMainEditor"
     })
   };
   function createApiProxy(apiType) {
@@ -288,6 +357,64 @@
     });
   }
 
+  function createAIGeneratorBridgeApi() {
+    const callbacks = /* @__PURE__ */ new Map();
+    const proxy = createApiProxy("aiGenerator");
+    async function subscribe(request, callback) {
+      const subscriptionId = generateMessageId();
+      callbacks.set(subscriptionId, callback);
+      let response;
+      try {
+        response = await sendMessage({
+          command: "ai-generator-subscribe",
+          ...request,
+          subscriptionId,
+          messageId: generateMessageId()
+        });
+      } catch (error) {
+        callbacks.delete(subscriptionId);
+        throw error;
+      }
+      if (!response.isOk) {
+        callbacks.delete(subscriptionId);
+        throw new Error(response.error.message);
+      }
+      return () => {
+        callbacks.delete(subscriptionId);
+        postMessageToParent({
+          command: "ai-generator-unsubscribe",
+          subscriptionId
+        });
+      };
+    }
+    const methods = {
+      registerGenerator: (id, callback) => subscribe({ method: "registerGenerator", args: [id] }, (update) => {
+        if (update) callback(update);
+      }),
+      subscribeToGenerationUpdates: (ids, callback) => subscribe(
+        { method: "subscribeToGenerationUpdates", args: [ids] },
+        (update) => {
+          if (update) callback(update);
+        }
+      ),
+      subscribeToPendingGenerations: (callback) => subscribe(
+        { method: "subscribeToPendingGenerations", args: [] },
+        () => callback()
+      ),
+      /** Callers may reuse richer internal submission objects; never send their local abort callbacks. */
+      cancelGenerations: (submission) => proxy.cancelGenerations({
+        generationIds: submission.generationIds,
+        until: submission.until
+      })
+    };
+    return {
+      api: new Proxy(proxy, {
+        get: (target, property, receiver) => property in methods ? methods[property] : Reflect.get(target, property, receiver)
+      }),
+      dispatch: (message) => callbacks.get(message.subscriptionId)?.(message.update)
+    };
+  }
+
   var generationHandlers = /* @__PURE__ */ new Map();
   var generationSubscriptions = /* @__PURE__ */ new Map();
   var dispatchAIGenerationUpdate = (subscriptionId, update) => {
@@ -655,7 +782,7 @@
     }
   };
 
-  var createBatch = async () => {
+  var createBatchFor = async (apiType) => {
     const response = await sendMessage({
       command: FROM_EXTENSION_COMMANDS.BATCH_CREATE,
       messageId: generateMessageId()
@@ -664,14 +791,17 @@
       throw response.error;
     }
     const { batchKey } = response.result;
-    const sendDesignCall = (dots, args) => sendMessage({
-      command: FROM_EXTENSION_COMMANDS.SDK_CALL,
-      dots,
-      args,
-      messageId: generateMessageId(),
-      apiType: "design",
-      batchKey
-    });
+    const sendDesignCall = (dots, args) => {
+      const message = {
+        command: FROM_EXTENSION_COMMANDS.SDK_CALL,
+        dots: apiType === "project" ? ["design", "api", ...dots] : dots,
+        args,
+        messageId: generateMessageId(),
+        apiType,
+        batchKey
+      };
+      return sendMessage(message);
+    };
     const commit = async () => {
       const res = await sendMessage({
         command: FROM_EXTENSION_COMMANDS.BATCH_COMMIT,
@@ -698,6 +828,8 @@
     };
     return buildNode([]);
   };
+  var createBatch = () => createBatchFor("design");
+  var createProjectBatch = () => createBatchFor("project");
 
   var createContextBridgeApi = () => {
     const contextProxy = createApiProxy("context");
@@ -865,6 +997,7 @@
   var appStateApi = createAppStateBridgeApi();
   var { api: contextApi, dispatch: dispatchContextUpdate } = createContextBridgeApi();
   var authClient = new SandboxedAuthClient();
+  var aiGeneratorBridge = createAIGeneratorBridgeApi();
   var handleIncomingMessage = (event) => {
     const parent = window.parent;
     if (!parent || parent === window) {
@@ -887,6 +1020,10 @@
       statelessApi.dispatch(data.type, data.payload);
       return;
     }
+    if (isAIGeneratorUpdateMessage(data)) {
+      aiGeneratorBridge.dispatch(data);
+      return;
+    }
     if (isAIGenerationUpdatePushMessage(data)) {
       dispatchAIGenerationUpdate(data.subscriptionId, data.update);
       return;
@@ -911,7 +1048,28 @@
       );
     }
   };
+  var projectProxy = createApiProxy("project");
+  var projectApi = {
+    design: {
+      state: {
+        getState: projectProxy.design.state.getState,
+        subscribe: designStateApi.subscribe
+      },
+      api: projectProxy.design.api,
+      createBatch: createProjectBatch
+    },
+    app: {
+      state: {
+        getState: projectProxy.app.state.getState,
+        subscribe: appStateApi.subscribe
+      },
+      api: projectProxy.app.api
+    }
+  };
   var bridgeHandlers = {
+    aiGenerator: aiGeneratorBridge.api,
+    brandKit: createApiProxy("brandKit"),
+    mockup: createApiProxy("mockup"),
     ai: createAIApiProxy(),
     context: contextApi,
     data: createApiProxy("data"),
@@ -920,12 +1078,17 @@
     appStore: appStateApi,
     export: createApiProxy("export"),
     font: createApiProxy("font"),
+    project: projectApi,
     state: createApiProxy("state"),
     upload: createApiProxy("upload"),
-    fileBrowser: createFileBrowserApiProxy(),
+    fileBrowser: { getFiles: createApiProxy("fileBrowser").getFiles },
+    fileBrowserRegistration: createFileBrowserApiProxy(),
+    openMicroEditor: createApiProxy("openMicroEditor"),
+    openMainEditor: createApiProxy("openMainEditor"),
     auth: authClient,
     stateless: statelessApi,
-    createBatch
+    createBatch,
+    createProjectBatch
   };
 
   // src/api/utils.ts
@@ -936,6 +1099,9 @@
     throw result.error;
   }
 
+  // package.json
+  var version = "1.0.0";
+
   // src/utils/syncHtmlDataThemeFromHostContext.ts
   async function syncHtmlDataThemeFromHostContext(kittl2) {
     if (typeof document === "undefined") {
@@ -976,12 +1142,17 @@
           handleIncomingMessage(event);
         }
       );
-      void syncHtmlDataThemeFromHostContext(kittl2).then(() => {
+      const { context } = apis;
+      const themeSynced = context?.get && context.subscribe ? syncHtmlDataThemeFromHostContext({
+        context
+      }) : Promise.resolve();
+      void themeSynced.catch(() => void 0).then(() => {
         kittl2.onLoadedCallback?.();
         sendLoaded();
       });
     };
     if (typeof document !== "undefined" && typeof window !== "undefined") {
+      setSDKVersion(version);
       window.kittl = kittl2;
       if (document.readyState === "loading") {
         document.addEventListener("DOMContentLoaded", initSdk);
@@ -995,7 +1166,12 @@
   // src/sharedFileBrowser.ts
   var kittl = createKittlSDK({
     auth: bridgeHandlers.auth,
-    context: bridgeHandlers.context,
-    fileBrowser: bridgeHandlers.fileBrowser
+    // context only carries tab registration here: the file browser is hidden, so
+    // it has no theme to follow and nothing to drag
+    context: {
+      registerUploadBrowser: bridgeHandlers.fileBrowserRegistration.registerUploadBrowser
+    },
+    // Both locations share callback tracking so existing file-browser extensions work unchanged.
+    fileBrowser: bridgeHandlers.fileBrowserRegistration
   });
 })();