Skip to content

Hovercards: Add hideOnTargetClick option & Remove hovercards after calling the detach()#216

Merged
wellyshen merged 3 commits intotrunkfrom
add/clean-up-api
Jun 30, 2025
Merged

Hovercards: Add hideOnTargetClick option & Remove hovercards after calling the detach()#216
wellyshen merged 3 commits intotrunkfrom
add/clean-up-api

Conversation

@wellyshen
Copy link
Contributor

@wellyshen wellyshen commented Jun 26, 2025

Related to #210

Proposed Changes

  • Added a hideOnTargetClick option to hide the hovercard when its trigger element is clicked
  • detach() now removes attached hovercards
  • Update README
  • (Extra) Improve TS types
  • (Extra) Improve JS docs

Testing Instructions

  • Set up this repo by referring to this doc
  • Check out this PR
  • In your terminal, runcd web/packages/hovercards && npm run build:watch
  • Open another terminal, run cd web/packages/hovercards && npm run start

Test the hideOnTargetClick option

  • Hover over an avatar, and then click it. The hovercard will be removed
  • Change the hideOnTargetClick to false (or remove it). In the left section, the click-to-hide functionality should be canceled

Test the detach method

  • Don't hide hovercards by modifying the _hideHovercard function
  • In the left section, show some hovercards, and click the "Detach" button. Hovercards will be detached and removed

@wellyshen wellyshen self-assigned this Jun 26, 2025
@github-actions
Copy link

Size Change: +1.5 kB (+2.35%)

Total Size: 65.5 kB

Filename Size Change
dist/index.esm.js 9.62 kB +241 B (+2.57%)
dist/index.js 9.76 kB +238 B (+2.5%)
dist/index.mjs 9.62 kB +241 B (+2.57%)
dist/index.react.js 11.9 kB +262 B (+2.25%)
dist/index.react.mjs 11.8 kB +263 B (+2.27%)
dist/index.react.umd.js 6.89 kB +136 B (+2.01%)
dist/index.umd.js 5.92 kB +122 B (+2.11%)

compressed-size-action

Copy link

@aaronfc aaronfc left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM and works as described!

A small note: can you review if package-lock.json needs to be updated? When I run npm install I got it updated.

@wellyshen
Copy link
Contributor Author

wellyshen commented Jun 30, 2025

LGTM and works as described!

A small note: can you review if package-lock.json needs to be updated? When I run npm install I got it updated.

Thank you for the review. I have updated the file as well.

@wellyshen wellyshen merged commit dd3cde4 into trunk Jun 30, 2025
2 checks passed
@wellyshen wellyshen deleted the add/clean-up-api branch June 30, 2025 07:44
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

Successfully merging this pull request may close these issues.

Hovercard popovers persist after parent Hovercard component dismount

2 participants

Comments