@datalayer/core/lib/examples/NotebookExample.js

[](https://datalayer.io)

import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
/*
 * Copyright (c) 2023-2025 Datalayer, Inc.
 * Distributed under the terms of the Modified BSD License.
 */
import { useMemo } from 'react';
import { Box } from '@datalayer/primer-addons';
import { Notebook, NotebookToolbar, CellSidebarExtension, CellSidebarButton, } from '@datalayer/jupyter-react';
import nbformatExample from './notebooks/NotebookExample1.ipynb.json';
const NOTEBOOK_ID = 'notebook-example-1';
export const NotebookExample = (props) => {
    const { serviceManager } = props;
    const extensions = useMemo(() => [new CellSidebarExtension({ factory: CellSidebarButton })], []);
    if (!serviceManager) {
        return (_jsxs(Box, { as: "h1", children: ["A Jupyter Notebook", _jsx("div", { children: "Loading..." })] }));
    }
    return (_jsxs(_Fragment, { children: [_jsx(Box, { as: "h1", children: "A Jupyter Notebook" }), _jsx(Notebook, { id: NOTEBOOK_ID, nbformat: nbformatExample, serviceManager: serviceManager, startDefaultKernel: true, extensions: extensions, Toolbar: NotebookToolbar })] }));
};
export default NotebookExample;