Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

AnnounceKit badge doesn't disappear on click when ref is used #30

Open
stephan-noel-primer opened this issue Jan 28, 2022 · 0 comments
Open

Comments

@stephan-noel-primer
Copy link

stephan-noel-primer commented Jan 28, 2022

The following, when clicking on the element I pass open to (for its onClick handler), the badge is still shown until I refresh the page:

const AnnounceKitBadge = ({ children }) => {
  const announceKitRef = useRef<AnnounceKit>();

  const open = async () => await announceKitRef?.current?.open();

  const AnnounceKitElement = (
    <AnnounceKit
      widget={'myurl'}
      ref={announceKitRef}
    />
  );

  return children({ open, AnnounceKitElement }) ;
};

It will only disappear as expected if I were to click directly on the small circle badge instead of clicking on the element I pass the open function to as an onClick handler. This ref usage is in the example codesandbox so I'd expect it to work.

When I use catchClick and pass a selector instead of the onClick event handler, then clicking on the element I pass the selector to will make the badge disappear upon open as expected..

A related issue is passing children to AnnounceKit isn't well supported since there is no way to override the styles, the display: inline is hardcoded. Passing widgetStyle doesn't help either.

I'm using version 2.1.7.

@stephan-noel-primer stephan-noel-primer changed the title AnnounceKit badge doesn't disappear when ref is used AnnounceKit badge doesn't disappear on click when ref is used Jan 28, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant