iTwin / itwinjs-core

Monorepo for iTwin.js Library
https://www.itwinjs.org
MIT License
601 stars 210 forks source link

Invalid hook call error on Tooltip creation #2289

Closed kardoka closed 2 years ago

kardoka commented 2 years ago

Greetings,

I'm getting a hook call error while creating a new Tooltip object.

MyTooltipProps class:

class MyTooltipProps implements TooltipProps {
  children: React.ReactNode;
  placement: TooltipPlacement;
  target: HTMLElement;
  visible: boolean

  constructor(children: React.ReactNode, placement: TooltipPlacement, target: HTMLElement, visible: boolean) {
    this.children = children;
    this.placement = placement;
    this.target = target;
    this.visible = visible;
  }
}

The method for creating tooltips:

const createTooltips = (targetElement: HTMLElement) => {
    const children = <h1>Hello.</h1>;
    const placement = "top";
    const target = targetElement;
    const visible = true;

    const toolTipProps: MyTooltipProps = new MyTooltipProps(children, placement, target, visible);
    const toolTip = Tooltip(toolTipProps);
    return toolTip;
  }

...which is called in App.tsx:

  const onIModelConnected = (_imodel: IModelConnection) => {
    let element: HTMLElement = document.createElement('div');
    element = document.getElementById('uifw-contentlayout-div') as HTMLElement;
    createTooltips(element);
    IModelApp.viewManager.onViewOpen.addOnce(async (vp: ScreenViewport) => {
      IModelApp.viewManager.addDecorator(new SmartDeviceDecorator(vp));
    })
  }

Could the issue be with creating the tooltip at the wrong place in the code? What would be a correct example use-case of the Tooltip method?

EDIT: remove unnecessary code.


⚠ Do not edit this section. It is required for imodeljs.github.io ➟ GitHub issue linking

kardoka commented 2 years ago

Closed since this is not a issue, but rather a question for a discussion thread.