@mshuja288/aksuicore 0.3.0 → 0.4.1

package/dist/index.d.cts

@@ -84,12 +84,16 @@ declare function Snackbar({ message, success, onDismiss, }: {
 /** @deprecated Prefer Snackbar — alias kept for configurator migration */
 declare const StatusMessage: typeof Snackbar;
 
-declare function Topbar({ title, logoSrc, logoAlt, username, onLogout, children, }: {
+declare function Topbar({ title, logoSrc, logoAlt, username, onLogout, showMenuButton, menuOpen, onMenuClick, children, }: {
     title: string;
     logoSrc?: string;
     logoAlt?: string;
     username?: string;
     onLogout?: () => void;
+    /** Shows a hamburger control (used by AppShell drawer on small screens). */
+    showMenuButton?: boolean;
+    menuOpen?: boolean;
+    onMenuClick?: () => void;
     children?: ReactNode;
 }): react.JSX.Element;
 
@@ -99,11 +103,12 @@ type SideNavItem = {
     /** Compact label for the mobile bottom nav (falls back to `label`). */
     short?: string;
 };
-declare function SideNav({ items, activeId, onSelect, label, }: {
+declare function SideNav({ items, activeId, onSelect, label, className, }: {
     items: SideNavItem[];
     activeId: string;
     onSelect: (id: string) => void;
     label?: string;
+    className?: string;
 }): react.JSX.Element;
 
 type PageSizeOption = {
@@ -132,6 +137,7 @@ declare function FormActions({ pending, editing, saveLabel, updateLabel, newLabe
     replaceSaveWhenEditing?: boolean;
 }): react.JSX.Element | null;
 
+type MobileNavMode = "drawer" | "bottom" | "hybrid";
 type AppShellProps = {
     title: string;
     logoSrc?: string;
@@ -142,8 +148,21 @@ type AppShellProps = {
     activeNavId: string;
     onNavSelect: (id: string) => void;
     navLabel?: string;
-    /** When true (default), renders a mobile bottom nav from `navItems`. */
+    /**
+     * Small-screen navigation strategy.
+     * - `drawer` (default): hamburger opens a collapsible side menu; no crowded bottom bar
+     * - `bottom`: classic bottom nav from all `navItems` (fine for a few sections)
+     * - `hybrid`: compact bottom bar with current section + Menu that opens the drawer
+     */
+    mobileNav?: MobileNavMode;
+    /**
+     * When true, renders the mobile bottom nav.
+     * Defaults to true for `bottom` / `hybrid`, false for `drawer`.
+     */
     showBottomNav?: boolean;
+    /** Controlled drawer open state (optional). */
+    navDrawerOpen?: boolean;
+    onNavDrawerOpenChange?: (open: boolean) => void;
     topbarActions?: ReactNode;
     children: ReactNode;
     /** Extra class on the content/screen region */
@@ -151,9 +170,9 @@ type AppShellProps = {
 };
 /**
  * Application chrome: topbar + left side nav + content screen.
- * Matches aksconfigurator_ui shell layout.
+ * On small screens, prefers a collapsible drawer over a crowded bottom nav.
  */
-declare function AppShell({ title, logoSrc, logoAlt, username, onLogout, navItems, activeNavId, onNavSelect, navLabel, showBottomNav, topbarActions, children, screenClassName, }: AppShellProps): react.JSX.Element;
+declare function AppShell({ title, logoSrc, logoAlt, username, onLogout, navItems, activeNavId, onNavSelect, navLabel, mobileNav, showBottomNav, navDrawerOpen, onNavDrawerOpenChange, topbarActions, children, screenClassName, }: AppShellProps): react.JSX.Element;
 
 type TableColumn<T> = {
     key: string;
@@ -165,10 +184,19 @@ type TableColumn<T> = {
     /** When set, filter uses an exact-match Select instead of text contains. */
     filterOptions?: SelectOption[];
     filterPlaceholder?: string;
+    /** When false, column starts hidden. Default true. */
+    defaultVisible?: boolean;
+    /** Key sent to export APIs when different from `key` (e.g. PascalCase property name). */
+    exportKey?: string;
 };
 /** Formats supported by the shared table download control (matches akscore TableExport). */
 type ExportDownloadFormat = "csv" | "xlsx" | "json";
-declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAdd, addLabel, canAdd, onView, onUpdate, onDelete, canUpdate, canDelete, onDownload, canDownload, downloadBusy, toolbar, form, }: {
+/** Column descriptors passed to `onDownload` (visible columns only). */
+type ExportColumnRef = {
+    key: string;
+    header: string;
+};
+declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAdd, addLabel, canAdd, onView, onUpdate, onDelete, canUpdate, canDelete, onDownload, canDownload, downloadBusy, showColumnPicker, columnPrefsKey, visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange, toolbar, form, }: {
     title: string;
     columns: TableColumn<T>[];
     items: T[];
@@ -182,10 +210,22 @@ declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAd
     onDelete?: (item: T) => void;
     canUpdate?: (item: T) => boolean;
     canDelete?: (item: T) => boolean;
-    /** When set, shows CSV / Excel / JSON download controls in the side rail. */
-    onDownload?: (format: ExportDownloadFormat) => void;
+    /**
+     * When set, shows CSV / Excel / JSON download controls.
+     * Second argument lists currently visible columns (exportKey ?? key).
+     */
+    onDownload?: (format: ExportDownloadFormat, columns: ExportColumnRef[]) => void;
     canDownload?: boolean;
     downloadBusy?: boolean;
+    /** Column checklist in the side rail. Default true. */
+    showColumnPicker?: boolean;
+    /** Persist visible column keys in localStorage under this key. */
+    columnPrefsKey?: string;
+    /** Controlled visible column keys. */
+    visibleColumnKeys?: string[];
+    /** Uncontrolled initial visible keys (defaults to columns with defaultVisible !== false). */
+    defaultVisibleColumnKeys?: string[];
+    onVisibleColumnKeysChange?: (keys: string[]) => void;
     toolbar?: ReactNode;
     /** Slot for Add/Update/View dialogs owned by the host app. */
     form?: ReactNode;
@@ -193,4 +233,4 @@ declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAd
 /** @deprecated Prefer RecordWorkspace — alias kept for configurator migration */
 declare const RecordTable: typeof RecordWorkspace;
 
-export { type AksuiTokenName, AppSelect, type AppSelectOption, AppShell, type AppShellProps, Button, type ButtonVariant, ConfirmDeleteDialog, DateField, Dialog, type ExportDownloadFormat, FormActions, FormDialog, type PageSizeOption, Pagination, RecordTable, RecordWorkspace, Select, type SelectOption, SideNav, type SideNavItem, Snackbar, StatusMessage, type TableColumn, Topbar, aksuiThemeVersion, aksuiTokens };
+export { type AksuiTokenName, AppSelect, type AppSelectOption, AppShell, type AppShellProps, Button, type ButtonVariant, ConfirmDeleteDialog, DateField, Dialog, type ExportColumnRef, type ExportDownloadFormat, FormActions, FormDialog, type MobileNavMode, type PageSizeOption, Pagination, RecordTable, RecordWorkspace, Select, type SelectOption, SideNav, type SideNavItem, Snackbar, StatusMessage, type TableColumn, Topbar, aksuiThemeVersion, aksuiTokens };

package/dist/index.d.ts

@@ -84,12 +84,16 @@ declare function Snackbar({ message, success, onDismiss, }: {
 /** @deprecated Prefer Snackbar — alias kept for configurator migration */
 declare const StatusMessage: typeof Snackbar;
 
-declare function Topbar({ title, logoSrc, logoAlt, username, onLogout, children, }: {
+declare function Topbar({ title, logoSrc, logoAlt, username, onLogout, showMenuButton, menuOpen, onMenuClick, children, }: {
     title: string;
     logoSrc?: string;
     logoAlt?: string;
     username?: string;
     onLogout?: () => void;
+    /** Shows a hamburger control (used by AppShell drawer on small screens). */
+    showMenuButton?: boolean;
+    menuOpen?: boolean;
+    onMenuClick?: () => void;
     children?: ReactNode;
 }): react.JSX.Element;
 
@@ -99,11 +103,12 @@ type SideNavItem = {
     /** Compact label for the mobile bottom nav (falls back to `label`). */
     short?: string;
 };
-declare function SideNav({ items, activeId, onSelect, label, }: {
+declare function SideNav({ items, activeId, onSelect, label, className, }: {
     items: SideNavItem[];
     activeId: string;
     onSelect: (id: string) => void;
     label?: string;
+    className?: string;
 }): react.JSX.Element;
 
 type PageSizeOption = {
@@ -132,6 +137,7 @@ declare function FormActions({ pending, editing, saveLabel, updateLabel, newLabe
     replaceSaveWhenEditing?: boolean;
 }): react.JSX.Element | null;
 
+type MobileNavMode = "drawer" | "bottom" | "hybrid";
 type AppShellProps = {
     title: string;
     logoSrc?: string;
@@ -142,8 +148,21 @@ type AppShellProps = {
     activeNavId: string;
     onNavSelect: (id: string) => void;
     navLabel?: string;
-    /** When true (default), renders a mobile bottom nav from `navItems`. */
+    /**
+     * Small-screen navigation strategy.
+     * - `drawer` (default): hamburger opens a collapsible side menu; no crowded bottom bar
+     * - `bottom`: classic bottom nav from all `navItems` (fine for a few sections)
+     * - `hybrid`: compact bottom bar with current section + Menu that opens the drawer
+     */
+    mobileNav?: MobileNavMode;
+    /**
+     * When true, renders the mobile bottom nav.
+     * Defaults to true for `bottom` / `hybrid`, false for `drawer`.
+     */
     showBottomNav?: boolean;
+    /** Controlled drawer open state (optional). */
+    navDrawerOpen?: boolean;
+    onNavDrawerOpenChange?: (open: boolean) => void;
     topbarActions?: ReactNode;
     children: ReactNode;
     /** Extra class on the content/screen region */
@@ -151,9 +170,9 @@ type AppShellProps = {
 };
 /**
  * Application chrome: topbar + left side nav + content screen.
- * Matches aksconfigurator_ui shell layout.
+ * On small screens, prefers a collapsible drawer over a crowded bottom nav.
  */
-declare function AppShell({ title, logoSrc, logoAlt, username, onLogout, navItems, activeNavId, onNavSelect, navLabel, showBottomNav, topbarActions, children, screenClassName, }: AppShellProps): react.JSX.Element;
+declare function AppShell({ title, logoSrc, logoAlt, username, onLogout, navItems, activeNavId, onNavSelect, navLabel, mobileNav, showBottomNav, navDrawerOpen, onNavDrawerOpenChange, topbarActions, children, screenClassName, }: AppShellProps): react.JSX.Element;
 
 type TableColumn<T> = {
     key: string;
@@ -165,10 +184,19 @@ type TableColumn<T> = {
     /** When set, filter uses an exact-match Select instead of text contains. */
     filterOptions?: SelectOption[];
     filterPlaceholder?: string;
+    /** When false, column starts hidden. Default true. */
+    defaultVisible?: boolean;
+    /** Key sent to export APIs when different from `key` (e.g. PascalCase property name). */
+    exportKey?: string;
 };
 /** Formats supported by the shared table download control (matches akscore TableExport). */
 type ExportDownloadFormat = "csv" | "xlsx" | "json";
-declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAdd, addLabel, canAdd, onView, onUpdate, onDelete, canUpdate, canDelete, onDownload, canDownload, downloadBusy, toolbar, form, }: {
+/** Column descriptors passed to `onDownload` (visible columns only). */
+type ExportColumnRef = {
+    key: string;
+    header: string;
+};
+declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAdd, addLabel, canAdd, onView, onUpdate, onDelete, canUpdate, canDelete, onDownload, canDownload, downloadBusy, showColumnPicker, columnPrefsKey, visibleColumnKeys, defaultVisibleColumnKeys, onVisibleColumnKeysChange, toolbar, form, }: {
     title: string;
     columns: TableColumn<T>[];
     items: T[];
@@ -182,10 +210,22 @@ declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAd
     onDelete?: (item: T) => void;
     canUpdate?: (item: T) => boolean;
     canDelete?: (item: T) => boolean;
-    /** When set, shows CSV / Excel / JSON download controls in the side rail. */
-    onDownload?: (format: ExportDownloadFormat) => void;
+    /**
+     * When set, shows CSV / Excel / JSON download controls.
+     * Second argument lists currently visible columns (exportKey ?? key).
+     */
+    onDownload?: (format: ExportDownloadFormat, columns: ExportColumnRef[]) => void;
     canDownload?: boolean;
     downloadBusy?: boolean;
+    /** Column checklist in the side rail. Default true. */
+    showColumnPicker?: boolean;
+    /** Persist visible column keys in localStorage under this key. */
+    columnPrefsKey?: string;
+    /** Controlled visible column keys. */
+    visibleColumnKeys?: string[];
+    /** Uncontrolled initial visible keys (defaults to columns with defaultVisible !== false). */
+    defaultVisibleColumnKeys?: string[];
+    onVisibleColumnKeysChange?: (keys: string[]) => void;
     toolbar?: ReactNode;
     /** Slot for Add/Update/View dialogs owned by the host app. */
     form?: ReactNode;
@@ -193,4 +233,4 @@ declare function RecordWorkspace<T>({ title, columns, items, rowKey, empty, onAd
 /** @deprecated Prefer RecordWorkspace — alias kept for configurator migration */
 declare const RecordTable: typeof RecordWorkspace;
 
-export { type AksuiTokenName, AppSelect, type AppSelectOption, AppShell, type AppShellProps, Button, type ButtonVariant, ConfirmDeleteDialog, DateField, Dialog, type ExportDownloadFormat, FormActions, FormDialog, type PageSizeOption, Pagination, RecordTable, RecordWorkspace, Select, type SelectOption, SideNav, type SideNavItem, Snackbar, StatusMessage, type TableColumn, Topbar, aksuiThemeVersion, aksuiTokens };
+export { type AksuiTokenName, AppSelect, type AppSelectOption, AppShell, type AppShellProps, Button, type ButtonVariant, ConfirmDeleteDialog, DateField, Dialog, type ExportColumnRef, type ExportDownloadFormat, FormActions, FormDialog, type MobileNavMode, type PageSizeOption, Pagination, RecordTable, RecordWorkspace, Select, type SelectOption, SideNav, type SideNavItem, Snackbar, StatusMessage, type TableColumn, Topbar, aksuiThemeVersion, aksuiTokens };