@myst-theme/jupyter 0.0.1

package/README.md

@@ -0,0 +1,6 @@
+# @myst-theme/diagrams
+
+[![myst-demo on npm](https://img.shields.io/npm/v/myst-demo.svg)](https://www.npmjs.com/package/myst-demo)
+[![MIT License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/curvenote/curvenote/blob/main/LICENSE)
+
+A demo component for MyST

package/dist/cjs/components.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const MaybeLongContent: ({ content, path, render, }: {
+    content?: string | undefined;
+    path?: string | undefined;
+    render: (content: string) => JSX.Element;
+}) => JSX.Element;
+export declare const DangerousHTML: ({ content, ...rest }: {
+    content: string;
+}) => JSX.Element;
+//# sourceMappingURL=components.d.ts.map

package/dist/cjs/components.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/components.tsx"],"names":[],"mappings":";AAGA,eAAO,MAAM,gBAAgB;;;sBAOT,MAAM,KAAK,WAAW;iBAUzC,CAAC;AAEF,eAAO,MAAM,aAAa;aAAqC,MAAM;iBAWpE,CAAC"}

package/dist/cjs/components.js

@@ -0,0 +1,41 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DangerousHTML = exports.MaybeLongContent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = require("./hooks");
+const MaybeLongContent = ({ content, path, render, }) => {
+    const { error, data } = (0, hooks_1.useLongContent)(content, path);
+    if (error) {
+        return (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "text-red-500" }, { children: ["Error loading content: ", error.message] }));
+    }
+    if (!data) {
+        return (0, jsx_runtime_1.jsx)("div", { children: "Fetching long content...." });
+    }
+    return (0, jsx_runtime_1.jsx)("div", { children: render(data.content) });
+};
+exports.MaybeLongContent = MaybeLongContent;
+const DangerousHTML = (_a) => {
+    var { content } = _a, rest = __rest(_a, ["content"]);
+    const ref = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (!content || !ref.current)
+            return;
+        const el = document.createRange().createContextualFragment(content);
+        ref.current.innerHTML = '';
+        ref.current.appendChild(el);
+    }, [content, ref]);
+    return (0, jsx_runtime_1.jsx)("div", Object.assign({}, rest, { ref: ref }));
+};
+exports.DangerousHTML = DangerousHTML;

package/dist/cjs/error.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { MinifiedErrorOutput } from '@curvenote/nbtx';
+export default function Error({ output }: {
+    output: MinifiedErrorOutput;
+}): JSX.Element;
+//# sourceMappingURL=error.d.ts.map

package/dist/cjs/error.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"error.d.ts","sourceRoot":"","sources":["../../src/error.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAG3D,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,mBAAmB,CAAA;CAAE,eAcxE"}

package/dist/cjs/error.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ansi_to_react_1 = __importDefault(require("ansi-to-react"));
+const blocks_1 = require("@curvenote/blocks");
+const components_1 = require("./components");
+function Error({ output }) {
+    return ((0, jsx_runtime_1.jsx)(components_1.MaybeLongContent, { content: (0, blocks_1.ensureString)(output.traceback), path: output.path, render: (content) => {
+            return ((0, jsx_runtime_1.jsx)("pre", Object.assign({ className: "text-sm font-thin font-system jupyter-error" }, { children: (0, jsx_runtime_1.jsx)(ansi_to_react_1.default, { children: content !== null && content !== void 0 ? content : '' }) })));
+        } }));
+}
+exports.default = Error;

package/dist/cjs/hooks.d.ts

