@sigmacomputing/plugin 1.1.0 → 1.2.0

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@sigmacomputing/plugin",
-  "version": "1.1.0",
-  "description": "Sigma Computing Plugin Client API",
+  "version": "1.2.0",
+  "description": "Sigma Computing Plugin Client SDK",
   "license": "MIT",
   "homepage": "https://github.com/sigmacomputing/plugin",
-  "main": "./dist/index.js",
+  "type": "module",
+  "packageManager": "yarn@4.13.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/sigmacomputing/plugin.git"
@@ -13,41 +14,76 @@
     "email": "support@sigmacomputing.com",
     "url": "https://github.com/sigmacomputing/plugin/issues"
   },
-  "packageManager": "yarn@4.4.1",
-  "files": [
-    "dist/*"
-  ],
-  "typesVersions": {
-    "*": {
-      "react": [
-        "dist/react/index.d.ts"
-      ]
-    }
-  },
   "scripts": {
-    "build": "yarn tsc --build tsconfig.build.json",
-    "build:watch": "yarn build --watch",
-    "format": "prettier --write 'src/**/*.{ts,tsx}' 'jest.config.ts'",
+    "build": "tsdown",
+    "build:watch": "tsdown --watch",
+    "bump": "tsx scripts/bump-version.ts",
+    "format": "yarn oxfmt",
+    "lint": "yarn oxlint",
     "precommit": "lint-staged",
-    "prepublish": "yarn build",
-    "test": "jest --ci",
-    "test:watch": "yarn test --watch"
+    "publish": "yarn build && yarn npm publish",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "types": "tsc --noEmit"
   },
   "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    }
   },
   "devDependencies": {
-    "@jest/types": "^27.5.1",
-    "@types/jest": "^27.5.1",
-    "@types/node": "^18.7.14",
-    "@types/react": "^19.0.0",
-    "@types/react-dom": "^19.0.0",
-    "jest": "^27.5.1",
-    "jest-watch-typeahead": "^2.1.1",
-    "lint-staged": "^13.0.3",
-    "prettier": "^2.7.1",
-    "ts-jest": "^27.1.4",
-    "typescript": "^4.8.2"
+    "@actions/core": "^3.0.1",
+    "@arethetypeswrong/core": "^0.18.2",
+    "@inquirer/prompts": "^8.4.2",
+    "@testing-library/dom": "10.4.1",
+    "@testing-library/react": "16.3.2",
+    "@types/node": "^24.0.0",
+    "@types/react": "19.2.14",
+    "@types/react-dom": "19.2.3",
+    "@types/semver": "^7.7.1",
+    "@vitest/browser-playwright": "^4.1.5",
+    "lint-staged": "^16.4.0",
+    "oxfmt": "^0.38.0",
+    "oxlint": "^1.53.0",
+    "oxlint-tsgolint": "^0.16.0",
+    "playwright": "^1.49.0",
+    "publint": "^0.3.18",
+    "react": "19.2.5",
+    "react-dom": "19.2.5",
+    "semver": "^7.7.4",
+    "tsdown": "^0.21.10",
+    "tsx": "^4.21.0",
+    "typescript": "^6.0.2",
+    "unplugin-unused": "^0.5.7",
+    "vitest": "^4.1.5"
+  },
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.js",
+  "types": "./dist/cjs/index.d.cts",
+  "unpkg": "./dist/umd/sigmacomputing-plugin.umd.js",
+  "jsdelivr": "./dist/umd/sigmacomputing-plugin.umd.js",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "require": {
+        "types": "./dist/cjs/index.d.cts",
+        "default": "./dist/cjs/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/**/*",
+    "src/**/*",
+    "!src/**/__tests__/**/*"
+  ],
+  "publishConfig": {
+    "access": "public"
   }
 }

package/src/client/initialize.ts

