mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(modal): nested modals should correctly toggle the body class (#1331)

Browse source 
Fixes #1324
This commit is contained in:
metonym 2022-06-02 17:56:07 -07:00 • committed by GitHub
commit 22f93ee675
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/ComposedModal/ComposedModal.svelte
View file

@ -38,6 +38,7 @@
afterUpdate,
} from "svelte";
import { writable } from "svelte/store";
import { modalsOpen, addModalId, removeModalId } from "../Modal/modalStore";
const dispatch = createEventDispatcher();
const label = writable(undefined);
@ -45,6 +46,7 @@
let buttonRef = null;
let innerModal = null;
let didClickInnerModal = false;
let id = "ccs-" + Math.random().toString(36);
setContext("ComposedModal", {
closeModal: () => {
@ -78,6 +80,7 @@
});
return () => {
removeModalId(id);
document.body.classList.remove("bx--body--with-modal-open");
};
});
@ -87,14 +90,24 @@
if (!open) {
opened = false;
dispatch("close");
document.body.classList.remove("bx--body--with-modal-open");
}
} else if (open) {
opened = true;
dispatch("open");
}
if ($modalsOpen.length > 0) {
document.body.classList.add("bx--body--with-modal-open");
} else {
document.body.classList.remove("bx--body--with-modal-open");
}
});
$: if (open) {
addModalId(id);
} else {
removeModalId(id);
}
</script>
<!-- svelte-ignore a11y-mouse-events-have-key-events -->