@@ -0,0 +1,67 @@
+import type { MinifiedOutput } from '@curvenote/nbtx/dist/minify/types';
+/**
+ * Truncation vs Summarization
+ *
+ * In Curvespace, we're decided to change our data structure for outputs to align it as
+ * closely as possible with Jupyters nbformat.IOutput[] type, but in a way that still allows
+ * us to truncate output content and push that to storage.
+ *
+ * This will be used only in the CLI and Curvespace initially but should be ported back to
+ * the rest of the code base. This will mean
+ *
+ * - changing the DB schema
+ * - migration
+ * - changing API response
+ * - changing the frontend
+ * - changing the extension
+ *
+ */
+interface LongContent {
+    content_type?: string;
+    content: string;
+}
+export declare function useLongContent(content?: string, url?: string): {
+    data?: LongContent;
+    error?: Error;
+};
+export declare function useFetchAnyTruncatedContent(outputs: MinifiedOutput[]): {
+    data: ({
+        data: {};
+        path?: string | undefined;
+        traceback: string & string[];
+        output_type: "error";
+        ename: string;
+        evalue: string;
+    } | {
+        data: {};
+        path?: string | undefined;
+        output_type: "stream";
+        name: import("@jupyterlab/nbformat").StreamType;
+        text: import("@jupyterlab/nbformat").MultilineString;
+    } | {
+        data: {};
+        output_type: import("@curvenote/nbtx/dist/minify/types").MimeOutputType;
+        execution_count?: import("@jupyterlab/nbformat").ExecutionCount | undefined;
+        metadata: import("@lumino/coreutils").PartialJSONObject;
+    } | {
+        [x: string]: import("@lumino/coreutils").PartialJSONValue | undefined;
+        path?: string | undefined;
+        traceback: string & string[];
+        output_type: "error";
+        ename: string;
+        evalue: string;
+    } | {
+        [x: string]: import("@lumino/coreutils").PartialJSONValue | undefined;
+        path?: string | undefined;
+        output_type: "stream";
+        name: import("@jupyterlab/nbformat").StreamType;
+        text: import("@jupyterlab/nbformat").MultilineString;
+    })[] | undefined;
+    error: any;
+};
+export default function useWindowSize(): {
+    width: number;
+    height: number;
+};
+export {};
+//# sourceMappingURL=hooks.d.ts.map

package/dist/cjs/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/hooks.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAIV,cAAc,EAEf,MAAM,mCAAmC,CAAC;AAI3C;;;;;;;;;;;;;;;;GAgBG;AAEH,UAAU,WAAW;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;CACjB;AAQD,wBAAgB,cAAc,CAC5B,OAAO,CAAC,EAAE,MAAM,EAChB,GAAG,CAAC,EAAE,MAAM,GACX;IAAE,IAAI,CAAC,EAAE,WAAW,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAQvC;AAuBD,wBAAgB,2BAA2B,CAAC,OAAO,EAAE,cAAc,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6BpE;AAUD,MAAM,CAAC,OAAO,UAAU,aAAa;;;EAapC"}

package/dist/cjs/hooks.js

