diff options
Diffstat (limited to 'examples/framework-preact/src/components/Counter.tsx')
-rw-r--r-- | examples/framework-preact/src/components/Counter.tsx | 30 |
1 files changed, 30 insertions, 0 deletions
diff --git a/examples/framework-preact/src/components/Counter.tsx b/examples/framework-preact/src/components/Counter.tsx new file mode 100644 index 000000000..a63bf0cd7 --- /dev/null +++ b/examples/framework-preact/src/components/Counter.tsx @@ -0,0 +1,30 @@ +import type { ComponentChildren } from 'preact'; +import type { Signal } from '@preact/signals'; +import { lazy, Suspense } from 'preact/compat'; +import './Counter.css'; + +const Message = lazy(async () => import('./Message')); +const Fallback = () => <p>Loading...</p>; + +type Props = { + children: ComponentChildren; + count: Signal<number>; +}; + +export default function Counter({ children, count }: Props) { + const add = () => count.value++; + const subtract = () => count.value--; + + return ( + <> + <div class="counter"> + <button onClick={subtract}>-</button> + <pre>{count}</pre> + <button onClick={add}>+</button> + </div> + <Suspense fallback={Fallback}> + <Message>{children}</Message> + </Suspense> + </> + ); +} |