Skip to content

Conversation

@KenAJoh
Copy link
Collaborator

@KenAJoh KenAJoh commented Nov 7, 2025

Description

Now ready for initial round of reviews 🚀

TODOs

Tasks to do after first round of reviews and changes are made:

  • Code examples for website
  • JsDoc for each component/sub-component
  • Implement sub-components in root
  • Create CSS for legacy
  • Chromatic stories

Component Checklist 📝

  • JSDoc
  • Examples
  • Documentation / Decision Records
  • Storybook
  • Style mappings (@navikt/core/css/config/_mappings.js)
  • Component tokens (@navikt/core/css/tokens.json)
  • CSS class deprecations (@navikt/aksel-stylelint/src/deprecations.ts)
  • Exports (@navikt/core/react/src/index.ts and @navikt/core/react/package.json)
  • New component? CSS import (@navikt/core/css/index.css)
  • Breaking change? Update migration guide. Consider codemod.
  • Changeset (Format: <Component>: <gitmoji?> <Text>. E.g. "Button: ✨ Add feature xyz.")

@KenAJoh KenAJoh requested a review from HalvorHaugan November 21, 2025 19:08
* 🎉 Track list of prev active elements

* 🧪 track previous focused elements

* Update @navikt/core/react/src/util/focus-boundary/FocusBoundary.tests.stories.tsx

Co-authored-by: Halvor Haugan <[email protected]>

* Update @navikt/core/react/src/util/focus-boundary/FocusBoundary.tsx

Co-authored-by: Halvor Haugan <[email protected]>

* Update @navikt/core/react/src/util/focus-boundary/FocusBoundary.tests.stories.tsx

Co-authored-by: Halvor Haugan <[email protected]>

* 🏷️ Rename button

* ⚡ fall back to focusing trigger

* 🎉 Now properly cleans up prev-focused items no longer possible to focus

* 🐛 Update canvas-getby to use Role instead if id after component change

* 🐛 Allow trap-focus without backdrop to close onPointerDown

* 🔥 removed types

* 🐛 Fall back to trigger focus on outside click in trap-focus mode

---------

Co-authored-by: Halvor Haugan <[email protected]>
Comment on lines 100 to 112
useEffect(() => {
if (parentContext?.nestedDialogOpened && open) {
parentContext.nestedDialogOpened(ownNestedOpenDialogs);
}
if (parentContext?.nestedDialogClosed && !open) {
parentContext.nestedDialogClosed();
}
return () => {
if (parentContext?.nestedDialogClosed && open) {
parentContext.nestedDialogClosed();
}
};
}, [open, parentContext, ownNestedOpenDialogs]);
Copy link
Contributor

Choose a reason for hiding this comment

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

I don't understand what you mean with "they are not the same".

  1. You don't have to check if both nestedDialogOpened and nestedDialogClosed are defined because they are both required.
  2. When open changes to false, the cleanup function runs and calls nestedDialogClosed() since it checks the "old" version of open. Hence the call above (in the else) is redundant.
  3. Instead of checking open inside the cleanup function, you can return the cleanup function if open is true.

@KenAJoh
Copy link
Collaborator Author

KenAJoh commented Nov 24, 2025

Ended up with

useEffect(() => {
    if (open && parentContext) {
      parentContext.nestedDialogOpened(ownNestedOpenDialogs);
      return () => parentContext.nestedDialogClosed();
    }
  }, [open, parentContext, ownNestedOpenDialogs]);

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.

3 participants