@@ -0,0 +1,85 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFetchAnyTruncatedContent = exports.useLongContent = void 0;
+const immutable_1 = __importDefault(require("swr/immutable"));
+const utils_1 = require("@curvenote/nbtx/dist/minify/utils");
+const react_1 = require("react");
+const fetcher = (...args) => fetch(...args).then((res) => {
+    if (res.status === 200)
+        return res.json();
+    throw new Error(`Content returned with status ${res.status}.`);
+});
+function useLongContent(content, url) {
+    if (typeof document === 'undefined') {
+        // This is ONLY called on the server
+        return url ? {} : { data: { content: content !== null && content !== void 0 ? content : '' } };
+    }
+    const { data, error } = (0, immutable_1.default)(url || null, fetcher);
+    if (!url)
+        return { data: { content: content !== null && content !== void 0 ? content : '' } };
+    return { data, error };
+}
+exports.useLongContent = useLongContent;
+const arrayFetcher = (...urls) => {
+    return Promise.all(urls.map((url) => fetcher(url)));
+};
+function shallowCloneOutputs(outputs) {
+    return outputs.map((output) => {
+        if ('data' in output && output.data) {
+            const data = output.data;
+            return Object.assign(Object.assign({}, output), { data: Object.entries(data).reduce((acc, [mimetype, payload]) => {
+                    return Object.assign(Object.assign({}, acc), { [mimetype]: Object.assign({}, payload) });
+                }, {}) });
+        }
+        return Object.assign({}, output);
+    });
+}
+function useFetchAnyTruncatedContent(outputs) {
+    const itemsWithPaths = [];
+    const updated = shallowCloneOutputs(outputs);
+    (0, utils_1.walkPaths)(updated, (path, obj) => {
+        // images have paths, but we don't need to fetch them
+        if ('content_type' in obj && obj.content_type.startsWith('image/'))
+            return;
+        obj.path = path;
+        itemsWithPaths.push(obj);
+    });
+    const { data, error } = (0, immutable_1.default)(itemsWithPaths.map(({ path }) => path), arrayFetcher);
+    data === null || data === void 0 ? void 0 : data.forEach(({ content }, idx) => {
+        const obj = itemsWithPaths[idx];
+        if ('text' in obj)
+            obj.text = content; // stream
+        if ('traceback' in obj)
+            obj.traceback = content; // error
+        if ('content' in obj)
+            obj.content = content; // mimeoutput
+        obj.path = undefined;
+    });
+    return {
+        data: itemsWithPaths.length === 0 || data ? updated : undefined,
+        error,
+    };
+}
+exports.useFetchAnyTruncatedContent = useFetchAnyTruncatedContent;
+function getWindowSize() {
+    const { innerWidth: width, innerHeight: height } = window;
+    return {
+        width,
+        height,
+    };
+}
+function useWindowSize() {
+    const [windowSize, setWindowSize] = (0, react_1.useState)(getWindowSize());
+    (0, react_1.useLayoutEffect)(() => {
+        function handleResize() {
+            setWindowSize(getWindowSize());
+        }
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, []);
+    return windowSize;
+}
+exports.default = useWindowSize;

package/dist/cjs/index.d.ts

@@ -0,0 +1,6 @@
+import { Output } from './output';
+declare const OUTPUT_RENDERERS: {
+    output: typeof Output;
+};
+export default OUTPUT_RENDERERS;
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,QAAA,MAAM,gBAAgB;;CAErB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/cjs/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const output_1 = require("./output");
+const OUTPUT_RENDERERS = {
+    output: output_1.Output,
+};
+exports.default = OUTPUT_RENDERERS;

package/dist/cjs/jupyter.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { MinifiedOutput } from '@curvenote/nbtx';
+export declare const NativeJupyterOutputs: ({ id, outputs, }: {
+    id: string;
+    outputs: MinifiedOutput[];
+}) => JSX.Element;
+//# sourceMappingURL=jupyter.d.ts.map

package/dist/cjs/jupyter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jupyter.d.ts","sourceRoot":"","sources":["../../src/jupyter.tsx"],"names":[],"mappings":";AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAQtD,eAAO,MAAM,oBAAoB;QAI3B,MAAM;aACD,cAAc,EAAE;iBAmE1B,CAAC"}

package/dist/cjs/jupyter.js

@@ -0,0 +1,75 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NativeJupyterOutputs = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const hooks_1 = __importStar(require("./hooks"));
+const nanoid_1 = require("nanoid");
+const react_redux_1 = require("react-redux");
+const connect_1 = require("@curvenote/connect");
+const nbtx_1 = require("@curvenote/nbtx");
+const outline_1 = require("@heroicons/react/24/outline");
+const selectors_1 = require("./selectors");
+const PERCENT_OF_WINDOW = 0.9;
+const NativeJupyterOutputs = ({ id, outputs, }) => {
+    const windowSize = (0, hooks_1.default)();
+    const { data, error } = (0, hooks_1.useFetchAnyTruncatedContent)(outputs);
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    const [frameHeight, setFrameHeight] = (0, react_1.useState)(0);
+    const [clamped, setClamped] = (0, react_1.useState)(false);
+    const uid = (0, react_1.useMemo)(nanoid_1.nanoid, []);
+    const height = (0, react_redux_1.useSelector)((state) => (0, selectors_1.selectIFrameHeight)(state, uid));
+    const rendererReady = (0, react_redux_1.useSelector)((state) => (0, selectors_1.selectIFrameReady)(state, uid));
+    const iframeRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        if (iframeRef.current == null || !rendererReady || !data)
+            return;
+        (0, nbtx_1.fetchAndEncodeOutputImages)((0, nbtx_1.convertToIOutputs)(data)).then((out) => {
+            connect_1.host.commsDispatch(iframeRef.current, connect_1.actions.connectHostSendContent(uid, out));
+        });
+    }, [id, iframeRef.current, rendererReady]);
+    (0, react_1.useEffect)(() => {
+        if (height == null)
+            return;
+        if (height > PERCENT_OF_WINDOW * windowSize.height) {
+            setFrameHeight(PERCENT_OF_WINDOW * windowSize.height);
+            setClamped(true);
+        }
+        else {
+            setFrameHeight(height + 25);
+            setClamped(false);
+        }
+        setLoading(false);
+    }, [height]);
+    if (error) {
+        return (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "text-red-500" }, { children: ["Error rendering output: ", error.message] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [loading && (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-2.5" }, { children: "Loading..." })), (0, jsx_runtime_1.jsx)("iframe", { ref: iframeRef, id: uid, name: uid, title: uid, src: "https://next.curvenote.run", width: '100%', height: frameHeight, sandbox: "allow-scripts" }), clamped && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "cursor-pointer p-1 pb-2 hover:bg-gray-50 dark:hover:bg-gray-700 text-center text-gray-500 hover:text-gray-600 dark:text-gray-200 dark:hover:text-gray-50", title: "Expand", onClick: () => {
+                    setFrameHeight(height !== null && height !== void 0 ? height : 0);
+                    setClamped(false);
+                } }, { children: (0, jsx_runtime_1.jsx)(outline_1.ChevronDoubleDownIcon, { className: "w-5 h-5 inline" }) })))] }));
+};
+exports.NativeJupyterOutputs = NativeJupyterOutputs;

