vxui-react 1.1.1 → 1.1.2

package/dist/{components → src/components}/AppShell.d.ts

@@ -19,6 +19,7 @@ export interface AppShellProps {
     density?: 'comfortable' | 'compact';
     onSidebarToggle?: () => void;
     onMobileNavToggle?: () => void;
+    onSidebarClick?: (e: React.MouseEvent<HTMLElement>) => void;
     menuButtonLabel?: string;
     sidebarCollapseLabel?: string;
     sidebarExpandLabel?: string;
@@ -27,4 +28,4 @@ export interface AppShellProps {
     sidebarFooter?: ReactNode;
     children: ReactNode;
 }
-export declare function AppShell({ brand, brandCaption, brandIcon, topbarRef, breadcrumb, title, description, navItems, navSections, sidebarCollapsed, mobileNavOpen, onSidebarToggle, onMobileNavToggle, menuButtonLabel, sidebarCollapseLabel, sidebarExpandLabel, sidebarCloseLabel, density, headerActions, sidebarFooter, children, }: AppShellProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppShell({ brand, brandCaption, brandIcon, topbarRef, breadcrumb, title, description, navItems, navSections, sidebarCollapsed, mobileNavOpen, onSidebarToggle, onMobileNavToggle, onSidebarClick, menuButtonLabel, sidebarCollapseLabel, sidebarExpandLabel, sidebarCloseLabel, density, headerActions, sidebarFooter, children, }: AppShellProps): import("react/jsx-runtime").JSX.Element;

package/dist/{components → src/components}/Button.d.ts

@@ -1,12 +1,18 @@
-import { ButtonHTMLAttributes } from 'react';
+import { ButtonHTMLAttributes, ReactNode } from 'react';
 type ButtonVariant = 'solid' | 'secondary' | 'ghost' | 'danger' | 'outline' | 'soft' | 'danger-outline' | 'primary-outline' | 'gradient';
 type ButtonSize = 'sm' | 'md' | 'lg';
-type ButtonShape = 'rect' | 'square' | 'pill';
+type ButtonShape = 'rect' | 'square' | 'pill' | 'circle';
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: ButtonVariant;
     size?: ButtonSize;
     fullWidth?: boolean;
     shape?: ButtonShape;
+    /** Show a loading spinner and disable the button */
+    loading?: boolean;
+    /** Left-side icon slot (renders before children) */
+    startIcon?: ReactNode;
+    /** Right-side icon slot (renders after children) */
+    endIcon?: ReactNode;
 }
 export declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
 export {};

package/dist/{components → src/components}/Card.d.ts

@@ -1,6 +1,17 @@
 import { HTMLAttributes } from 'react';
-export declare function Card({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+type CardVariant = 'default' | 'flat' | 'elevated' | 'outlined' | 'ghost' | 'filled';
+type CardPadding = 'none' | 'sm' | 'md' | 'lg';
+export interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    /** Visual style preset */
+    variant?: CardVariant;
+    /** Inner padding size */
+    padding?: CardPadding;
+    /** Add a hover lift effect — useful for clickable cards */
+    hoverable?: boolean;
+}
+export declare function Card({ className, variant, padding, hoverable, ...props }: CardProps): import("react/jsx-runtime").JSX.Element;
 export declare function CardHeader({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 export declare function CardTitle({ className, ...props }: HTMLAttributes<HTMLHeadingElement>): import("react/jsx-runtime").JSX.Element;
 export declare function CardDescription({ className, ...props }: HTMLAttributes<HTMLParagraphElement>): import("react/jsx-runtime").JSX.Element;
 export declare function CardContent({ className, ...props }: HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/Dialog.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+export type DialogSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
+export type DialogPadding = 'none' | 'sm' | 'md' | 'lg';
+export interface DialogProps extends Pick<DialogPrimitive.DialogProps, 'defaultOpen' | 'onOpenChange' | 'open'> {
+    trigger: ReactNode;
+    title: string;
+    description?: string;
+    children: ReactNode;
+    footer?: ReactNode;
+    className?: string;
+    /** Dialog width preset. Default: 'md' */
+    size?: DialogSize;
+    /** Inner padding preset. Default: 'md' */
+    padding?: DialogPadding;
+    /** Allow the body to scroll when content overflows. Default: false */
+    scrollable?: boolean;
+    /** Show the close (×) button. Default: true */
+    closable?: boolean;
+}
+export declare function Dialog({ trigger, title, description, children, footer, className, size, padding, scrollable, closable, ...props }: DialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/Input.d.ts

@@ -0,0 +1,18 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+type InputVariant = 'default' | 'filled' | 'underline' | 'borderless';
+type InputSize = 'sm' | 'md' | 'lg';
+export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'prefix' | 'size'> {
+    label?: string;
+    hint?: string;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    error?: string;
+    /** Visual style */
+    variant?: InputVariant;
+    /** Height / font-size preset */
+    size?: InputSize;
+    /** Pill-shaped input */
+    rounded?: boolean;
+}
+export declare function Input({ className, label, hint, prefix, suffix, error, variant, size, rounded, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/SegmentedControl.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+export interface SegmentedControlOption {
+    label: ReactNode;
+    value: string;
+    disabled?: boolean;
+}
+export interface SegmentedControlProps {
+    options: SegmentedControlOption[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    className?: string;
+    fullWidth?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+}
+export declare function SegmentedControl({ options, value: controlledValue, defaultValue, onChange, className, fullWidth, size, }: SegmentedControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/{components → src/components}/Shell.d.ts

@@ -30,9 +30,10 @@ export interface ShellSidebarProps {
     onToggle?: () => void;
     collapseLabel?: string;
     expandLabel?: string;
+    onSidebarClick?: (e: React.MouseEvent<HTMLElement>) => void;
     children?: ReactNode;
 }
-export declare function ShellSidebar({ brand, brandCaption, brandIcon, collapsed, footer, onToggle, collapseLabel, expandLabel, children, }: ShellSidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function ShellSidebar({ brand, brandCaption, brandIcon, collapsed, footer, onToggle, collapseLabel, expandLabel, onSidebarClick, children, }: ShellSidebarProps): import("react/jsx-runtime").JSX.Element;
 export interface ShellNavProps {
     label?: string;
     children?: ReactNode;

package/dist/src/components/Table.d.ts

@@ -0,0 +1,37 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export type SortDirection = 'asc' | 'desc' | null;
+export interface TableColumn<T> {
+    key: string;
+    header: ReactNode;
+    accessor: (row: T) => ReactNode;
+    sortable?: boolean;
+    width?: string | number;
+    align?: 'left' | 'center' | 'right';
+    className?: string;
+}
+export interface TableProps<T> extends HTMLAttributes<HTMLDivElement> {
+    columns: TableColumn<T>[];
+    data: T[];
+    /** Row height preset. 'sm' replaces the legacy `compact` prop. */
+    size?: 'sm' | 'md' | 'lg';
+    striped?: boolean;
+    hoverable?: boolean;
+    bordered?: boolean;
+    /** @deprecated Use size="sm" instead */
+    compact?: boolean;
+    stickyHeader?: boolean;
+    /** Remove all borders including the outer wrapper border */
+    borderless?: boolean;
+    /** Hide the header row */
+    headless?: boolean;
+    /** Remove the outer wrapper border-radius */
+    rounded?: boolean;
+    /** Show a loading overlay over the table body */
+    loading?: boolean;
+    caption?: string;
+    emptyText?: ReactNode;
+    sortColumn?: string | null;
+    sortDirection?: SortDirection;
+    onSortChange?: (column: string, direction: SortDirection) => void;
+}
+export declare function Table<T>({ columns, data, size, striped, hoverable, bordered, compact, stickyHeader, borderless, headless, rounded, loading, caption, emptyText, sortColumn: controlledSortCol, sortDirection: controlledSortDir, onSortChange, className, ...props }: TableProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/{lib → src/lib}/index.d.ts

@@ -24,6 +24,8 @@ export { Select } from '../components/Select';
 export type { SelectProps } from '../components/Select';
 export { Checkbox } from '../components/Checkbox';
 export type { CheckboxProps } from '../components/Checkbox';
+export { SegmentedControl } from '../components/SegmentedControl';
+export type { SegmentedControlProps, SegmentedControlOption } from '../components/SegmentedControl';
 export { Radio, RadioGroup } from '../components/Radio';
 export type { RadioProps, RadioGroupProps } from '../components/Radio';
 export { Textarea } from '../components/Textarea';

package/dist/src/lib/version.d.ts

@@ -0,0 +1 @@
+export declare const APP_VERSION: string;

package/dist/{lib → src/lib}/viewport.d.ts

@@ -4,6 +4,8 @@ export interface ViewportContextValue {
     viewport: ViewportType;
     isPhone: boolean;
     isTablet: boolean;
+    /** True when the device is in the tablet width range AND screen orientation is portrait */
+    isTabletPortrait: boolean;
     isDesktop: boolean;
 }
 export interface ViewportProviderProps {