@omni-design/components 0.7.0

package/dist/types/components/MainLayout/MainLayout.d.ts

@@ -0,0 +1,28 @@
+/**
+ * MainLayout Component
+ * Flexible layout with multiple navigation options
+ * Supports: SideNav, RailNav, TopNav, or combinations
+ * Fully responsive - adapts to mobile/tablet/desktop
+ *
+ * @param {string} layout - Layout type: 'side' | 'rail' | 'top' | 'side-rail'
+ * @param {Array} navItems - Navigation items
+ * @param {string} title - App title
+ * @param {ReactNode} children - Page content
+ * @param {function} onLayoutChange - Layout change handler
+ * @param {object} props - Additional props
+ */
+export function MainLayout({ layout, navItems, title, children, onLayoutChange, onNavigate, sx, ...props }: string): JSX.Element;
+/**
+ * DefaultMainLayout Component
+ * MainLayout with default demo content
+ * Shows design system documentation
+ */
+export function DefaultMainLayout({ layout, mode, onModeChange, onLayoutChange, sx, ...props }: {
+    [x: string]: any;
+    layout?: string;
+    mode?: string;
+    onModeChange: any;
+    onLayoutChange: any;
+    sx?: {};
+}): JSX.Element;
+export default MainLayout;

package/dist/types/components/MainLayout/index.d.ts

@@ -0,0 +1 @@
+export { MainLayout, DefaultMainLayout, default } from "./MainLayout";

package/dist/types/components/Menu/Menu.d.ts