package/dist/cjs/output.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { GenericNode } from 'mystjs';
+import type { MinifiedOutput } from '@curvenote/nbtx/dist/minify/types';
+export declare function allOutputsAreSafe(outputs: MinifiedOutput[], directOutputTypes: Set<string>, directMimeTypes: Set<string>): boolean;
+export declare function anyErrors(outputs: MinifiedOutput[]): boolean;
+export declare function Output(node: GenericNode): JSX.Element;
+//# sourceMappingURL=output.d.ts.map

package/dist/cjs/output.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"output.d.ts","sourceRoot":"","sources":["../../src/output.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAE1C,OAAO,KAAK,EAAsB,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAgB5F,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,cAAc,EAAE,EACzB,iBAAiB,EAAE,GAAG,CAAC,MAAM,CAAC,EAC9B,eAAe,EAAE,GAAG,CAAC,MAAM,CAAC,WAY7B;AAWD,wBAAgB,SAAS,CAAC,OAAO,EAAE,cAAc,EAAE,WAElD;AAED,wBAAgB,MAAM,CAAC,IAAI,EAAE,WAAW,eA8BvC"}

package/dist/cjs/output.js

@@ -0,0 +1,66 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Output = exports.anyErrors = exports.allOutputsAreSafe = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const blocks_1 = require("@curvenote/blocks");
+const classnames_1 = __importDefault(require("classnames"));
+const safe_1 = require("./safe");
+const jupyter_1 = require("./jupyter");
+const outputBlock_1 = require("./outputBlock");
+const DIRECT_OUTPUT_TYPES = new Set(['stream', 'error']);
+const DIRECT_MIME_TYPES = new Set([
+    blocks_1.KnownCellOutputMimeTypes.TextPlain,
+    blocks_1.KnownCellOutputMimeTypes.ImagePng,
+    blocks_1.KnownCellOutputMimeTypes.ImageGif,
+    blocks_1.KnownCellOutputMimeTypes.ImageJpeg,
+    blocks_1.KnownCellOutputMimeTypes.ImageBmp,
+]);
+function allOutputsAreSafe(outputs, directOutputTypes, directMimeTypes) {
+    return outputs.reduce((flag, output) => {
+        if (directOutputTypes.has(output.output_type))
+            return true;
+        const data = output.data;
+        const mimetypes = data ? Object.keys(data) : [];
+        const safe = 'data' in output &&
+            Boolean(output.data) &&
+            mimetypes.every((mimetype) => directMimeTypes.has(mimetype));
+        return flag && safe;
+    }, true);
+}
+exports.allOutputsAreSafe = allOutputsAreSafe;
+function listMimetypes(outputs, directOutputTypes) {
+    return outputs.map((output) => {
+        if (directOutputTypes.has(output.output_type))
+            return [output.output_type];
+        const data = output.data;
+        const mimetypes = data ? Object.keys(data) : [];
+        return [output.output_type, mimetypes];
+    });
+}
+function anyErrors(outputs) {
+    return outputs.reduce((flag, output) => flag || output.output_type === 'error', false);
+}
+exports.anyErrors = anyErrors;
+function Output(node) {
+    const outputs = node.data;
+    const allSafe = allOutputsAreSafe(outputs, DIRECT_OUTPUT_TYPES, DIRECT_MIME_TYPES);
+    const hasError = anyErrors(outputs);
+    let component;
+    if (allSafe) {
+        component = (0, jsx_runtime_1.jsx)(safe_1.SafeOutputs, { keyStub: node.key, outputs: outputs });
+    }
+    else {
+        // Hide the iframe if rendering on the server
+        component =
+            typeof document === 'undefined' ? null : (0, jsx_runtime_1.jsx)(jupyter_1.NativeJupyterOutputs, { id: node.key, outputs: outputs });
+    }
+    return ((0, jsx_runtime_1.jsx)("figure", Object.assign({ suppressHydrationWarning: !allSafe, id: node.identifier || undefined, className: (0, classnames_1.default)('max-w-full overflow-auto m-0', {
+            'text-left': !node.align || node.align === 'left',
+            'text-center': node.align === 'center',
+            'text-right': node.align === 'right',
+        }) }, { children: (0, jsx_runtime_1.jsx)(outputBlock_1.OutputBlock, Object.assign({ allSafe: allSafe, hasError: hasError }, { children: component })) }), node.key));
+}
+exports.Output = Output;

package/dist/cjs/outputBlock.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type Props = {
+    children?: React.ReactNode;
+    allSafe?: boolean;
+    hasError?: boolean;
+    className?: string;
+};
+export declare function OutputBlock(props: Props): JSX.Element;
+export {};
+//# sourceMappingURL=outputBlock.d.ts.map

package/dist/cjs/outputBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"outputBlock.d.ts","sourceRoot":"","sources":["../../src/outputBlock.tsx"],"names":[],"mappings":";AAEA,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,KAAK,EAAE,KAAK,eAWvC"}

package/dist/cjs/outputBlock.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OutputBlock = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+function OutputBlock(props) {
+    const { children, allSafe, className } = props;
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ suppressHydrationWarning: !allSafe, className: (0, classnames_1.default)('relative group not-prose overflow-auto mb-4 pl-0.5', className) }, { children: children })));
+}
+exports.OutputBlock = OutputBlock;

package/dist/cjs/safe.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { MinifiedOutput } from '@curvenote/nbtx/dist/minify/types';
+export declare function SafeOutputs({ keyStub, outputs }: {
+    keyStub: string;
+    outputs: MinifiedOutput[];
+}): JSX.Element;
+//# sourceMappingURL=safe.d.ts.map

package/dist/cjs/safe.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"safe.d.ts","sourceRoot":"","sources":["../../src/safe.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,mCAAmC,CAAC;AAwE3C,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,cAAc,EAAE,CAAA;CAAE,eAM/F"}

package/dist/cjs/safe.js

@@ -0,0 +1,77 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SafeOutputs = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const jupyter_1 = require("@curvenote/blocks/dist/blocks/types/jupyter");
+const stream_1 = __importDefault(require("./stream"));
+const error_1 = __importDefault(require("./error"));
+const ansi_to_react_1 = __importDefault(require("ansi-to-react"));
+/**
+ * https://jupyterbook.org/content/code-outputs.html#render-priority
+ *
+ * nb_render_priority:
+      html:
+      - "application/vnd.jupyter.widget-view+json"
+      - "application/javascript"
+      - "text/html"
+      - "image/svg+xml"
+      - "image/png"
+      - "image/jpeg"
+      - "text/markdown"
+      - "text/latex"
+      - "text/plain"
+ */
+const RENDER_PRIORITY = [
+    jupyter_1.KnownCellOutputMimeTypes.ImagePng,
+    jupyter_1.KnownCellOutputMimeTypes.ImageJpeg,
+    jupyter_1.KnownCellOutputMimeTypes.ImageGif,
+    jupyter_1.KnownCellOutputMimeTypes.ImageBmp,
+];
+function findSafeMimeOutputs(output) {
+    const data = output.data;
+    const image = RENDER_PRIORITY.reduce((acc, mimetype) => {
+        if (acc)
+            return acc;
+        if (data && data[mimetype])
+            return data[mimetype];
+        return undefined;
+    }, undefined);
+    const text = data && data['text/plain'];
+    return { image, text };
+}
+function OutputImage({ image, text }) {
+    var _a;
+    return (0, jsx_runtime_1.jsx)("img", { src: image === null || image === void 0 ? void 0 : image.path, alt: (_a = text === null || text === void 0 ? void 0 : text.content) !== null && _a !== void 0 ? _a : 'Image produced in Jupyter' });
+}
+function SafeOutput({ output }) {
+    switch (output.output_type) {
+        case 'stream':
+            return (0, jsx_runtime_1.jsx)(stream_1.default, { output: output });
+        case 'error':
+            return (0, jsx_runtime_1.jsx)(error_1.default, { output: output });
+        case 'display_data':
+        case 'execute_result':
+        case 'update_display_data': {
+            const { image, text } = findSafeMimeOutputs(output);
+            if (!image && !text)
+                return null;
+            if (image)
+                return (0, jsx_runtime_1.jsx)(OutputImage, { image: image, text: text });
+            if (text)
+                return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ansi_to_react_1.default, { children: text.content }) }));
+            return null;
+        }
+        default:
+            console.warn(`Unknown output_type ${output['output_type']}`);
+            return null;
+    }
+}
+function SafeOutputs({ keyStub, outputs }) {
+    // TODO better key - add keys during content creation?
+    const components = outputs.map((output, idx) => ((0, jsx_runtime_1.jsx)(SafeOutput, { output: output }, `${keyStub}-${idx}`)));
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: components });
+}
+exports.SafeOutputs = SafeOutputs;