@@ -0,0 +1,280 @@
+import {
+  PluginConfig,
+  PluginInstance,
+  PluginMessageResponse,
+  PluginStyle,
+  UrlParameter,
+  WorkbookSelection,
+  WorkbookVariable,
+} from '../types';
+import { validateConfigId } from '../utils/error';
+
+export function initialize<T = {}>(): PluginInstance<T> {
+  const pluginConfig: Partial<PluginConfig<T>> = {
+    config: {} as T,
+  };
+
+  let subscribedInteractions: Record<string, WorkbookSelection[]> = {};
+  let subscribedWorkbookVars: Record<string, WorkbookVariable> = {};
+  let subscribedUrlParameters: Record<string, UrlParameter> = {};
+  const registeredEffects: Record<string, () => void> = {};
+
+  const listeners: {
+    [event: string]: Function[];
+  } = {};
+
+  const location = new URL(document.location.href);
+  for (const [key, value] of location.searchParams.entries()) {
+    try {
+      pluginConfig[key] = JSON.parse(value);
+    } catch (_err: unknown) {
+      if (__VITEST_BROWSER__ && (key === 'iframeId' || key === 'sessionId')) {
+        // noop: vitest browser injects these into the test iframe URL
+      } else {
+        console.error(
+          `Failed to parse URL param ${key} with value ${value} as JSON.`,
+        );
+      }
+    }
+  }
+
+  const listener = (e: PluginMessageResponse) => {
+    emit(e.data.type, e.data.result, e.data.error);
+  };
+
+  window.addEventListener('message', listener, false);
+  window.addEventListener('click', () => execPromise('wb:plugin:focus'));
+
+  on('wb:plugin:config:update', (config: PluginConfig<T>) => {
+    Object.assign(pluginConfig, config);
+    emit('config', pluginConfig.config ?? {});
+  });
+
+  // send initialize event
+  void execPromise('wb:plugin:init', __VERSION__).then(config => {
+    Object.assign(pluginConfig, config);
+    emit('init', pluginConfig);
+    emit('config', pluginConfig.config);
+  });
+
+  on(
+    'wb:plugin:variable:update',
+    (updatedVariables: Record<string, WorkbookVariable>) => {
+      subscribedWorkbookVars = {};
+      Object.assign(subscribedWorkbookVars, updatedVariables);
+    },
+  );
+
+  on('wb:plugin:selection:update', (updatedInteractions: unknown) => {
+    subscribedInteractions = {};
+    Object.assign(subscribedInteractions, updatedInteractions);
+  });
+
+  on(
+    'wb:plugin:url-parameter:update',
+    (updatedUrlParameters: Record<string, UrlParameter>) => {
+      subscribedUrlParameters = {};
+      Object.assign(subscribedUrlParameters, updatedUrlParameters);
+    },
+  );
+
+  on('wb:plugin:action-effect:invoke', (configId: string) => {
+    const effect = registeredEffects[configId];
+    if (!effect) {
+      throw new Error(`Unknown action effect with name: ${configId}`);
+    }
+    effect();
+  });
+
+  function on(event: string, listener: Function) {
+    listeners[event] = listeners[event] || [];
+    listeners[event].push(listener);
+  }
+
+  function off(event: string, listener: Function) {
+    if (listeners[event] == null) return;
+    listeners[event] = listeners[event].filter(a => a !== listener);
+  }
+
+  function emit(event: string, ...args: any) {
+    Object.values(listeners[event] || []).forEach(fn => fn(...args));
+  }
+
+  function execPromise<R>(event: string, ...args: any): Promise<R> {
+    return new Promise((resolve, reject) => {
+      const callback = (data: R, error: any) => {
+        if (error) reject(error);
+        else resolve(data);
+        off(event, callback);
+      };
+      on(event, callback);
+      window.parent.postMessage(
+        { type: event, args, elementId: pluginConfig.id },
+        pluginConfig?.wbOrigin ?? '*',
+      );
+    });
+  }
+
+  return {
+    get sigmaEnv() {
+      return pluginConfig.sigmaEnv;
+    },
+
+    get isScreenshot() {
+      return pluginConfig.screenshot;
+    },
+
+    config: {
+      // @ts-ignore TODO: Fix
+      getKey(key) {
+        return pluginConfig?.config?.[key];
+      },
+      get() {
+        return pluginConfig.config;
+      },
+      set(partialConfig) {
+        void execPromise('wb:plugin:config:update', partialConfig);
+      },
+      setKey(key, value) {
+        void execPromise('wb:plugin:config:update', {
+          [key]: value,
+        });
+      },
+      subscribe(listener) {
+        on('config', listener);
+        return () => off('config', listener);
+      },
+      getVariable(configId: string) {
+        validateConfigId(configId, 'variable');
+        return subscribedWorkbookVars[configId];
+      },
+      setVariable(configId: string, ...values: unknown[]) {
+        validateConfigId(configId, 'variable');
+        void execPromise('wb:plugin:variable:set', configId, ...values);
+      },
+      getInteraction(configId: string) {
+        validateConfigId(configId, 'interaction');
+        return subscribedInteractions[configId];
+      },
+      setInteraction(
+        configId: string,
+        elementId: string,
+        selection:
+          | string[]
+          | Array<Record<string, { type: string; val?: unknown }>>,
+      ) {
+        validateConfigId(configId, 'interaction');
+        void execPromise(
+          'wb:plugin:selection:set',
+          configId,
+          elementId,
+          selection,
+        );
+      },
+      triggerAction(configId: string) {
+        validateConfigId(configId, 'action-trigger');
+        void execPromise('wb:plugin:action-trigger:invoke', configId);
+      },
+      registerEffect(configId: string, effect: () => void) {
+        validateConfigId(configId, 'action-effect');
+        registeredEffects[configId] = effect;
+        return () => {
+          delete registeredEffects[configId];
+        };
+      },
+      configureEditorPanel(options) {
+        void execPromise('wb:plugin:config:inspector', options);
+      },
+      setLoadingState(loadingState) {
+        void execPromise('wb:plugin:config:loading-state', loadingState);
+      },
+      subscribeToWorkbookVariable(configId, callback) {
+        validateConfigId(configId, 'variable');
+        const setValues = (values: Record<string, WorkbookVariable>) => {
+          callback(values[configId]);
+        };
+        on('wb:plugin:variable:update', setValues);
+        return () => {
+          off('wb:plugin:variable:update', setValues);
+        };
+      },
+      subscribeToWorkbookInteraction(configId, callback) {
+        validateConfigId(configId, 'interaction');
+        const setValues = (values: Record<string, WorkbookSelection[]>) => {
+          callback(values[configId]);
+        };
+        on('wb:plugin:selection:update', setValues);
+        return () => {
+          off('wb:plugin:selection:update', setValues);
+        };
+      },
+      subscribeToUrlParameter(configId, callback) {
+        validateConfigId(configId, 'url-parameter');
+        const setValues = (values: Record<string, UrlParameter>) => {
+          callback(values[configId]);
+        };
+        setValues(subscribedUrlParameters);
+        on('wb:plugin:url-parameter:update', setValues);
+        return () => {
+          off('wb:plugin:url-parameter:update', setValues);
+        };
+      },
+      getUrlParameter(configId: string) {
+        validateConfigId(configId, 'url-parameter');
+        return subscribedUrlParameters[configId];
+      },
+      setUrlParameter(configId: string, value: string) {
+        validateConfigId(configId, 'url-parameter');
+        void execPromise('wb:plugin:url-parameter:set', configId, value);
+      },
+    },
+    elements: {
+      getElementColumns(configId) {
+        validateConfigId(configId, 'element');
+        return execPromise('wb:plugin:element:columns:get', configId);
+      },
+      subscribeToElementColumns(configId, callback) {
+        validateConfigId(configId, 'element');
+        const eventName = `wb:plugin:element:${configId}:columns`;
+        on(eventName, callback);
+        void execPromise('wb:plugin:element:subscribe:columns', configId);
+
+        return () => {
+          off(eventName, callback);
+          void execPromise('wb:plugin:element:unsubscribe:columns', configId);
+        };
+      },
+      subscribeToElementData(configId, callback) {
+        validateConfigId(configId, 'element');
+        const eventName = `wb:plugin:element:${configId}:data`;
+        on(eventName, callback);
+        void execPromise('wb:plugin:element:subscribe:data', configId);
+
+        return () => {
+          off(eventName, callback);
+          void execPromise('wb:plugin:element:unsubscribe:data', configId);
+        };
+      },
+      fetchMoreElementData(configId) {
+        validateConfigId(configId, 'element');
+        void execPromise('wb:plugin:element:fetch-more', configId);
+      },
+    },
+
+    style: {
+      subscribe(callback: (style: PluginStyle) => void) {
+        on('wb:plugin:style:update', callback);
+        return () => off('wb:plugin:style:update', callback);
+      },
+
+      get() {
+        return execPromise('wb:plugin:style:get');
+      },
+    },
+
+    destroy() {
+      Object.keys(listeners).forEach(event => delete listeners[event]);
+      window.removeEventListener('message', listener, false);
+    },
+  };
+}

