npm - @stainless-api/playgrounds - Versions diffs - 0.0.1-beta.0 - Mend

@stainless-api/playgrounds 0.0.1-beta.0

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.

Files changed (45) hide show

package/CHANGELOG.md +15 -0
package/README.md +23 -0
package/eslint.config.js +2 -0
package/package.json +69 -0
package/src/Logs.tsx +216 -0
package/src/Panel.tsx +21 -0
package/src/PlaygroundPanelWrapper.tsx +5 -0
package/src/build-py-types.ts +152 -0
package/src/build-ts-types.ts +70 -0
package/src/build.ts +97 -0
package/src/codemirror/comlink.ts +698 -0
package/src/codemirror/curl/curlconverter.vendor.js +7959 -0
package/src/codemirror/curl.ts +108 -0
package/src/codemirror/deps.ts +12 -0
package/src/codemirror/fix-lsp-markdown.ts +50 -0
package/src/codemirror/lsp.ts +87 -0
package/src/codemirror/python/anser.ts +398 -0
package/src/codemirror/python/pyodide.ts +180 -0
package/src/codemirror/python.ts +160 -0
package/src/codemirror/react.tsx +615 -0
package/src/codemirror/sanitize-html.ts +12 -0
package/src/codemirror/shiki.ts +65 -0
package/src/codemirror/typescript/cdn-typescript.d.ts +1 -0
package/src/codemirror/typescript/cdn-typescript.js +1 -0
package/src/codemirror/typescript/console.ts +590 -0
package/src/codemirror/typescript/get-signature.ts +94 -0
package/src/codemirror/typescript/prettier-plugin-external-typescript.vendor.js +4968 -0
package/src/codemirror/typescript/runner.ts +396 -0
package/src/codemirror/typescript/special-info.ts +171 -0
package/src/codemirror/typescript/worker.ts +292 -0
package/src/codemirror/typescript.tsx +198 -0
package/src/create.tsx +44 -0
package/src/icon.tsx +21 -0
package/src/index.ts +6 -0
package/src/logs-context.ts +5 -0
package/src/playground.css +359 -0
package/src/sandbox-worker/in-frame.js +179 -0
package/src/sandbox-worker/index.ts +202 -0
package/src/use-storage.ts +54 -0
package/src/util.ts +29 -0
package/src/virtual-module.d.ts +45 -0
package/src/vite-env.d.ts +1 -0
package/test/get-signature.test.ts +73 -0
package/test/use-storage.test.ts +60 -0
package/tsconfig.json +11 -0

package/src/sandbox-worker/index.ts ADDED Viewed

