Add very simple search support to pages, togglable with "k"
This commit is contained in:
parent
807cd815ea
commit
0dbf6b51b5
8 changed files with 216 additions and 4 deletions
22
resources/scripts/components/elements/InputSpinner.tsx
Normal file
22
resources/scripts/components/elements/InputSpinner.tsx
Normal file
|
@ -0,0 +1,22 @@
|
|||
import React from 'react';
|
||||
import Spinner from '@/components/elements/Spinner';
|
||||
import { CSSTransition } from 'react-transition-group';
|
||||
|
||||
const InputSpinner = ({ visible, children }: { visible: boolean, children: React.ReactNode }) => (
|
||||
<div className={'relative'}>
|
||||
<CSSTransition
|
||||
timeout={250}
|
||||
in={visible}
|
||||
unmountOnExit={true}
|
||||
appear={true}
|
||||
classNames={'fade'}
|
||||
>
|
||||
<div className={'absolute pin-r h-full flex items-center justify-end pr-3'}>
|
||||
<Spinner size={'tiny'}/>
|
||||
</div>
|
||||
</CSSTransition>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
||||
export default InputSpinner;
|
Reference in a new issue