#267 Fix Checkbox in Dialog

[amcdnl]

This PR:

• Fixes the checkbox not having the correct path animation set when in a dialog/drawer/et.
• Adds storybook case for testing
• Fixes setTimeout type broken

[netlify]

✅ Deploy Preview for reablocks-storybook ready!

Name	Link
🔨 Latest commit	05eca38
🔍 Latest deploy log	https://app.netlify.com/sites/reablocks-storybook/deploys/674efc8cc32eda0008bf4efb
😎 Deploy Preview	https://deploy-preview-268--reablocks-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[steppy452]

@amcdnl hrmm not seeing that fix the issue

Screen.Recording.2024-12-03.at.4.10.32.PM.mov

[steppy452]

@amcdnl I was playing around with this a little bit and got it to work by forcing a re-render after initial mount by updating state:

// If the checkbox is inside a dialog, the animation will not work.
// This is a workaround to force the animation to work by triggering
// a re-render once after initial mount
const [_, setForceAnimation] = useState<boolean>(false);
useEffect(() => {
  if (checked || intermediate) {
    setForceAnimation(true);
  }
}, []); // eslint-disable-line react-hooks/exhaustive-deps

It's definitely a little hacky, but wondering what you think about this.

Screen.Recording.2024-12-03.at.7.49.17.PM.mov

[amcdnl]

@steppy452 - Maybe its a timing thing/race condition w/ my fix. I swear it worked lol.