@@ -0,0 +1,202 @@
+import inFrame from './in-frame.js?raw';
+export class SandboxWorker extends EventTarget implements Worker {
+  #frame: HTMLIFrameElement | undefined;
+  #port: MessagePort;
+  /**
+   * The **`SandboxWorker`** class represents a sandboxed background task that can be created via script, which can send messages back to its creator.
+   *
+   * Based on the [Worker API](https://developer.mozilla.org/docs/Web/API/Worker).
+   */
+  constructor(url: string | URL, options?: WorkerOptions) {
+    super();
+    const controller = new AbortController();
+    const channel = new MessageChannel();
+    const port = channel.port1;
+    this.#port = port;
+    new Promise<void>((resolve, reject) => {
+      (async () => {
+        const blob = /\?worker_file&type=module$/.test(url + '')
+          ? new Blob(
+              [
+                (
+                  await (
+                    await fetch((url + '').replace(/\?worker_file&type=module$/, '?worker_file&type=classic'))
+                  ).text()
+                ).replace('importScripts("/@vite/env")', ''),
+              ],
+              {
+                type: 'text/javascript',
+              },
+            )
+          : await (await fetch(url)).blob();
+        const frame = document.createElement('iframe');
+        frame.style.display = 'none';
+        frame.sandbox = 'allow-scripts';
+        const html = String.raw;
+        frame.srcdoc = html`
+          <!doctype html>
+          <meta charset="utf-8" />
+          <script>
+            addEventListener('message', (e) => {
+              typeof e.data === 'object' &&
+                e.data &&
+                e.data.workerInit &&
+                new Function(e.data.code + ';return init')()(e.data.params);
+            });
+          </script>
+        `;
+        frame.addEventListener(
+          'load',
+          () => {
+            frame.contentWindow!.postMessage(
+              {
+                workerInit: true,
+                code: inFrame,
+                params: { port: channel.port2, blob, options },
+              },
+              '*',
+              [channel.port2],
+            );
+          },
+          {
+            signal: controller.signal,
+          },
+        );
+        port.addEventListener('message', (e) => {
+          if (e.data.type === 'ready') {
+            resolve();
+          }
+          if (e.data.type === 'error') {
+            this.#dispatchError(e.data.error);
+          }
+          if (e.data.type === 'message' || e.data.type === 'messageerror') {
+            this.dispatchEvent(new MessageEvent(e.data.type, { data: e.data.data }));
+          }
+        });
+        port.start();
+        const timeout = setTimeout(() => {
+          reject(new Error('timed out waiting for sandbox frame'));
+        }, 1000);
+        controller.signal.addEventListener('abort', () => {
+          clearTimeout(timeout);
+        });
+        this.#frame = frame;
+        document.head.appendChild(frame);
+      })().catch(reject);
+    })
+      .catch((e) => {
+        this.#dispatchError(e);
+        this.terminate();
+      })
+      .finally(() => {
+        controller.abort();
+      });
+  }
+  #dispatchError(e: unknown) {
+    const defaultBehavior = this.dispatchEvent(
+      new ErrorEvent('error', {
+        error: e,
+        message: e instanceof Error ? e.message : '' + e,
+        cancelable: true,
+      }),
+    );
+    if (defaultBehavior) {
+      reportError(e);
+    }
+  }
+  /**
+   * The **`postMessage()`** method of the Worker interface sends a message to the worker.
+   *
+   * [MDN Reference](https://developer.mozilla.org/docs/Web/API/Worker/postMessage)
+   */
+  postMessage(message: unknown, transfer: Transferable[]): void;
+  postMessage(message: unknown, options?: StructuredSerializeOptions): void;
+  postMessage(message: unknown, options?: StructuredSerializeOptions | Transferable[]): void {
+    this.#port.postMessage(
+      {
+        type: 'postMessage',
+        data: message,
+        options,
+      },
+      Array.isArray(options) ? { transfer: options } : options,
+    );
+  }
+  terminate(): void {
+    this.#port.postMessage({ type: 'terminate' });
+    this.#port.close();
+    if (this.#frame) {
+      this.#frame.remove();
+      this.#frame = undefined;
+    }
+  }
+  // #region - event types & shorthand handlers
+  declare addEventListener: {
+    <K extends keyof WorkerEventMap>(
+      type: K,
+      listener: (this: Worker, ev: WorkerEventMap[K]) => unknown,
+      options?: boolean | AddEventListenerOptions,
+    ): void;
+    (
+      type: string,
+      listener: EventListenerOrEventListenerObject,
+      options?: boolean | AddEventListenerOptions,
+    ): void;
+  };
+  declare removeEventListener: {
+    <K extends keyof WorkerEventMap>(
+      type: K,
+      listener: (this: Worker, ev: WorkerEventMap[K]) => unknown,
+      options?: boolean | EventListenerOptions,
+    ): void;
+    (
+      type: string,
+      listener: EventListenerOrEventListenerObject,
+      options?: boolean | EventListenerOptions,
+    ): void;
+  };
+  #onerror: ((this: AbstractWorker, ev: ErrorEvent) => unknown) | null | undefined;
+  get onerror(): ((this: AbstractWorker, ev: ErrorEvent) => unknown) | null {
+    return this.#onerror ?? null;
+  }
+  set onerror(value: ((this: AbstractWorker, ev: ErrorEvent) => unknown) | null) {
+    if (this.#onerror) {
+      this.removeEventListener('error', this.#onerror);
+    }
+    this.#onerror = value ?? null;
+    if (this.#onerror) {
+      this.addEventListener('error', this.#onerror);
+    }
+  }
+  #onmessage: ((this: Worker, ev: MessageEvent) => unknown) | null | undefined;
+  get onmessage(): ((this: Worker, ev: MessageEvent) => unknown) | null {
+    return this.#onmessage ?? null;
+  }
+  set onmessage(value: ((this: Worker, ev: MessageEvent) => unknown) | null) {
+    if (this.#onmessage) {
+      this.removeEventListener('message', this.#onmessage);
+    }
+    this.#onmessage = value ?? null;
+    if (this.#onmessage) {
+      this.addEventListener('message', this.#onmessage);
+    }
+  }
+  #onmessageerror: ((this: Worker, ev: MessageEvent) => unknown) | null | undefined;
+  get onmessageerror(): ((this: Worker, ev: MessageEvent) => unknown) | null {
+    return this.#onmessageerror ?? null;
+  }
+  set onmessageerror(value: ((this: Worker, ev: MessageEvent) => unknown) | null) {
+    if (this.#onmessageerror) {
+      this.removeEventListener('messageerror', this.#onmessageerror);
+    }
+    this.#onmessageerror = value ?? null;
+    if (this.#onmessageerror) {
+      this.addEventListener('messageerror', this.#onmessageerror);
+    }
+  }
+  // #endregion - event types & shorthand handlers
+}

package/src/use-storage.ts ADDED Viewed

@@ -0,0 +1,54 @@
+import { useCallback, useMemo, useSyncExternalStore } from 'react';
+import type { Jsonifiable, Jsonify, JsonValue } from 'type-fest';
+type UseStorageResult<T> = [
+  T extends JsonValue ? T : Jsonify<T>,
+  (value: T | ((prev: T extends JsonValue ? T : Jsonify<T>) => T)) => void,
+];
+export function useStorage<T extends Jsonifiable = null>(
+  provider: Storage,
+  key: string,
+  defaultValue: T | (() => T),
+): UseStorageResult<T> {
+  const subscribe = useCallback(
+    (callback: () => void) => {
+      globalThis.addEventListener('storage', callback);
+      globalThis.addEventListener(`storage-${key}`, callback);
+      return () => {
+        globalThis.removeEventListener('storage', callback);
+        globalThis.removeEventListener(`storage-${key}`, callback);
+      };
+    },
+    [key],
+  );
+  const getSnapshot = useCallback((): string | null => {
+    return provider.getItem(key);
+  }, [provider, key]);
+  const serializedDefault = useMemo(
+    () => JSON.stringify(typeof defaultValue === 'function' ? defaultValue() : defaultValue),
+    [defaultValue],
+  );
+  const serializedValue = useSyncExternalStore(subscribe, getSnapshot, getSnapshot) ?? serializedDefault;
+  const value = useMemo(() => JSON.parse(serializedValue), [serializedValue]) as JsonValue;
+  const setValue = useCallback(
+    (newValue: JsonValue | ((prev: JsonValue) => JsonValue)) => {
+      const valueToStore = JSON.stringify(typeof newValue === 'function' ? newValue(value) : newValue);
+      if (valueToStore !== serializedValue) {
+        provider.setItem(key, valueToStore);
+        globalThis.dispatchEvent?.(new CustomEvent(`storage-${key}`));
+      }
+    },
+    [provider, key, serializedValue, defaultValue],
+  );
+  // If we use Jsonify internally we get recursion errors.
+  return [value, setValue] satisfies UseStorageResult<JsonValue> as unknown as UseStorageResult<T>;
+}
+export default useStorage;

package/src/util.ts ADDED Viewed

@@ -0,0 +1,29 @@
+import { spawn } from 'node:child_process';
+export async function execCommand(
+  command: string,
+  args: string[],
+  options: { cwd: string; env?: Record<string, string> },
+) {
+  return new Promise<void>((resolve, reject) => {
+    const proc = spawn(command, args, {
+      cwd: options.cwd,
+      env: { ...process.env, ...options.env },
+      stdio: 'inherit',
+    });
+    proc.on('close', (code) => {
+      if (code === 0) {
+        resolve();
+      } else {
+        reject(
+          new Error(
+            `Command \`${[command, ...args].map((e) => (/^[\w/.-]+$/.test(e) ? e : "'" + e.replaceAll("'", "'\\''") + "'")).join(' ')}\` failed with code ${code} while building playground`,
+          ),
+        );
+      }
+    });
+    proc.on('error', reject);
+  });
+}

package/src/virtual-module.d.ts ADDED Viewed

@@ -0,0 +1,45 @@
+type CreatePlayground = typeof import('./create').createPlayground;
+type ComlinkRemote<T> = import('./codemirror/comlink').Remote<T>;
+declare module 'virtual:stl-playground/typescript.json' {
+  const data: {
+    links: [string, string][];
+    files: [string, string][];
+  } | null;
+  export { data as default };
+}
+declare module 'virtual:stl-playground/python.json' {
+  const data: { files: Record<string, string>; wheel: string } | null;
+  export { data as default };
+}
+declare module 'virtual:stl-playground/auth.json' {
+  const data:
+    | ({
+        type: 'http_bearer' | 'query' | 'header' | 'oauth2' | 'http_basic' | 'http_digest';
+        description?: string;
+        name: string;
+        title: string;
+        header: string | undefined;
+        example: string | undefined;
+      } & {
+        opts: {
+          name: string;
+          type: 'string' | 'number' | 'boolean' | 'null' | 'integer';
+          nullable: boolean;
+          description?: string | undefined;
+          example?: unknown;
+          default?: unknown;
+          read_env?: string | undefined;
+          auth?:
+            | {
+                security_scheme: string;
+                role?: 'value' | 'password' | 'username' | 'client_id' | 'client_secret' | undefined;
+              }
+            | undefined;
+        }[];
+      })[]
+    | null;
+  export { data as default };
+}
+declare module 'comlink' {
+  type Remote<T> = ComlinkRemote<T>;
+}

package/src/vite-env.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ /// <reference types="vite/client" />

package/test/get-signature.test.ts ADDED Viewed

@@ -0,0 +1,73 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { describe, it } from 'node:test';
+import { getSignature } from '../src/codemirror/typescript/get-signature.ts';
+import isCallable from 'is-callable';
+import assert from 'node:assert';
+const testCases = [
+  () => {},
+  () => 0,
+  (_: unknown) => {},
+  (_: unknown) => 0,
+  { _() {} }._,
+  { get() {} }.get,
+  { set() {} }.set,
+  Object.getOwnPropertyDescriptor(
+    {
+      get _() {
+        return;
+      },
+    },
+    '_',
+  )!.get!,
+  Object.getOwnPropertyDescriptor({ set _(_: unknown) {} }, '_')!.set!,
+  function () {},
+  function a() {},
+  class {
+    constructor() {}
+  },
+  class a {
+    a() {}
+    constructor() {}
+  },
+  async () => {},
+  async () => 0,
+  async (_: unknown) => {},
+  async (_: unknown) => 0,
+  { async _() {} }._,
+  { async get() {} }.get,
+  { async set() {} }.set,
+  async function () {},
+  async function a() {},
+  function* () {},
+  function* a() {},
+  async function* () {},
+  async function* a() {},
+];
+describe('getSignature', () => {
+  for (const testCase of testCases) {
+    it('works with ' + testCase.toString(), () => {
+      const signature = getSignature(testCase.toString());
+      if (isCallable(testCase)) {
+        assert(/^(async )?function/.test(signature), 'function signatures should be function');
+      } else {
+        assert(/^class /.test(signature), 'class signatures should be classes');
+      }
+      let fake: (..._: never[]) => unknown;
+      assert.doesNotThrow(
+        () =>
+          (fake = new Function(
+            'return (' + (signature.startsWith('class ') ? signature : `${signature} {}`) + ')',
+          )()),
+        'signature should be valid syntax',
+      );
+      assert.equal(
+        fake!.name,
+        testCase.name.replace(/^(get|set) /, ''),
+        'signature should have same name as function',
+      );
+      assert.equal(fake!.length, testCase.length, 'signature should have same argument count as function');
+    });
+  }
+});

package/test/use-storage.test.ts ADDED Viewed

@@ -0,0 +1,60 @@
+import { describe, it } from 'node:test';
+import { useStorage } from '../src/use-storage.ts';
+import { renderToStaticMarkup } from 'react-dom/server';
+import { createElement } from 'react';
+import assert from 'node:assert';
+let keyRead: string | null = null;
+let mockValue: string | null = null;
+const storageMock: Storage = {
+  length: 0,
+  clear: function (): void {
+    throw new Error('Function not implemented.');
+  },
+  getItem: function (key): string | null {
+    keyRead = key;
+    return mockValue;
+  },
+  key: function (): string | null {
+    throw new Error('Function not implemented.');
+  },
+  removeItem: function (): void {
+    throw new Error('Function not implemented.');
+  },
+  setItem: function (key, value): void {
+    assert.equal(key, keyRead);
+    mockValue = value;
+  },
+};
+describe('useStorage', () => {
+  it('reads from storage', () => {
+    keyRead = null;
+    mockValue = '"value"';
+    renderToStaticMarkup(
+      createElement(function () {
+        const [value] = useStorage<string | null>(storageMock, 'key', null);
+        assert.equal(value, 'value');
+        return null;
+      }),
+    );
+    assert.equal(keyRead, 'key');
+  });
+  it('accepts jsonifiable objects', () => {
+    keyRead = null;
+    mockValue = null;
+    renderToStaticMarkup(
+      createElement(function () {
+        const [value, setValue] = useStorage<Date>(storageMock, 'key', new Date(0));
+        assert.equal(value, '1970-01-01T00:00:00.000Z');
+        setValue((prev) => {
+          assert.equal(prev, '1970-01-01T00:00:00.000Z');
+          return new Date();
+        });
+        setValue(new Date());
+        return null;
+      }),
+    );
+    assert.equal(keyRead, 'key');
+  });
+});

package/tsconfig.json ADDED Viewed

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "declaration": true,
+    "declarationDir": "dist",
+    "outDir": "dist",
+    "jsx": "react-jsx"
+  },
+  "include": ["src"]
+}