package/src/client.ts

@@ -0,0 +1,3 @@
+import { initialize } from './client/initialize';
+
+export const client = initialize();

package/src/globals.d.ts

@@ -0,0 +1,2 @@
+declare const __VERSION__: string;
+declare const __VITEST_BROWSER__: boolean;

package/{dist/index.d.ts → src/index.ts}

@@ -1,5 +1,5 @@
 export * from './types';
 export * from './react';
 export * from './client';
+
 export { polyfillRequestAnimationFrame } from './utils/polyfillRequestAnimationFrame';
-//# sourceMappingURL=index.d.ts.map

package/src/react/Context.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+
+import { client } from '../client';
+import { PluginInstance } from '../types';
+
+export const PluginContext = React.createContext<PluginInstance>(client);

package/src/react/Provider.tsx

@@ -0,0 +1,20 @@
+import * as React from 'react';
+
+import { PluginInstance } from '../types';
+
+import { PluginContext } from './Context';
+
+export interface SigmaClientProviderProps<T = any> {
+  client: PluginInstance<T>;
+  children?: React.ReactNode;
+}
+
+export function SigmaClientProvider<T = any>(
+  props: SigmaClientProviderProps<T>,
+) {
+  return (
+    <PluginContext.Provider value={props.client}>
+      {props.children}
+    </PluginContext.Provider>
+  );
+}