package/dist/cjs/selectors.d.ts

@@ -0,0 +1,10 @@
+import type { HostState } from '@curvenote/connect';
+export interface State {
+    app: HostState;
+}
+export declare const selectIFrameHeight: (state: State, id: string) => number | null;
+export declare const selectIFrameReady: (state: State, id: string) => boolean;
+export declare const selectIFrameSendFailed: (state: State, id: string) => false | {
+    message: string | undefined;
+};
+//# sourceMappingURL=selectors.d.ts.map

package/dist/cjs/selectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../src/selectors.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAGpD,MAAM,WAAW,KAAK;IACpB,GAAG,EAAE,SAAS,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,UAAW,KAAK,MAAM,MAAM,kBACX,CAAC;AAEjD,eAAO,MAAM,iBAAiB,UAAW,KAAK,MAAM,MAAM,YACT,CAAC;AAElD,eAAO,MAAM,sBAAsB,UAAW,KAAK,MAAM,MAAM;;CACb,CAAC"}

package/dist/cjs/selectors.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.selectIFrameSendFailed = exports.selectIFrameReady = exports.selectIFrameHeight = void 0;
+const connect_1 = require("@curvenote/connect");
+const selectIFrameHeight = (state, id) => connect_1.host.selectors.selectIFrameSize(state.app, id);
+exports.selectIFrameHeight = selectIFrameHeight;
+const selectIFrameReady = (state, id) => connect_1.host.selectors.selectIFrameReady(state.app, id);
+exports.selectIFrameReady = selectIFrameReady;
+const selectIFrameSendFailed = (state, id) => connect_1.host.selectors.selectIFrameFailed(state.app, id);
+exports.selectIFrameSendFailed = selectIFrameSendFailed;

package/dist/cjs/stream.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { MinifiedStreamOutput } from '@curvenote/nbtx';
+export default function Stream({ output }: {
+    output: MinifiedStreamOutput;
+}): JSX.Element;
+//# sourceMappingURL=stream.d.ts.map

package/dist/cjs/stream.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stream.d.ts","sourceRoot":"","sources":["../../src/stream.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAG5D,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,oBAAoB,CAAA;CAAE,eAY1E"}

package/dist/cjs/stream.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ansi_to_react_1 = __importDefault(require("ansi-to-react"));
+const blocks_1 = require("@curvenote/blocks");
+const components_1 = require("./components");
+function Stream({ output }) {
+    return ((0, jsx_runtime_1.jsx)(components_1.MaybeLongContent, { content: (0, blocks_1.ensureString)(output.text), path: output.path, render: (content) => ((0, jsx_runtime_1.jsx)("pre", Object.assign({ className: "text-sm font-thin font-system" }, { children: (0, jsx_runtime_1.jsx)(ansi_to_react_1.default, { children: content !== null && content !== void 0 ? content : '' }) }))) }));
+}
+exports.default = Stream;

package/dist/esm/components.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+export declare const MaybeLongContent: ({ content, path, render, }: {
+    content?: string | undefined;
+    path?: string | undefined;
+    render: (content: string) => JSX.Element;
+}) => JSX.Element;
+export declare const DangerousHTML: ({ content, ...rest }: {
+    content: string;
+}) => JSX.Element;
+//# sourceMappingURL=components.d.ts.map

package/dist/esm/components.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/components.tsx"],"names":[],"mappings":";AAGA,eAAO,MAAM,gBAAgB;;;sBAOT,MAAM,KAAK,WAAW;iBAUzC,CAAC;AAEF,eAAO,MAAM,aAAa;aAAqC,MAAM;iBAWpE,CAAC"}