30 lines
603 B
TypeScript
30 lines
603 B
TypeScript
import { createEffect, type ParentComponent } from "solid-js";
|
|
import styles from "./BottomSheet.module.css";
|
|
|
|
export type BottomSheetProps = {
|
|
open?: boolean;
|
|
};
|
|
|
|
const BottomSheet: ParentComponent<BottomSheetProps> = (props) => {
|
|
let element: HTMLDialogElement;
|
|
|
|
createEffect(() => {
|
|
if (props.open) {
|
|
if (!element.open) {
|
|
element.showModal();
|
|
}
|
|
} else {
|
|
if (element.open) {
|
|
element.close();
|
|
}
|
|
}
|
|
});
|
|
|
|
return (
|
|
<dialog class={styles.bottomSheet} ref={element!}>
|
|
{props.children}
|
|
</dialog>
|
|
);
|
|
};
|
|
|
|
export default BottomSheet;
|