@papernote/ui 1.0.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -21
- package/README.md +455 -445
- package/dist/components/CurrencyInput.d.ts +52 -0
- package/dist/components/CurrencyInput.d.ts.map +1 -0
- package/dist/components/DataTable.d.ts +3 -1
- package/dist/components/DataTable.d.ts.map +1 -1
- package/dist/components/Modal.d.ts.map +1 -1
- package/dist/components/Page.d.ts +2 -0
- package/dist/components/Page.d.ts.map +1 -1
- package/dist/components/PageLayout.d.ts +5 -1
- package/dist/components/PageLayout.d.ts.map +1 -1
- package/dist/components/Spreadsheet.d.ts +129 -0
- package/dist/components/Spreadsheet.d.ts.map +1 -0
- package/dist/components/Tabs.d.ts +5 -1
- package/dist/components/Tabs.d.ts.map +1 -1
- package/dist/components/index.d.ts +6 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/index.d.ts +336 -5
- package/dist/index.esm.js +51152 -174
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +51145 -143
- package/dist/index.js.map +1 -1
- package/dist/styles.css +1187 -11
- package/dist/utils/excelExport.d.ts +143 -0
- package/dist/utils/excelExport.d.ts.map +1 -0
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/package.json +13 -3
- package/src/components/AdminModal.css +49 -49
- package/src/components/CurrencyInput.stories.tsx +290 -0
- package/src/components/CurrencyInput.tsx +193 -0
- package/src/components/DataTable.stories.tsx +87 -0
- package/src/components/DataTable.tsx +149 -37
- package/src/components/Modal.stories.tsx +64 -0
- package/src/components/Modal.tsx +15 -2
- package/src/components/Page.stories.tsx +76 -0
- package/src/components/Page.tsx +35 -3
- package/src/components/PageLayout.stories.tsx +75 -0
- package/src/components/PageLayout.tsx +28 -9
- package/src/components/RoleManager.css +10 -10
- package/src/components/Spreadsheet.css +216 -0
- package/src/components/Spreadsheet.stories.tsx +362 -0
- package/src/components/Spreadsheet.tsx +351 -0
- package/src/components/SpreadsheetSimple.stories.tsx +27 -0
- package/src/components/Tabs.stories.tsx +31 -0
- package/src/components/Tabs.tsx +28 -4
- package/src/components/TimePicker.tsx +1 -1
- package/src/components/Toast.tsx +9 -9
- package/src/components/__tests__/Input.test.tsx +22 -26
- package/src/components/index.ts +11 -2
- package/src/styles/index.css +44 -6
- package/src/utils/excelExport.stories.tsx +535 -0
- package/src/utils/excelExport.ts +225 -0
- package/src/utils/index.ts +3 -0
- package/src/utils/sqlToNaturalLanguage.ts +1 -1
- package/tailwind.config.js +253 -253
- package/dist/components/Button.stories.d.ts +0 -51
- package/dist/components/Button.stories.d.ts.map +0 -1
- package/dist/components/ChartVisualizationUI.d.ts +0 -21
- package/dist/components/ChartVisualizationUI.d.ts.map +0 -1
- package/dist/components/ChatUI.d.ts +0 -23
- package/dist/components/ChatUI.d.ts.map +0 -1
- package/dist/components/CommissionDashboardUI.d.ts +0 -25
- package/dist/components/CommissionDashboardUI.d.ts.map +0 -1
- package/dist/components/DataTable.stories.d.ts +0 -23
- package/dist/components/DataTable.stories.d.ts.map +0 -1
- package/dist/components/FormField.d.ts +0 -35
- package/dist/components/FormField.d.ts.map +0 -1
- package/dist/components/Input.stories.d.ts +0 -366
- package/dist/components/Input.stories.d.ts.map +0 -1
- package/dist/components/InsightsPanelUI.d.ts +0 -21
- package/dist/components/InsightsPanelUI.d.ts.map +0 -1
- package/dist/components/PaymentHistoryTimeline.d.ts +0 -34
- package/dist/components/PaymentHistoryTimeline.d.ts.map +0 -1
- package/dist/components/RelationshipManagerUI.d.ts +0 -60
- package/dist/components/RelationshipManagerUI.d.ts.map +0 -1
- package/dist/components/RoleManager.d.ts +0 -19
- package/dist/components/RoleManager.d.ts.map +0 -1
- package/dist/components/SplitCommissionBadge.d.ts +0 -18
- package/dist/components/SplitCommissionBadge.d.ts.map +0 -1
- package/dist/components/__tests__/Button.test.d.ts +0 -2
- package/dist/components/__tests__/Button.test.d.ts.map +0 -1
- package/dist/components/__tests__/Input.test.d.ts +0 -2
- package/dist/components/__tests__/Input.test.d.ts.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as React$1 from 'react';
|
|
3
3
|
import React__default, { ReactNode, Component, ErrorInfo } from 'react';
|
|
4
|
+
import { Matrix, CellBase } from 'react-spreadsheet';
|
|
5
|
+
export { CellBase, Matrix } from 'react-spreadsheet';
|
|
4
6
|
import { LucideIcon } from 'lucide-react';
|
|
7
|
+
import { WorkBook } from 'xlsx';
|
|
5
8
|
|
|
6
9
|
/**
|
|
7
10
|
* Button component props
|
|
@@ -2085,15 +2088,19 @@ interface Tab {
|
|
|
2085
2088
|
}
|
|
2086
2089
|
interface TabsProps {
|
|
2087
2090
|
tabs: Tab[];
|
|
2091
|
+
/** Controlled mode: Currently active tab ID */
|
|
2092
|
+
activeTab?: string;
|
|
2093
|
+
/** Uncontrolled mode: Initial tab ID (ignored if activeTab is provided) */
|
|
2088
2094
|
defaultTab?: string;
|
|
2089
2095
|
variant?: 'underline' | 'pill';
|
|
2090
2096
|
/** Orientation of tabs (default: 'horizontal') */
|
|
2091
2097
|
orientation?: 'horizontal' | 'vertical';
|
|
2092
2098
|
/** Size of tabs (default: 'md') */
|
|
2093
2099
|
size?: 'sm' | 'md' | 'lg';
|
|
2100
|
+
/** Called when tab changes (required for controlled mode) */
|
|
2094
2101
|
onChange?: (tabId: string) => void;
|
|
2095
2102
|
}
|
|
2096
|
-
declare function Tabs({ tabs, defaultTab, variant, orientation, size, onChange }: TabsProps): react_jsx_runtime.JSX.Element;
|
|
2103
|
+
declare function Tabs({ tabs, activeTab: controlledActiveTab, defaultTab, variant, orientation, size, onChange }: TabsProps): react_jsx_runtime.JSX.Element;
|
|
2097
2104
|
|
|
2098
2105
|
interface PaginationProps {
|
|
2099
2106
|
currentPage: number;
|
|
@@ -2487,6 +2494,8 @@ interface PageProps {
|
|
|
2487
2494
|
className?: string;
|
|
2488
2495
|
/** Padding size around the content (default: 'normal') */
|
|
2489
2496
|
padding?: 'none' | 'sm' | 'normal' | 'lg';
|
|
2497
|
+
/** Fix all margins/padding instead of responsive (default: false) */
|
|
2498
|
+
fixed?: boolean;
|
|
2490
2499
|
}
|
|
2491
2500
|
/**
|
|
2492
2501
|
* Page - Notebook-style page container with paper aesthetic
|
|
@@ -2788,6 +2797,8 @@ interface DataTableProps<T extends BaseDataItem$1 = BaseDataItem$1> {
|
|
|
2788
2797
|
onDelete?: (item: T) => void | Promise<void>;
|
|
2789
2798
|
/** Optional custom row actions (in addition to edit/delete) */
|
|
2790
2799
|
actions?: DataTableAction<T>[];
|
|
2800
|
+
/** Enable context menu (right-click) for row actions (default: true when actions exist) */
|
|
2801
|
+
enableContextMenu?: boolean;
|
|
2791
2802
|
/** Optional click handler for rows */
|
|
2792
2803
|
onRowClick?: (item: T) => void;
|
|
2793
2804
|
/** Optional double-click handler for rows */
|
|
@@ -2893,7 +2904,132 @@ interface DataTableProps<T extends BaseDataItem$1 = BaseDataItem$1> {
|
|
|
2893
2904
|
* />
|
|
2894
2905
|
* ```
|
|
2895
2906
|
*/
|
|
2896
|
-
declare function DataTable<T extends BaseDataItem$1 = BaseDataItem$1>({ data, columns, loading, error, emptyMessage, loadingRows, className, onSortChange, currentSort, onEdit, onDelete, actions, onRowClick, onRowDoubleClick, selectable, selectedRows: externalSelectedRows, onRowSelect, keyExtractor, expandable, expandedRows: externalExpandedRows, renderExpandedRow, expandedRowConfig, showExpandChevron, striped, stripedColor, density, rowClassName, rowHighlight, highlightedRowId, bordered, borderColor, disableHover, hiddenColumns, headerClassName, renderEmptyState: customRenderEmptyState, resizable, onColumnResize, reorderable, onColumnReorder, virtualized, virtualHeight, virtualRowHeight, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
|
|
2907
|
+
declare function DataTable<T extends BaseDataItem$1 = BaseDataItem$1>({ data, columns, loading, error, emptyMessage, loadingRows, className, onSortChange, currentSort, onEdit, onDelete, actions, enableContextMenu, onRowClick, onRowDoubleClick, selectable, selectedRows: externalSelectedRows, onRowSelect, keyExtractor, expandable, expandedRows: externalExpandedRows, renderExpandedRow, expandedRowConfig, showExpandChevron, striped, stripedColor, density, rowClassName, rowHighlight, highlightedRowId, bordered, borderColor, disableHover, hiddenColumns, headerClassName, renderEmptyState: customRenderEmptyState, resizable, onColumnResize, reorderable, onColumnReorder, virtualized, virtualHeight, virtualRowHeight, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
|
|
2908
|
+
|
|
2909
|
+
/**
|
|
2910
|
+
* Enhanced cell type with formula support
|
|
2911
|
+
*/
|
|
2912
|
+
interface SpreadsheetCell extends CellBase {
|
|
2913
|
+
value: string | number | boolean;
|
|
2914
|
+
formula?: string;
|
|
2915
|
+
readOnly?: boolean;
|
|
2916
|
+
className?: string;
|
|
2917
|
+
}
|
|
2918
|
+
/**
|
|
2919
|
+
* Spreadsheet component props
|
|
2920
|
+
*/
|
|
2921
|
+
interface SpreadsheetProps {
|
|
2922
|
+
/** Initial data matrix */
|
|
2923
|
+
data?: Matrix<SpreadsheetCell>;
|
|
2924
|
+
/** Callback when data changes */
|
|
2925
|
+
onChange?: (data: Matrix<SpreadsheetCell>) => void;
|
|
2926
|
+
/** Number of rows to display */
|
|
2927
|
+
rows?: number;
|
|
2928
|
+
/** Number of columns to display */
|
|
2929
|
+
columns?: number;
|
|
2930
|
+
/** Column labels (A, B, C... if not provided) */
|
|
2931
|
+
columnLabels?: string[];
|
|
2932
|
+
/** Row labels (1, 2, 3... if not provided) */
|
|
2933
|
+
rowLabels?: string[];
|
|
2934
|
+
/** Show toolbar with actions */
|
|
2935
|
+
showToolbar?: boolean;
|
|
2936
|
+
/** Enable Excel import */
|
|
2937
|
+
enableImport?: boolean;
|
|
2938
|
+
/** Enable Excel export */
|
|
2939
|
+
enableExport?: boolean;
|
|
2940
|
+
/** Enable save button */
|
|
2941
|
+
enableSave?: boolean;
|
|
2942
|
+
/** Save handler */
|
|
2943
|
+
onSave?: (data: Matrix<SpreadsheetCell>) => Promise<void> | void;
|
|
2944
|
+
/** Title to display in toolbar */
|
|
2945
|
+
title?: string;
|
|
2946
|
+
/** Additional toolbar actions */
|
|
2947
|
+
actions?: React__default.ReactNode;
|
|
2948
|
+
/** Wrap in Card component */
|
|
2949
|
+
wrapInCard?: boolean;
|
|
2950
|
+
/** Custom className for the spreadsheet container */
|
|
2951
|
+
className?: string;
|
|
2952
|
+
/** Make entire spreadsheet read-only */
|
|
2953
|
+
readOnly?: boolean;
|
|
2954
|
+
/** Default export filename */
|
|
2955
|
+
exportFileName?: string;
|
|
2956
|
+
}
|
|
2957
|
+
/**
|
|
2958
|
+
* Spreadsheet - Interactive spreadsheet component with formula support
|
|
2959
|
+
*
|
|
2960
|
+
* A full-featured spreadsheet component for report designers and data editing.
|
|
2961
|
+
* Built on react-spreadsheet with Fast Formula Parser (280+ Excel formulas).
|
|
2962
|
+
*
|
|
2963
|
+
* **Features:**
|
|
2964
|
+
* - Excel-like formula support (SUM, AVERAGE, VLOOKUP, IF, etc.)
|
|
2965
|
+
* - Excel import/export with SheetJS
|
|
2966
|
+
* - Save/load functionality
|
|
2967
|
+
* - Keyboard navigation
|
|
2968
|
+
* - Copy/paste support
|
|
2969
|
+
* - Customizable styling to match notebook-ui aesthetic
|
|
2970
|
+
*
|
|
2971
|
+
* @example
|
|
2972
|
+
* ```tsx
|
|
2973
|
+
* // Basic spreadsheet
|
|
2974
|
+
* <Spreadsheet
|
|
2975
|
+
* rows={10}
|
|
2976
|
+
* columns={5}
|
|
2977
|
+
* showToolbar
|
|
2978
|
+
* />
|
|
2979
|
+
*
|
|
2980
|
+
* // Report designer with formulas
|
|
2981
|
+
* const [reportData, setReportData] = useState<Matrix<SpreadsheetCell>>([
|
|
2982
|
+
* [{ value: 'Q1' }, { value: 100 }],
|
|
2983
|
+
* [{ value: 'Q2' }, { value: 200 }],
|
|
2984
|
+
* [{ value: 'Total' }, { formula: '=SUM(B1:B2)' }],
|
|
2985
|
+
* ]);
|
|
2986
|
+
*
|
|
2987
|
+
* <Spreadsheet
|
|
2988
|
+
* data={reportData}
|
|
2989
|
+
* onChange={setReportData}
|
|
2990
|
+
* title="Sales Report"
|
|
2991
|
+
* showToolbar
|
|
2992
|
+
* enableImport
|
|
2993
|
+
* enableExport
|
|
2994
|
+
* enableSave
|
|
2995
|
+
* onSave={async (data) => {
|
|
2996
|
+
* await saveReport(data);
|
|
2997
|
+
* }}
|
|
2998
|
+
* />
|
|
2999
|
+
*
|
|
3000
|
+
* // With custom actions
|
|
3001
|
+
* <Spreadsheet
|
|
3002
|
+
* data={data}
|
|
3003
|
+
* onChange={setData}
|
|
3004
|
+
* showToolbar
|
|
3005
|
+
* actions={
|
|
3006
|
+
* <Button onClick={handleCustomAction}>Custom Action</Button>
|
|
3007
|
+
* }
|
|
3008
|
+
* />
|
|
3009
|
+
* ```
|
|
3010
|
+
*/
|
|
3011
|
+
declare const Spreadsheet: React__default.FC<SpreadsheetProps>;
|
|
3012
|
+
/**
|
|
3013
|
+
* SpreadsheetReport - Pre-configured spreadsheet for report designer
|
|
3014
|
+
*
|
|
3015
|
+
* A ready-to-use spreadsheet component specifically designed for building
|
|
3016
|
+
* and editing reports with formulas, import/export, and save functionality.
|
|
3017
|
+
*
|
|
3018
|
+
* @example
|
|
3019
|
+
* ```tsx
|
|
3020
|
+
* const [reportData, setReportData] = useState<Matrix<SpreadsheetCell>>();
|
|
3021
|
+
*
|
|
3022
|
+
* <SpreadsheetReport
|
|
3023
|
+
* data={reportData}
|
|
3024
|
+
* onChange={setReportData}
|
|
3025
|
+
* title="Monthly Sales Report"
|
|
3026
|
+
* onSave={async (data) => {
|
|
3027
|
+
* await api.saveReport(reportId, data);
|
|
3028
|
+
* }}
|
|
3029
|
+
* />
|
|
3030
|
+
* ```
|
|
3031
|
+
*/
|
|
3032
|
+
declare const SpreadsheetReport: React__default.FC<Omit<SpreadsheetProps, 'showToolbar' | 'enableImport' | 'enableExport' | 'enableSave' | 'wrapInCard'>>;
|
|
2897
3033
|
|
|
2898
3034
|
/**
|
|
2899
3035
|
* Form field type discriminator
|
|
@@ -3020,6 +3156,55 @@ interface CurrencyDisplayProps {
|
|
|
3020
3156
|
}
|
|
3021
3157
|
declare function CurrencyDisplay({ amount, currency, locale, className, size, color, showSign, precision, }: CurrencyDisplayProps): react_jsx_runtime.JSX.Element;
|
|
3022
3158
|
|
|
3159
|
+
interface CurrencyInputProps extends Omit<InputProps, 'type' | 'value' | 'onChange' | 'prefix'> {
|
|
3160
|
+
/** Numeric value (not formatted) */
|
|
3161
|
+
value?: number | string;
|
|
3162
|
+
/** Callback when value changes (receives numeric value) */
|
|
3163
|
+
onChange?: (value: number | null) => void;
|
|
3164
|
+
/** Currency code (default: 'USD') */
|
|
3165
|
+
currency?: string;
|
|
3166
|
+
/** Locale for formatting (default: 'en-US') */
|
|
3167
|
+
locale?: string;
|
|
3168
|
+
/** Number of decimal places (default: 2) */
|
|
3169
|
+
precision?: number;
|
|
3170
|
+
/** Allow negative values (default: false) */
|
|
3171
|
+
allowNegative?: boolean;
|
|
3172
|
+
/** Minimum allowed value */
|
|
3173
|
+
min?: number;
|
|
3174
|
+
/** Maximum allowed value */
|
|
3175
|
+
max?: number;
|
|
3176
|
+
}
|
|
3177
|
+
/**
|
|
3178
|
+
* CurrencyInput - Specialized input for monetary values
|
|
3179
|
+
*
|
|
3180
|
+
* Automatically formats currency values with proper symbols and thousands separators.
|
|
3181
|
+
* Handles parsing and validation of numeric currency input.
|
|
3182
|
+
*
|
|
3183
|
+
* @example Basic usage
|
|
3184
|
+
* ```tsx
|
|
3185
|
+
* <CurrencyInput
|
|
3186
|
+
* label="Price"
|
|
3187
|
+
* value={price}
|
|
3188
|
+
* onChange={setPrice}
|
|
3189
|
+
* currency="USD"
|
|
3190
|
+
* />
|
|
3191
|
+
* ```
|
|
3192
|
+
*
|
|
3193
|
+
* @example With validation
|
|
3194
|
+
* ```tsx
|
|
3195
|
+
* <CurrencyInput
|
|
3196
|
+
* label="Budget"
|
|
3197
|
+
* value={budget}
|
|
3198
|
+
* onChange={setBudget}
|
|
3199
|
+
* min={0}
|
|
3200
|
+
* max={10000}
|
|
3201
|
+
* validationState={budget > 10000 ? 'error' : null}
|
|
3202
|
+
* validationMessage={budget > 10000 ? 'Exceeds maximum budget' : ''}
|
|
3203
|
+
* />
|
|
3204
|
+
* ```
|
|
3205
|
+
*/
|
|
3206
|
+
declare const CurrencyInput: React__default.ForwardRefExoticComponent<CurrencyInputProps & React__default.RefAttributes<HTMLInputElement>>;
|
|
3207
|
+
|
|
3023
3208
|
interface DateDisplayProps {
|
|
3024
3209
|
date?: string | Date | null;
|
|
3025
3210
|
format?: 'short' | 'long' | 'medium' | 'numeric';
|
|
@@ -3276,6 +3461,10 @@ interface PageLayoutProps {
|
|
|
3276
3461
|
className?: string;
|
|
3277
3462
|
/** Optional content to render before the title (e.g., breadcrumbs, alerts, control bars) */
|
|
3278
3463
|
headerContent?: ReactNode;
|
|
3464
|
+
/** Maximum width constraint for the page content (default: '7xl' = 1400px) */
|
|
3465
|
+
maxWidth?: '4xl' | '5xl' | '6xl' | '7xl' | 'full';
|
|
3466
|
+
/** Fix all margins/padding instead of responsive (default: false) */
|
|
3467
|
+
fixed?: boolean;
|
|
3279
3468
|
}
|
|
3280
3469
|
/**
|
|
3281
3470
|
* PageLayout - Standard page layout with title, description, and content
|
|
@@ -3314,7 +3503,7 @@ interface PageLayoutProps {
|
|
|
3314
3503
|
* </Layout>
|
|
3315
3504
|
* ```
|
|
3316
3505
|
*/
|
|
3317
|
-
declare function PageLayout({ title, description, children, className, headerContent }: PageLayoutProps): react_jsx_runtime.JSX.Element;
|
|
3506
|
+
declare function PageLayout({ title, description, children, className, headerContent, maxWidth, fixed }: PageLayoutProps): react_jsx_runtime.JSX.Element;
|
|
3318
3507
|
|
|
3319
3508
|
interface AdminModalTab {
|
|
3320
3509
|
id: string;
|
|
@@ -3633,6 +3822,148 @@ declare function saveColumnOrder(tableId: string, order: string[]): void;
|
|
|
3633
3822
|
*/
|
|
3634
3823
|
declare function loadColumnOrder(tableId: string): string[] | null;
|
|
3635
3824
|
|
|
3825
|
+
/**
|
|
3826
|
+
* Column definition for Excel export
|
|
3827
|
+
*/
|
|
3828
|
+
interface ExcelColumn {
|
|
3829
|
+
/** Key in the data object */
|
|
3830
|
+
key: string;
|
|
3831
|
+
/** Column header label */
|
|
3832
|
+
label: string;
|
|
3833
|
+
/** Optional formatter function */
|
|
3834
|
+
format?: (value: any) => string | number | boolean;
|
|
3835
|
+
}
|
|
3836
|
+
/**
|
|
3837
|
+
* Options for exporting data to Excel
|
|
3838
|
+
*/
|
|
3839
|
+
interface ExportToExcelOptions {
|
|
3840
|
+
/** Array of data objects to export */
|
|
3841
|
+
data: any[];
|
|
3842
|
+
/** Output filename (default: 'export.xlsx') */
|
|
3843
|
+
filename?: string;
|
|
3844
|
+
/** Sheet name (default: 'Sheet1') */
|
|
3845
|
+
sheetName?: string;
|
|
3846
|
+
/** Column definitions for custom headers and ordering */
|
|
3847
|
+
columns?: ExcelColumn[];
|
|
3848
|
+
/** Include headers row (default: true) */
|
|
3849
|
+
includeHeaders?: boolean;
|
|
3850
|
+
/** Custom workbook for multi-sheet exports */
|
|
3851
|
+
workbook?: WorkBook;
|
|
3852
|
+
}
|
|
3853
|
+
/**
|
|
3854
|
+
* Export data to Excel file
|
|
3855
|
+
*
|
|
3856
|
+
* A standalone utility for exporting any data array to Excel format.
|
|
3857
|
+
* Works independently of the Spreadsheet component.
|
|
3858
|
+
*
|
|
3859
|
+
* **Features:**
|
|
3860
|
+
* - Export arrays of objects to Excel
|
|
3861
|
+
* - Custom column headers and ordering
|
|
3862
|
+
* - Value formatting with custom functions
|
|
3863
|
+
* - Multi-sheet support
|
|
3864
|
+
* - Automatic type handling
|
|
3865
|
+
*
|
|
3866
|
+
* @example
|
|
3867
|
+
* ```typescript
|
|
3868
|
+
* // Simple export - uses object keys as headers
|
|
3869
|
+
* const data = [
|
|
3870
|
+
* { id: 1, name: 'Product A', price: 29.99 },
|
|
3871
|
+
* { id: 2, name: 'Product B', price: 49.99 },
|
|
3872
|
+
* ];
|
|
3873
|
+
* exportToExcel({ data, filename: 'products.xlsx' });
|
|
3874
|
+
*
|
|
3875
|
+
* // Custom columns with formatting
|
|
3876
|
+
* exportToExcel({
|
|
3877
|
+
* data: users,
|
|
3878
|
+
* filename: 'users.xlsx',
|
|
3879
|
+
* columns: [
|
|
3880
|
+
* { key: 'id', label: 'ID' },
|
|
3881
|
+
* { key: 'name', label: 'Full Name' },
|
|
3882
|
+
* { key: 'email', label: 'Email Address' },
|
|
3883
|
+
* { key: 'createdAt', label: 'Joined', format: (date) => new Date(date).toLocaleDateString() },
|
|
3884
|
+
* { key: 'isActive', label: 'Status', format: (active) => active ? 'Active' : 'Inactive' },
|
|
3885
|
+
* ],
|
|
3886
|
+
* });
|
|
3887
|
+
*
|
|
3888
|
+
* // Multi-sheet export
|
|
3889
|
+
* const wb = utils.book_new();
|
|
3890
|
+
* exportToExcel({ data: products, sheetName: 'Products', workbook: wb });
|
|
3891
|
+
* exportToExcel({ data: orders, sheetName: 'Orders', workbook: wb });
|
|
3892
|
+
* writeFile(wb, 'multi-sheet.xlsx');
|
|
3893
|
+
* ```
|
|
3894
|
+
*
|
|
3895
|
+
* @param options - Export configuration options
|
|
3896
|
+
* @returns WorkBook if workbook option provided, otherwise void (auto-downloads)
|
|
3897
|
+
*/
|
|
3898
|
+
declare function exportToExcel({ data, filename, sheetName, columns, includeHeaders, workbook, }: ExportToExcelOptions): WorkBook | void;
|
|
3899
|
+
/**
|
|
3900
|
+
* Export DataTable-compatible data to Excel
|
|
3901
|
+
*
|
|
3902
|
+
* Helper function specifically designed for exporting DataTable data.
|
|
3903
|
+
* Automatically handles common DataTable column configurations.
|
|
3904
|
+
*
|
|
3905
|
+
* @example
|
|
3906
|
+
* ```typescript
|
|
3907
|
+
* import { exportDataTableToExcel } from 'notebook-ui';
|
|
3908
|
+
*
|
|
3909
|
+
* const columns = [
|
|
3910
|
+
* { key: 'id', header: 'ID' },
|
|
3911
|
+
* { key: 'name', header: 'Name' },
|
|
3912
|
+
* { key: 'price', header: 'Price' },
|
|
3913
|
+
* ];
|
|
3914
|
+
*
|
|
3915
|
+
* exportDataTableToExcel({
|
|
3916
|
+
* data: products,
|
|
3917
|
+
* columns: columns,
|
|
3918
|
+
* filename: 'products.xlsx',
|
|
3919
|
+
* });
|
|
3920
|
+
* ```
|
|
3921
|
+
*/
|
|
3922
|
+
interface DataTableExportOptions {
|
|
3923
|
+
/** Array of data objects */
|
|
3924
|
+
data: any[];
|
|
3925
|
+
/** DataTable column definitions */
|
|
3926
|
+
columns: Array<{
|
|
3927
|
+
key: string;
|
|
3928
|
+
header: string;
|
|
3929
|
+
}>;
|
|
3930
|
+
/** Output filename */
|
|
3931
|
+
filename?: string;
|
|
3932
|
+
/** Sheet name */
|
|
3933
|
+
sheetName?: string;
|
|
3934
|
+
}
|
|
3935
|
+
declare function exportDataTableToExcel({ data, columns, filename, sheetName, }: DataTableExportOptions): void;
|
|
3936
|
+
/**
|
|
3937
|
+
* Create a multi-sheet Excel workbook
|
|
3938
|
+
*
|
|
3939
|
+
* Utility for creating Excel files with multiple sheets.
|
|
3940
|
+
*
|
|
3941
|
+
* @example
|
|
3942
|
+
* ```typescript
|
|
3943
|
+
* import { createMultiSheetExcel } from 'notebook-ui';
|
|
3944
|
+
*
|
|
3945
|
+
* createMultiSheetExcel({
|
|
3946
|
+
* filename: 'report.xlsx',
|
|
3947
|
+
* sheets: [
|
|
3948
|
+
* { name: 'Products', data: products },
|
|
3949
|
+
* { name: 'Orders', data: orders },
|
|
3950
|
+
* { name: 'Customers', data: customers, columns: customerColumns },
|
|
3951
|
+
* ],
|
|
3952
|
+
* });
|
|
3953
|
+
* ```
|
|
3954
|
+
*/
|
|
3955
|
+
interface MultiSheetExcelOptions {
|
|
3956
|
+
/** Output filename */
|
|
3957
|
+
filename: string;
|
|
3958
|
+
/** Array of sheet configurations */
|
|
3959
|
+
sheets: Array<{
|
|
3960
|
+
name: string;
|
|
3961
|
+
data: any[];
|
|
3962
|
+
columns?: ExcelColumn[];
|
|
3963
|
+
}>;
|
|
3964
|
+
}
|
|
3965
|
+
declare function createMultiSheetExcel({ filename, sheets }: MultiSheetExcelOptions): void;
|
|
3966
|
+
|
|
3636
3967
|
interface UseColumnResizeOptions {
|
|
3637
3968
|
tableId?: string;
|
|
3638
3969
|
persist?: boolean;
|
|
@@ -3663,5 +3994,5 @@ declare function useColumnReorder<T>(initialColumns: T[], options?: UseColumnReo
|
|
|
3663
3994
|
resetOrder: () => void;
|
|
3664
3995
|
};
|
|
3665
3996
|
|
|
3666
|
-
export { Accordion, ActionButton, AdminModal, Alert, AlertDialog, AppLayout, Autocomplete, Avatar, Badge, BottomSheet, Box, Breadcrumbs, Button, ButtonGroup, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CardView, Carousel, Checkbox, Chip, Collapsible, ColorPicker, Combobox, ComingSoon, CommandPalette, ConfirmDialog, ContextMenu, ControlBar, CurrencyDisplay, Dashboard, DashboardContent, DashboardHeader, DataTable, DateDisplay, DatePicker, DateRangePicker, DateTimePicker, Drawer, DrawerFooter, DropZone, Dropdown, DropdownTrigger, EmptyState, ErrorBoundary, ExpandableRowButton, ExpandableToolbar, ExpandedRowEditForm, ExportButton, FieldArray, FileUpload, FilterBar, FilterControls, FilterStatusBanner, Form, FormContext, FormControl, FormWizard, Grid, GridItem, Hide, HoverCard, InfiniteScroll, Input, KanbanBoard, Layout, Loading, LoadingOverlay, Logo, MarkdownEditor, MaskedInput, Menu, MenuDivider, Modal, ModalFooter, MultiSelect, NotificationBar, NotificationIndicator, NumberInput, Page, PageLayout, PageNavigation, Pagination, PasswordInput, Popover, Progress, QueryTransparency, RadioGroup, Rating, RichTextEditor, SearchBar, Select, Separator, Show, Sidebar, SidebarGroup, Skeleton, SkeletonCard, SkeletonTable, Slider, Stack, StatCard$1 as StatCard, StatItem, StatsCardGrid, StatsGrid, StatusBadge, StatusBar, StepIndicator, Stepper, Switch, Table, Tabs, Text, Textarea, ThemeToggle, TimePicker, Timeline, Toast, ToastContainer, Tooltip, Transfer, TreeView, TwoColumnContent, UserProfileButton, addErrorMessage, addInfoMessage, addSuccessMessage, addWarningMessage, calculateColumnWidth, createActionsSection, createFiltersSection, createPageControlsSection, createQueryDetailsSection, formatStatisticValue, formatStatistics, loadColumnOrder, loadColumnWidths, reorderArray, saveColumnOrder, saveColumnWidths, statusManager, useColumnReorder, useColumnResize, useCommandPalette, useConfirmDialog, useFormContext, useMediaQuery };
|
|
3667
|
-
export type { AccordionItem, AccordionProps, ActionButtonProps, ActionsSectionProps, AdminModalProps, AdminModalTab, AlertDialogAction, AlertDialogProps, AlertProps, AppLayoutProps, AppliedFilter, AutocompleteHandle, AutocompleteOption, AutocompleteProps, AvatarProps, BadgeProps, BaseDataItem, BottomSheetProps, BoxProps, BreadcrumbItem, BreadcrumbsProps, ButtonGroupOption, ButtonGroupProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CardViewItem, CarouselItem, CarouselProps, CheckboxFormField, CheckboxProps, ChipProps, CollapsibleProps, ColorPickerProps, Column, ColumnOrder, ColumnResize, ComboboxHandle, ComboboxOption, ComboboxProps, ComingSoonProps, Command, CommandPaletteProps, ConfirmDialogProps, ContextMenuProps, ControlBarProps, ControlBarSection, CurrencyDisplayProps, DashboardContentProps, DashboardHeaderProps, DashboardProps, DataFetchParams, DataTableAction, DataTableColumn, DateDisplayProps, DatePickerHandle, DatePickerProps, DateRange, DateRangePickerHandle, DateRangePickerProps, DateTimePickerProps, DrawerProps, DropZoneProps, DropdownItem, DropdownProps, EmptyStateProps, ErrorBoundaryProps, ExpandableRowButtonProps, ExpandableToolbarProps, ExpandedRowConfig, ExpandedRowEditFormProps, ExpansionMode, ExportButtonProps, ExportFormat, FieldArrayProps, FieldErrors, FileUploadProps, FilterBarProps, FilterConfig, FiltersSectionProps, FormContextValue, FormControlProps, FormField, FormFieldType, FormProps, FormWizardProps, FormattedStatistic, GridItemProps, GridProps, HoverCardProps, InfiniteScrollProps, InputProps, KanbanBoardProps, KanbanCard, KanbanColumn, LayoutProps, LoadingOverlayProps, LoadingProps, LogoProps, MarkdownEditorProps, MaskType, MaskedInputHandle, MaskedInputProps, MenuItem, MenuProps, ModalProps, MultiSelectOption, MultiSelectProps, NotificationIndicatorProps, NumberInputProps, PageControlsSectionProps, PageNavigationProps, PageProps, PaginationProps, PaginationResponse, PasswordInputHandle, PasswordInputProps, PasswordStrength, PopoverProps, ProgressProps, QueryDetailsSectionProps, QueryTransparencyInfo, QueryTransparencyProps, RadioGroupProps, RadioOption, RatingProps, RichTextEditorProps, SearchBarProps, SelectFormField, SelectHandle, SelectOption, SelectProps, SeparatorProps, SidebarGroupProps, SidebarItem, SidebarProps, SliderProps, SortConfig, SortDirection, StackProps, StatCardProps, StatItemProps, StatisticConfig, StatisticFormat, StatsGridProps, StatusBadgeProps, StatusBarProps, StatusMessage, StatusType, Step, StepConfig, StepIndicatorProps, StepperProps, SwitchFormField, SwitchProps, Tab, TableProps, TabsProps, TextFormField, TextProps, TextareaFormField, TextareaProps, ThemeToggleProps, TimePickerHandle, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToastType, ToolbarSection, TooltipProps, TransferItem, TransferProps, TreeNode, TreeViewProps, TwoColumnContentProps, UploadedFile, UseColumnReorderOptions, UseColumnResizeOptions, UseDataTableOptions, UseDataTableReturn, UserProfileButtonProps, ValidationRule, ValidationState$1 as ValidationState, WizardStep };
|
|
3997
|
+
export { Accordion, ActionButton, AdminModal, Alert, AlertDialog, AppLayout, Autocomplete, Avatar, Badge, BottomSheet, Box, Breadcrumbs, Button, ButtonGroup, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CardView, Carousel, Checkbox, Chip, Collapsible, ColorPicker, Combobox, ComingSoon, CommandPalette, ConfirmDialog, ContextMenu, ControlBar, CurrencyDisplay, CurrencyInput, Dashboard, DashboardContent, DashboardHeader, DataTable, DateDisplay, DatePicker, DateRangePicker, DateTimePicker, Drawer, DrawerFooter, DropZone, Dropdown, DropdownTrigger, EmptyState, ErrorBoundary, ExpandableRowButton, ExpandableToolbar, ExpandedRowEditForm, ExportButton, FieldArray, FileUpload, FilterBar, FilterControls, FilterStatusBanner, Form, FormContext, FormControl, FormWizard, Grid, GridItem, Hide, HoverCard, InfiniteScroll, Input, KanbanBoard, Layout, Loading, LoadingOverlay, Logo, MarkdownEditor, MaskedInput, Menu, MenuDivider, Modal, ModalFooter, MultiSelect, NotificationBar, NotificationIndicator, NumberInput, Page, PageLayout, PageNavigation, Pagination, PasswordInput, Popover, Progress, QueryTransparency, RadioGroup, Rating, RichTextEditor, SearchBar, Select, Separator, Show, Sidebar, SidebarGroup, Skeleton, SkeletonCard, SkeletonTable, Slider, Spreadsheet, SpreadsheetReport, Stack, StatCard$1 as StatCard, StatItem, StatsCardGrid, StatsGrid, StatusBadge, StatusBar, StepIndicator, Stepper, Switch, Table, Tabs, Text, Textarea, ThemeToggle, TimePicker, Timeline, Toast, ToastContainer, Tooltip, Transfer, TreeView, TwoColumnContent, UserProfileButton, addErrorMessage, addInfoMessage, addSuccessMessage, addWarningMessage, calculateColumnWidth, createActionsSection, createFiltersSection, createMultiSheetExcel, createPageControlsSection, createQueryDetailsSection, exportDataTableToExcel, exportToExcel, formatStatisticValue, formatStatistics, loadColumnOrder, loadColumnWidths, reorderArray, saveColumnOrder, saveColumnWidths, statusManager, useColumnReorder, useColumnResize, useCommandPalette, useConfirmDialog, useFormContext, useMediaQuery };
|
|
3998
|
+
export type { AccordionItem, AccordionProps, ActionButtonProps, ActionsSectionProps, AdminModalProps, AdminModalTab, AlertDialogAction, AlertDialogProps, AlertProps, AppLayoutProps, AppliedFilter, AutocompleteHandle, AutocompleteOption, AutocompleteProps, AvatarProps, BadgeProps, BaseDataItem, BottomSheetProps, BoxProps, BreadcrumbItem, BreadcrumbsProps, ButtonGroupOption, ButtonGroupProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CardViewItem, CarouselItem, CarouselProps, CheckboxFormField, CheckboxProps, ChipProps, CollapsibleProps, ColorPickerProps, Column, ColumnOrder, ColumnResize, ComboboxHandle, ComboboxOption, ComboboxProps, ComingSoonProps, Command, CommandPaletteProps, ConfirmDialogProps, ContextMenuProps, ControlBarProps, ControlBarSection, CurrencyDisplayProps, CurrencyInputProps, DashboardContentProps, DashboardHeaderProps, DashboardProps, DataFetchParams, DataTableAction, DataTableColumn, DataTableExportOptions, DateDisplayProps, DatePickerHandle, DatePickerProps, DateRange, DateRangePickerHandle, DateRangePickerProps, DateTimePickerProps, DrawerProps, DropZoneProps, DropdownItem, DropdownProps, EmptyStateProps, ErrorBoundaryProps, ExcelColumn, ExpandableRowButtonProps, ExpandableToolbarProps, ExpandedRowConfig, ExpandedRowEditFormProps, ExpansionMode, ExportButtonProps, ExportFormat, ExportToExcelOptions, FieldArrayProps, FieldErrors, FileUploadProps, FilterBarProps, FilterConfig, FiltersSectionProps, FormContextValue, FormControlProps, FormField, FormFieldType, FormProps, FormWizardProps, FormattedStatistic, GridItemProps, GridProps, HoverCardProps, InfiniteScrollProps, InputProps, KanbanBoardProps, KanbanCard, KanbanColumn, LayoutProps, LoadingOverlayProps, LoadingProps, LogoProps, MarkdownEditorProps, MaskType, MaskedInputHandle, MaskedInputProps, MenuItem, MenuProps, ModalProps, MultiSelectOption, MultiSelectProps, MultiSheetExcelOptions, NotificationIndicatorProps, NumberInputProps, PageControlsSectionProps, PageNavigationProps, PageProps, PaginationProps, PaginationResponse, PasswordInputHandle, PasswordInputProps, PasswordStrength, PopoverProps, ProgressProps, QueryDetailsSectionProps, QueryTransparencyInfo, QueryTransparencyProps, RadioGroupProps, RadioOption, RatingProps, RichTextEditorProps, SearchBarProps, SelectFormField, SelectHandle, SelectOption, SelectProps, SeparatorProps, SidebarGroupProps, SidebarItem, SidebarProps, SliderProps, SortConfig, SortDirection, SpreadsheetCell, SpreadsheetProps, StackProps, StatCardProps, StatItemProps, StatisticConfig, StatisticFormat, StatsGridProps, StatusBadgeProps, StatusBarProps, StatusMessage, StatusType, Step, StepConfig, StepIndicatorProps, StepperProps, SwitchFormField, SwitchProps, Tab, TableProps, TabsProps, TextFormField, TextProps, TextareaFormField, TextareaProps, ThemeToggleProps, TimePickerHandle, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToastType, ToolbarSection, TooltipProps, TransferItem, TransferProps, TreeNode, TreeViewProps, TwoColumnContentProps, UploadedFile, UseColumnReorderOptions, UseColumnResizeOptions, UseDataTableOptions, UseDataTableReturn, UserProfileButtonProps, ValidationRule, ValidationState$1 as ValidationState, WizardStep };
|