@@ -0,0 +1,37 @@
+export function Dropdown({ children, variant, color, size, open: controlledOpen, onOpenChange, ...props }: {
+    [x: string]: any;
+    children: any;
+    variant?: string;
+    color?: string;
+    size?: string;
+    open: any;
+    onOpenChange: any;
+}): JSX.Element;
+export function MenuButton({ children, className, sx, ...props }: {
+    [x: string]: any;
+    children: any;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export function Menu({ children, className, placement, sx, ...props }: {
+    [x: string]: any;
+    children: any;
+    className?: string;
+    placement?: string;
+    sx?: {};
+}): JSX.Element;
+export function MenuItem({ children, onClick, selected, disabled, className, sx, ...props }: {
+    [x: string]: any;
+    children: any;
+    onClick: any;
+    selected?: boolean;
+    disabled?: boolean;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export function MenuDivider({ className, sx, ...props }: {
+    [x: string]: any;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Menu;

package/dist/types/components/Menu/MenuShowcase.d.ts

@@ -0,0 +1,2 @@
+export function MenuShowcase(): JSX.Element;
+export default MenuShowcase;

package/dist/types/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { MenuShowcase } from "./MenuShowcase";
+export { Dropdown, MenuButton, Menu, MenuItem, MenuDivider, default } from "./Menu";

package/dist/types/components/Modal/Modal.d.ts

@@ -0,0 +1,18 @@
+export function Modal({ open, onClose, children, title, variant, color, size, layout, transition, transitionSpeed, closeOnBackdrop, showCloseButton, className, sx, ...props }: {
+    [x: string]: any;
+    open: any;
+    onClose: any;
+    children: any;
+    title: any;
+    variant?: string;
+    color?: string;
+    size?: string;
+    layout?: string;
+    transition?: string;
+    transitionSpeed?: number;
+    closeOnBackdrop?: boolean;
+    showCloseButton?: boolean;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Modal;

package/dist/types/components/Modal/ModalShowcase.d.ts

@@ -0,0 +1,2 @@
+export function ModalShowcase(): JSX.Element;
+export default ModalShowcase;

package/dist/types/components/Modal/index.d.ts

@@ -0,0 +1,2 @@
+export { ModalShowcase } from "./ModalShowcase";
+export { Modal, default } from "./Modal";

package/dist/types/components/NumberField/NumberField.d.ts

@@ -0,0 +1,22 @@
+export function NumberField({ value: controlledValue, defaultValue, onChange, min, max, step, variant, style: styleVariant, color, size, label, labelPosition, placeholder, helperText, disabled, fullWidth, className, sx, ...props }: {
+    [x: string]: any;
+    value: any;
+    defaultValue?: number;
+    onChange: any;
+    min: any;
+    max: any;
+    step?: number;
+    variant?: string;
+    style?: string;
+    color?: string;
+    size?: string;
+    label: any;
+    labelPosition?: string;
+    placeholder: any;
+    helperText: any;
+    disabled?: boolean;
+    fullWidth?: boolean;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default NumberField;

package/dist/types/components/NumberField/NumberFieldShowcase.d.ts

@@ -0,0 +1,2 @@
+export function NumberFieldShowcase(): JSX.Element;
+export default NumberFieldShowcase;

package/dist/types/components/NumberField/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberFieldShowcase } from "./NumberFieldShowcase";
+export { NumberField, default } from "./NumberField";

package/dist/types/components/Pagination/Pagination.d.ts

@@ -0,0 +1,17 @@
+export function Pagination({ count, page: controlledPage, defaultPage, onChange, color, size, siblingCount, boundaryCount, disabled, showFirstButton, showLastButton, className, sx, ...props }: {
+    [x: string]: any;
+    count?: number;
+    page: any;
+    defaultPage?: number;
+    onChange: any;
+    color?: string;
+    size?: string;
+    siblingCount?: number;
+    boundaryCount?: number;
+    disabled?: boolean;
+    showFirstButton?: boolean;
+    showLastButton?: boolean;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Pagination;

package/dist/types/components/Pagination/PaginationShowcase.d.ts

@@ -0,0 +1,2 @@
+export function PaginationShowcase(): JSX.Element;
+export default PaginationShowcase;

package/dist/types/components/Pagination/index.d.ts

@@ -0,0 +1,2 @@
+export { PaginationShowcase } from "./PaginationShowcase";
+export { Pagination, default } from "./Pagination";

package/dist/types/components/Paper/Paper.d.ts

@@ -0,0 +1,111 @@
+/**
+ * usePaperSurface Hook
+ * Manages data-surface attribute and elevation mapping
+ *
+ * Surface Elevations:
+ * - Container-Lowest: Lowest elevation (0dp)
+ * - Container-Low: Low elevation (1dp)
+ * - Container: Medium elevation (4dp) - default
+ * - Container-High: High elevation (8dp)
+ * - Container-Highest: Highest elevation (12dp)
+ *
+ * @param {string} surface - Surface elevation level
+ * @returns {object} - Data-surface object and elevation level
+ */
+export function usePaperSurface(surface?: string): object;
+/**
+ * Paper Component
+ * Base paper component with elevation levels
+ * Styling applied via data-surface CSS variables
+ *
+ * Surface Levels:
+ * - Container-Lowest: Flat, no shadow
+ * - Container-Low: Subtle shadow
+ * - Container: Standard elevation
+ * - Container-High: Elevated appearance
+ * - Container-Highest: Most elevated
+ *
+ * @param {string} surface - Elevation surface level (Container-Lowest to Container-Highest)
+ * @param {ReactNode} children - Paper content
+ * @param {boolean} outlined - Use outline variant instead of elevation
+ * @param {object} props - Additional MUI Paper props
+ */
+export function Paper({ children, surface, outlined, variant, sx, ...props }: string): JSX.Element;
+/**
+ * InteractivePaper Component
+ * Paper that responds to hover and focus
+ *
+ * @param {string} surface - Elevation surface level
+ * @param {ReactNode} children - Paper content
+ * @param {function} onClick - Click handler
+ * @param {boolean} hoverable - Enable hover elevation
+ * @param {object} props - Additional props
+ */
+export function InteractivePaper({ children, surface, onClick, hoverable, sx, ...props }: string): JSX.Element;
+/**
+ * ElevatedPaper Component
+ * Paper with explicit elevation control
+ *
+ * @param {string} surface - Elevation surface level
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function ElevatedPaper({ children, surface, sx, ...props }: string): JSX.Element;
+/**
+ * OutlinedPaper Component
+ * Paper with outlined variant (no elevation/shadow)
+ *
+ * @param {string} surface - Surface level for styling
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function OutlinedPaper({ children, surface, sx, ...props }: string): JSX.Element;
+/**
+ * CardPaper Component
+ * Card-style paper with padding options
+ *
+ * @param {string} surface - Elevation surface level
+ * @param {ReactNode} children - Paper content
+ * @param {string} padding - Padding size: 'none' | 'small' | 'medium' | 'large'
+ * @param {object} props - Additional props
+ */
+export function CardPaper({ children, surface, padding, sx, ...props }: string): JSX.Element;
+/**
+ * NestedPaper Component
+ * Paper with nested/layered effect
+ *
+ * @param {string} outerSurface - Outer paper elevation
+ * @param {string} innerSurface - Inner paper elevation
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function NestedPaper({ children, outerSurface, innerSurface, sx, ...props }: string): JSX.Element;
+/**
+ * TieredPaper Component
+ * Paper showing all elevation levels
+ * Useful for documentation and testing
+ *
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function TieredPaper({ children, label, sx, ...props }: ReactNode): JSX.Element;
+/**
+ * ResponsivePaper Component
+ * Paper that adapts elevation based on screen size
+ *
+ * @param {string} mobileSurface - Surface on mobile
+ * @param {string} tabletSurface - Surface on tablet
+ * @param {string} desktopSurface - Surface on desktop
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function ResponsivePaper({ children, mobileSurface, tabletSurface, desktopSurface, sx, ...props }: string): JSX.Element;
+/**
+ * FloatingPaper Component
+ * Paper that appears to float above the page
+ *
+ * @param {ReactNode} children - Paper content
+ * @param {object} props - Additional props
+ */
+export function FloatingPaper({ children, sx, ...props }: ReactNode): JSX.Element;
+export default Paper;

package/dist/types/components/Paper/index.d.ts

@@ -0,0 +1 @@
+export { Paper, usePaperSurface, InteractivePaper, ElevatedPaper, OutlinedPaper, CardPaper, NestedPaper, TieredPaper, ResponsivePaper, FloatingPaper, default } from "./Paper";

package/dist/types/components/Popover/Popover.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Popover Component
+ *
+ * A positioned overlay that renders via portal to escape parent overflow.
+ * Accepts any children — use for notifications, rich tooltips, pickers, etc.
+ *
+ * Props:
+ *   open        boolean        — controlled visibility
+ *   onClose     fn()           — called on outside click or Escape
+ *   anchorRef   React.ref      — element to position against
+ *   placement   string         — 'bottom-start' | 'bottom-end' (default: 'bottom-end')
+ *   theme       string         — data-theme value (default: 'Default')
+ *   surface     string         — data-surface value (default: 'Surface-Bright')
+ *   width       number|string  — popover width (default: 320)
+ *   maxHeight   number|string  — max height before scroll (default: 400)
+ *   children    ReactNode
+ *   sx          object
+ */
+export function Popover({ open, onClose, anchorRef, placement, theme, surface, width, maxHeight, children, sx, }: {
+    open?: boolean;
+    onClose: any;
+    anchorRef: any;
+    placement?: string;
+    theme?: string;
+    surface?: string;
+    width?: number;
+    maxHeight?: number;
+    children: any;
+    sx?: {};
+}): any;
+export default Popover;

package/dist/types/components/Popover/index.d.ts

@@ -0,0 +1 @@
+export { Popover, default } from "./Popover";

package/dist/types/components/PreviewSurface.d.ts

@@ -0,0 +1,18 @@
+/**
+ * PreviewSurface (controlled)
+ *
+ * Wraps the component preview area with data-theme and data-surface
+ * so all tokens resolve correctly for the chosen background environment.
+ *
+ * Props:
+ *   theme      — data-theme value (null = Default)
+ *   surface    — data-surface value (default: 'Surface')
+ *   children   — the component being previewed
+ *   minHeight  — minimum height of the preview area (default: 160)
+ *   sx         — additional MUI sx overrides
+ *
+ * Use BackgroundPicker in the playground tab to let the user choose
+ * both the theme and surface.
+ */
+export const PreviewSurface: any;
+export default PreviewSurface;

package/dist/types/components/Radio/Radio.d.ts

@@ -0,0 +1,55 @@
+export function Radio({ color, size, label, labelPlacement, checked, disabled, onChange, name, value, className, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, inputProps: inputPropsProp, ...props }: {
+    [x: string]: any;
+    color?: string;
+    size?: string;
+    label: any;
+    labelPlacement?: string;
+    checked: any;
+    disabled?: boolean;
+    onChange: any;
+    name: any;
+    value: any;
+    className?: string;
+    sx?: {};
+    "aria-label": any;
+    "aria-labelledby": any;
+    "aria-describedby": any;
+    inputProps?: {};
+}): JSX.Element;
+export function RadioGroup({ color, size, label, options, value, onChange, orientation, labelPlacement, disabled, spacing, name, className, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...props }: {
+    [x: string]: any;
+    color?: string;
+    size?: string;
+    label: any;
+    options?: any[];
+    value: any;
+    onChange: any;
+    orientation?: string;
+    labelPlacement?: string;
+    disabled?: boolean;
+    spacing?: number;
+    name: any;
+    className?: string;
+    sx?: {};
+    "aria-label": any;
+    "aria-labelledby": any;
+}): JSX.Element;
+export function RadioInput({ color, size, label, labelPlacement, checked, disabled, onChange, name, value, className, sx, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, inputProps: inputPropsProp, ...props }: {
+    [x: string]: any;
+    color?: string;
+    size?: string;
+    label: any;
+    labelPlacement?: string;
+    checked: any;
+    disabled?: boolean;
+    onChange: any;
+    name: any;
+    value: any;
+    className?: string;
+    sx?: {};
+    "aria-label": any;
+    "aria-labelledby": any;
+    "aria-describedby": any;
+    inputProps?: {};
+}): JSX.Element;
+export default Radio;

package/dist/types/components/Radio/RadioShowcase.d.ts

@@ -0,0 +1,2 @@
+export function RadioShowcase(): JSX.Element;
+export default RadioShowcase;

package/dist/types/components/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export { RadioShowcase } from "./RadioShowcase";
+export { Radio, RadioGroup, RadioInput, default } from "./Radio";

package/dist/types/components/Rail/Rail.d.ts

@@ -0,0 +1,15 @@
+export function Rail({ items, sections, value: controlledValue, defaultValue, onChange, expandable, expandedWidth, defaultExpanded, fabAction, className, sx, ...props }: {
+    [x: string]: any;
+    items?: any[];
+    sections: any;
+    value: any;
+    defaultValue?: number;
+    onChange: any;
+    expandable?: boolean;
+    expandedWidth?: string;
+    defaultExpanded?: boolean;
+    fabAction: any;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Rail;

package/dist/types/components/Rail/RailShowcase.d.ts

@@ -0,0 +1,2 @@
+export function RailShowcase(): JSX.Element;
+export default RailShowcase;

package/dist/types/components/Rail/index.d.ts

@@ -0,0 +1,2 @@
+export { RailShowcase } from "./RailShowcase";
+export { Rail, default } from "./Rail";

package/dist/types/components/Rating/Rating.d.ts

@@ -0,0 +1,16 @@
+export function Rating({ value: controlledValue, defaultValue, onChange, max, precision, color, size, readOnly, disabled, emptyLabel, className, sx, ...props }: {
+    [x: string]: any;
+    value: any;
+    defaultValue: any;
+    onChange: any;
+    max?: number;
+    precision?: number;
+    color?: string;
+    size?: string;
+    readOnly?: boolean;
+    disabled?: boolean;
+    emptyLabel?: string;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Rating;

package/dist/types/components/Rating/RatingShowcase.d.ts

@@ -0,0 +1,2 @@
+export function RatingShowcase(): JSX.Element;
+export default RatingShowcase;

package/dist/types/components/Rating/index.d.ts

@@ -0,0 +1,2 @@
+export { RatingShowcase } from "./RatingShowcase";
+export { Rating, Rating as RatingInput, default } from "./Rating";

package/dist/types/components/Ratio/Ratio.d.ts

@@ -0,0 +1,20 @@
+export function Ratio({ ratio, children, variant, color, padding, fit, placeholder, elevated, clickable, onClick, maxWidth, maxHeight, component, className, sx, ...props }: {
+    [x: string]: any;
+    ratio?: string;
+    children: any;
+    variant?: string;
+    color?: string;
+    padding?: string;
+    fit?: string;
+    placeholder?: boolean;
+    elevated?: boolean;
+    clickable?: boolean;
+    onClick: any;
+    maxWidth: any;
+    maxHeight: any;
+    component?: string;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export const RATIO_NAMES: string[];
+export default Ratio;

package/dist/types/components/Ratio/RatioShowcase.d.ts

@@ -0,0 +1,2 @@
+export function RatioShowcase(): JSX.Element;
+export default RatioShowcase;

package/dist/types/components/Ratio/index.d.ts

@@ -0,0 +1,2 @@
+export { RatioShowcase } from "./RatioShowcase";
+export { Ratio, RATIO_NAMES, default } from "./Ratio";

package/dist/types/components/SearchField/SearchField.d.ts

@@ -0,0 +1,19 @@
+export function SearchField({ value: controlledValue, defaultValue, onChange, onFocus, onBlur, onClear, onSubmit, placeholder, size, color, showClearButton, disabled, ariaLabel, className, sx, ...props }: {
+    [x: string]: any;
+    value: any;
+    defaultValue?: string;
+    onChange: any;
+    onFocus: any;
+    onBlur: any;
+    onClear: any;
+    onSubmit: any;
+    placeholder?: string;
+    size?: string;
+    color?: string;
+    showClearButton?: boolean;
+    disabled?: boolean;
+    ariaLabel?: string;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default SearchField;

package/dist/types/components/SearchField/SearchFieldShowcase.d.ts

@@ -0,0 +1,2 @@
+export function SearchFieldShowcase(): JSX.Element;
+export default SearchFieldShowcase;

package/dist/types/components/SearchField/index.d.ts

@@ -0,0 +1,2 @@
+export { SearchFieldShowcase } from "./SearchFieldShowcase";
+export { SearchField, default } from "./SearchField";

package/dist/types/components/Section/Section.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Section Component
+ *
+ * The one-liner for painting a region with the design system. Sets
+ * `data-theme` + `data-surface` and paints `--Background` / `--Text` so all
+ * nested components (text, buttons, cards) automatically pick up the
+ * correct tone — no inline `background: var(--Surface)` or hex needed.
+ *
+ * Use this anywhere you'd otherwise reach for:
+ *   <section data-theme=".." data-surface=".."
+ *            style={{ background: 'var(--Background)', color: 'var(--Text)' }}>
+ *
+ * Props:
+ *   theme    — OmniDesign theme name (e.g. "Primary-Light", "Neutral-Dark").
+ *              Optional: omit to inherit from the parent theme zone.
+ *   surface  — "Surface" (default) | "Surface-Dim" | "Surface-Dimmest" |
+ *              "Surface-Bright" | "Surface-Brightest" |
+ *              "Container" | "Container-Low" | "Container-Lowest" |
+ *              "Container-High" | "Container-Highest"
+ *
+ *              Five surface levels, darkest to lightest. Surface-Brightest is
+ *              the level that replaced the <Palette>-Light themes: it lands on
+ *              the same tone their Surface used, so `theme="Primary"
+ *              surface="Surface-Brightest"` is what `theme="Primary-Light"`
+ *              used to be. Passed through unvalidated — an unknown value
+ *              simply matches no rule and inherits the parent's paint.
+ *   as       — element tag, defaults to "section"
+ *   padding  — CSS padding value (string or number). Optional.
+ *   className, style, children, ...rest — forwarded.
+ *
+ * For wrapping without painting (e.g. AppBar's themed zone), use ThemedZone
+ * instead.
+ */
+export function Section({ theme, surface, as: Tag, padding, className, style, children, ...rest }: {
+    [x: string]: any;
+    theme: any;
+    surface?: string;
+    as?: string;
+    padding: any;
+    className: any;
+    style: any;
+    children: any;
+}): JSX.Element;
+export default Section;

package/dist/types/components/Section/SectionShowcase.d.ts

@@ -0,0 +1,2 @@
+export function SectionShowcase(): JSX.Element;
+export default SectionShowcase;

package/dist/types/components/Section/index.d.ts

@@ -0,0 +1,2 @@
+export { SectionShowcase } from "./SectionShowcase";
+export { Section, default } from "./Section";

package/dist/types/components/Select/Select.d.ts

@@ -0,0 +1,23 @@
+export function Select({ options, value: controlledValue, defaultValue, onChange, label, labelPosition, size, variant, color, selectionStyle, mode, placeholder, showDividers, showColorLabels, startDecoration, disabled, fullWidth, className, sx, ...props }: {
+    [x: string]: any;
+    options?: any[];
+    value: any;
+    defaultValue?: string;
+    onChange: any;
+    label: any;
+    labelPosition?: string;
+    size?: string;
+    variant?: string;
+    color?: string;
+    selectionStyle?: string;
+    mode?: string;
+    placeholder?: string;
+    showDividers?: boolean;
+    showColorLabels?: boolean;
+    startDecoration: any;
+    disabled?: boolean;
+    fullWidth?: boolean;
+    className?: string;
+    sx?: {};
+}): JSX.Element;
+export default Select;

package/dist/types/components/Select/SelectShowcase.d.ts

@@ -0,0 +1,2 @@
+export function SelectShowcase(): JSX.Element;
+export default SelectShowcase;

package/dist/types/components/Select/index.d.ts

@@ -0,0 +1,2 @@
+export { SelectShowcase } from "./SelectShowcase";
+export { Select, default } from "./Select";

package/dist/types/components/SettingsPanel.d.ts

@@ -0,0 +1,2 @@
+export function SettingsPanel(): JSX.Element;
+export default SettingsPanel;

package/dist/types/components/Sidebar/Sidebar.d.ts

@@ -0,0 +1,53 @@
+/**
+ * Sidebar Component
+ * Expandable drawer sidebar with menu items
+ *
+ * Design System Integration:
+ * - Background: var(--Container)
+ * - Text: var(--Text)
+ * - Selected: var(--Buttons-Primary-Button) bg, var(--Buttons-Primary-Text) text
+ * - Border: var(--Border-Variant)
+ *
+ * WCAG 2.1 Accessibility:
+ * - Proper semantic structure
+ * - Keyboard navigation
+ * - ARIA labels
+ * - Focus management
+ *
+ * @param {boolean} open - Sidebar open state
+ * @param {function} onClose - Close handler
+ * @param {Array} items - Array of menu items {label, icon, onClick, badge}
+ * @param {function} onItemClick - Item click handler
+ * @param {number} width - Sidebar width
+ * @param {string} variant - Sidebar variant: 'standard' | 'permanent' | 'temporary'
+ * @param {object} props - Additional props
+ */
+export function Sidebar({ open, onClose, items, onItemClick, width, variant, header, footer, sx, ...props }: boolean): JSX.Element;
+/**
+ * CollapsibleSidebar Component
+ * Sidebar that collapses to icon-only mode
+ *
+ * @param {boolean} collapsed - Collapsed state
+ * @param {function} onToggle - Toggle collapse handler
+ * @param {Array} items - Menu items
+ * @param {object} props - Additional props
+ */
+export function CollapsibleSidebar({ collapsed, onToggle, items, onItemClick, header, sx, ...props }: boolean): JSX.Element;
+/**
+ * UserProfileSidebar Component
+ * Sidebar with user profile section
+ *
+ * @param {object} user - User object {name, avatar, email}
+ * @param {Array} items - Menu items
+ * @param {object} props - Additional props
+ */
+export function UserProfileSidebar({ open, onClose, user, items, onItemClick, onUserClick, sx, ...props }: object): JSX.Element;
+/**
+ * MinimalSidebar Component
+ * Minimal icon-only sidebar
+ *
+ * @param {Array} items - Menu items (icon only)
+ * @param {object} props - Additional props
+ */
+export function MinimalSidebar({ items, onItemClick, sx, ...props }: any[]): JSX.Element;
+export default Sidebar;

package/dist/types/components/Sidebar/index.d.ts

@@ -0,0 +1 @@
+export { Sidebar, CollapsibleSidebar, UserProfileSidebar, MinimalSidebar, default } from "./Sidebar";