diff --git a/docs/rspack.config.ts b/docs/rspack.config.ts
index 21a7489..544a37f 100644
--- a/docs/rspack.config.ts
+++ b/docs/rspack.config.ts
@@ -85,6 +85,7 @@ export default [
       css: false,
     },
     devServer: {
+      host: '0.0.0.0',
       static: false,
       hot: false,
       liveReload: true,
diff --git a/docs/src/components/callout/callout.m.css b/docs/src/components/callout/callout.m.css
index 1d22e13..2fd39a4 100644
--- a/docs/src/components/callout/callout.m.css
+++ b/docs/src/components/callout/callout.m.css
@@ -2,12 +2,19 @@
   padding: 1.5rem 1.25rem;
   border-radius: 12px;
   background: var(--callout-bg-color, #ecf0f1);
+  display: flex;
+  align-items: center;
+  gap: 6px;
 }
 
 .callout[data-intent='danger'] {
   background: var(--callout-bg-color, rgba(211, 53, 36, 0.2));
 }
 
+.content {
+  flex-grow: 1;
+}
+
 .callout .heading {
   margin-top: 0;
   margin-bottom: 0;
diff --git a/docs/src/components/callout/callout.tsx b/docs/src/components/callout/callout.tsx
index 25b1a6c..dbd1cc5 100644
--- a/docs/src/components/callout/callout.tsx
+++ b/docs/src/components/callout/callout.tsx
@@ -1,5 +1,6 @@
 import { HTMLAttributes } from 'react';
 import classNames from 'classnames';
+import { ChevronRight } from 'lucide-react';
 import styles from './callout.m.css';
 
 export interface CalloutProps extends HTMLAttributes<HTMLDivElement> {
@@ -18,7 +19,8 @@ export function Callout({ intent = 'info', children, className, ...restProps }:
       data-intent={intent}
       data-marker='callout'
     >
-      {children}
+      <div className={styles.content}>{children}</div>
+      <ChevronRight size={20} />
     </div>
   );
 }
diff --git a/docs/src/showcase.tsx b/docs/src/showcase.tsx
index 36ced95..b721da3 100644
--- a/docs/src/showcase.tsx
+++ b/docs/src/showcase.tsx
@@ -1,6 +1,13 @@
-import { createRoot } from 'react-dom/client';
+import { hydrateRoot } from 'react-dom/client';
+import { BrowserRouter } from '@krutoo/utils/router';
 import { App } from '#components/app/app.tsx';
 import './reset.css';
 import '@krutoo/showcase/runtime-showcase/styles.css';
 
-createRoot(document.getElementById('root')!).render(<App />);
+const router = new BrowserRouter({
+  defaultLocation: window.location,
+});
+
+router.connect();
+
+hydrateRoot(document.getElementById('root')!, <App router={router} />);