bnk-components/dist/examples/SidebarExample.js

Reusable React components for Issaglam UI - Modern, responsive UI components with TypeScript support

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const SidebarExample = () => {
    return (_jsxs("div", { className: "example-page", children: [_jsxs("div", { className: "example-header", children: [_jsx("h1", { children: "Sidebar Bile\u015Feni" }), _jsx("p", { children: "Yan men\u00FC bile\u015Feni \u00F6rnekleri" })] }), _jsxs("div", { className: "example-section", children: [_jsx("h2", { children: "Temel Kullan\u0131m" }), _jsx("p", { children: "Sidebar bile\u015Feni, yan men\u00FC ve navigasyon i\u00E7in kullan\u0131l\u0131r." }), _jsx("div", { className: "code-block", children: `import { Sidebar } from 'bnk-components';

const menuItems = [
  { id: '1', label: 'Ana Sayfa', icon: 'home' },
  { id: '2', label: 'Kullanıcılar', icon: 'users' },
  { id: '3', label: 'Ayarlar', icon: 'settings' }
];

<Sidebar
  items={menuItems}
  onItemClick={(item) => console.log(item)}
/>` }), _jsx("div", { style: { marginTop: '2rem', padding: '2rem', background: '#f8f9fa', borderRadius: '8px' }, children: _jsxs("p", { children: [_jsx("strong", { children: "Not:" }), " Sidebar bile\u015Feni \u00F6rne\u011Fi burada g\u00F6sterilecek."] }) })] })] }));
};
export default SidebarExample;