a.createContext is not a function

[SolarisX1337]

trafficstars

InteractionManagerProvider.tsx:33

Uncaught TypeError: a.createContext is not a function at 6981 (InteractionManagerProvider.tsx:33:39) at e (bootstrap:19:32) at 5144 (ControlledTreeEnvironment.tsx:40:36) at e (bootstrap:19:32) at 5447 (Tree.tsx:40:35) at e (bootstrap:19:32) at 3735 (TreeItemChildren.tsx:9:14) at e (bootstrap:19:32) at 3307 (TreeItemElement.tsx:28:26) at e (bootstrap:19:32)

This is an error from the console, I don't know if it affects me.
Not sure if this is a bug or a misconfig somewhere in my program but this is interesting non the less, I can't find the file that the error is located, everything looks fine. This is the path webpack://ReactComplexTree/src/controlledEnvironment/InteractionManagerProvider.tsx

[lukasbach]

Hey! That is an odd error, createContext is a React global. It's also odd that the path where the error happens is the typescript source file, you should not import the sources, but the built files, but maybe a source mapping is changing the path that is displayed.

Can you share the code where you import the library and render it? I would also be interested in your version of React, your webpack config and tsconfig if possible.

[SolarisX1337]

Sure thing,

tsconfig.node.json -- This is tsconfig package.json -- This is the package

App.tsx

import { UncontrolledTreeEnvironment, Tree, StaticTreeDataProvider } from 'react-complex-tree'
import { longTree } from "./data"
import 'react-complex-tree/lib/style-modern.css'

export default function App() {
  return (
    <UncontrolledTreeEnvironment
      dataProvider={
        new StaticTreeDataProvider(longTree.items, (item, data) => ({
   
       ...item,
          data,
        }))
      }
      getItemTitle={(item) => item.data}
      canDragAndDrop={true}
      canReorderItems={true}
      canDropOnFolder={true}
      viewState={{
        "tree-1": {
          expandedItems: ["Fruit"],
        },
      }}
    >
      <Tree treeId="tree-1" rootItem="root" treeLabel="Tree Example" />
    </UncontrolledTreeEnvironment>
  );
}

Main.tsx

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import "./styles.css";

ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
);

This is written using the Tauri Framework (Might look a bit strange)

[SolarisX1337]

Update: I found code that must of snuck in while troubleshooting earlier

<link href="https://unpkg.com/react-complex-tree/lib/style.css" rel="stylesheet" />
<script src="https://unpkg.com/react-complex-tree/lib/bundle.js"></script>

No wonder why the path was a webpack URI, The Error is no longer present 😄

[lukasbach]

Haooy to hear! So has the issue been closed, and I can close this ticket?