Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-12 00:05:50 +01:00
Code Issues Packages Projects Releases Activity

feat(react): port info modal

Browse Source
This commit is contained in:
Elian Doran
2025-08-03 23:20:32 +03:00
parent e53ad2c62a
commit a62f12b427
4 changed files with 72 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
apps/client/src/widgets/react/Button.tsx
View File

@@ -1,6 +1,9 @@
import { RefObject } from "preact";
import { useRef } from "preact/hooks";
interface ButtonProps {
/** Reference to the button element. Mostly useful for requesting focus. */
buttonRef: RefObject<HTMLButtonElement>;
text: string;
className?: string;
keyboardShortcut?: string;
@@ -8,14 +11,14 @@ interface ButtonProps {
onClick?: () => void;
}
export default function Button({ className, text, onClick, keyboardShortcut }: ButtonProps) {
export default function Button({ buttonRef: _buttonRef, className, text, onClick, keyboardShortcut }: ButtonProps) {
const classes: string[] = ["btn"];
classes.push("btn-primary");
if (className) {
classes.push(className);
}
const buttonRef = useRef<HTMLButtonElement>(null);
const buttonRef = _buttonRef ?? useRef<HTMLButtonElement>(null);
const splitShortcut = (keyboardShortcut ?? "").split("+");
return (

14
apps/client/src/widgets/react/Modal.tsx
View File

@@ -15,18 +15,26 @@ interface ModalProps {
* Especially useful for user input that can be submitted with Enter key.
*/
onSubmit?: () => void;
/** Called when the modal is shown. */
onShown?: () => void;
/** Called when the modal is hidden, either via close button, backdrop click or submit. */
onHidden?: () => void;
helpPageId?: string;
}
export default function Modal({ children, className, size, title, footer, onShown, onSubmit, helpPageId, maxWidth }: ModalProps) {
export default function Modal({ children, className, size, title, footer, onShown, onSubmit, helpPageId, maxWidth, onHidden: onHidden }: ModalProps) {
const modalRef = useRef<HTMLDivElement>(null);
if (onShown) {
if (onShown || onHidden) {
useEffect(() => {
const modalElement = modalRef.current;
if (modalElement) {
modalElement.addEventListener("shown.bs.modal", onShown);
if (onShown) {
modalElement.addEventListener("shown.bs.modal", onShown);
}
if (onHidden) {
modalElement.addEventListener("hidden.bs.modal", onHidden);
}
}
});
}