@verma-consulting/design-library 0.1.26 → 0.1.28

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.
Files changed (8) hide show
  1. package/README.md +2 -1
  2. package/dist/index.d.mts +49 -20
  3. package/dist/index.d.ts +49 -20
  4. package/dist/index.js +256 -76
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +245 -66
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +1 -1
package/README.md CHANGED
@@ -64,6 +64,7 @@ The library re-exports **all of `@mui/material`**, so you can use MUI components
64
64
  | [InputFileUpload](./docs/InputFileUpload.md) | Button that opens a file picker. |
65
65
  | [ImageUploadAvatar](./docs/ImageUploadAvatar.md) | Avatar-style image upload with preview and clear. |
66
66
  | [TabPanel](./docs/TabPanel.md) | Panel content for MUI Tabs (by index). |
67
+ | [TablePagination](./docs/TablePagination.md) | MUI table pagination with modern footer UX and copy. |
67
68
  | [Pill](./docs/Pill.md) | Filter-style pill button with optional icons. |
68
69
  | [StatusPill](./docs/StatusPill.md) | Chip showing user status (Pending, Active, etc.). |
69
70
  | [IOSSwitch](./docs/IOSSwitch.md) | iOS-style switch (accepts MUI Switch props). |
@@ -77,7 +78,7 @@ Detailed docs for each component are in **[docs/](./docs/README.md)**.
77
78
 
78
79
  | Command | Description |
79
80
  | ---------------- | ------------------------------------------------------------------------------ |
80
- | `pnpm run dev` | Start the Vite dev server to preview components (e.g. `/EmptyState`, `/Pill`). |
81
+ | `pnpm run dev` | Start the Vite dev server to preview components (e.g. `/EmptyState`, `/Pill`, `/TablePagination`). |
81
82
  | `pnpm run build` | Build the library (output in `dist/`). |
82
83
  | `pnpm run watch` | Watch and rebuild on changes. |
83
84
  | `pnpm run clean` | Remove `dist/`. |
package/dist/index.d.mts CHANGED
@@ -1,7 +1,11 @@
1
1
  import { SelectChangeEvent } from '@mui/material';
2
2
  export * from '@mui/material';
3
- import React$1, { FC } from 'react';
3
+ import * as React$1 from 'react';
4
+ import React__default, { FC } from 'react';
4
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
+ import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
7
+ import * as _mui_material_TablePagination from '@mui/material/TablePagination';
8
+ import _mui_material_TablePagination__default, { LabelDisplayedRowsArgs } from '@mui/material/TablePagination';
5
9
  export { ThemeProvider, createTheme, styled, useTheme } from '@mui/material/styles';
6
10
  export { makeStyles } from '@mui/styles';
7
11
  import { SwitchProps } from '@mui/material/Switch';
@@ -13,23 +17,48 @@ interface ClearableSelectProps {
13
17
  value: string | number | (string | number)[];
14
18
  onChange: (event: SelectChangeEvent<string | number | (string | number)[]>) => void;
15
19
  size?: "small" | "medium";
16
- style?: React$1.CSSProperties;
20
+ style?: React__default.CSSProperties;
17
21
  disabled?: boolean;
18
22
  onClear?: () => void;
19
23
  multiple?: boolean;
20
24
  defaultEditMode?: boolean;
21
25
  renderValue?: () => null;
22
- children: React$1.ReactNode;
26
+ children: React__default.ReactNode;
23
27
  }
24
- declare const ClearableSelect: React$1.FC<ClearableSelectProps>;
28
+ declare const ClearableSelect: React__default.FC<ClearableSelectProps>;
25
29
 
26
30
  interface TabPanelProps {
27
- children?: React$1.ReactNode;
31
+ children?: React__default.ReactNode;
28
32
  index: number;
29
33
  value: number;
30
34
  }
31
35
  declare const TabPanel: (props: TabPanelProps) => react_jsx_runtime.JSX.Element;
32
36
 
37
+ type TablePaginationDesignProps = React$1.ComponentProps<typeof _mui_material_TablePagination__default> & {
38
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
39
+ rowsPerPageLabel?: React$1.ReactNode;
40
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
41
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
42
+ };
43
+ /**
44
+ * Design-library TablePagination: forwards MUI props and ref, with a compact
45
+ * toolbar (spacer + `justifyContent: flex-end` so controls stay right),
46
+ * optional `rowsPerPageLabel` / `displayedRangeLabel`, and first/last
47
+ * navigation by default. Use inside `TableFooter` for vertical alignment with
48
+ * table rows.
49
+ */
50
+ declare const TablePagination: React$1.ForwardRefExoticComponent<(Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<_mui_material_TablePagination.TablePaginationBaseProps, "classes" | "align" | "colSpan" | "headers" | "rowSpan" | "scope" | "abbr" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "width" | "valign" | "padding" | "size" | "sortDirection" | "sx" | "variant" | "ref" | "ActionsComponent" | "backIconButtonProps" | "count" | "disabled" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "nextIconButtonProps" | "onPageChange" | "onRowsPerPageChange" | "page" | "rowsPerPage" | "rowsPerPageOptions" | "SelectProps" | "showFirstButton" | "showLastButton" | "slotProps" | "slots"> & {
51
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
52
+ rowsPerPageLabel?: React$1.ReactNode;
53
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
54
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
55
+ }, "ref"> | Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<Omit<_mui_material_TablePagination.TablePaginationBaseProps, "ref"> & React$1.RefAttributes<React$1.Component<any, any, any>>, "classes" | "align" | "colSpan" | "headers" | "rowSpan" | "scope" | "abbr" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "width" | "valign" | "padding" | "size" | "sortDirection" | "sx" | "variant" | "ref" | "ActionsComponent" | "backIconButtonProps" | "count" | "disabled" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "nextIconButtonProps" | "onPageChange" | "onRowsPerPageChange" | "page" | "rowsPerPage" | "rowsPerPageOptions" | "SelectProps" | "showFirstButton" | "showLastButton" | "slotProps" | "slots"> & {
56
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
57
+ rowsPerPageLabel?: React$1.ReactNode;
58
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
59
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
60
+ }, "ref">) & React$1.RefAttributes<unknown>>;
61
+
33
62
  type LogoProps = {
34
63
  loggedIn?: boolean;
35
64
  centered?: boolean;
@@ -39,11 +68,11 @@ type LogoProps = {
39
68
  url?: string;
40
69
  };
41
70
  } | null;
42
- defaultLogo?: React$1.ReactNode;
43
- companyComponent?: React$1.ReactNode;
71
+ defaultLogo?: React__default.ReactNode;
72
+ companyComponent?: React__default.ReactNode;
44
73
  handleClick?: () => void;
45
74
  };
46
- declare const Logo: React$1.FC<LogoProps>;
75
+ declare const Logo: React__default.FC<LogoProps>;
47
76
 
48
77
  declare const FormDialog: ({ open, setOpen, title, actions, children, maxWidth, ...props }: {
49
78
  [x: string]: any;
@@ -71,7 +100,7 @@ type ImageUploadAvatarProps = {
71
100
  disabled?: boolean;
72
101
  allowClear?: boolean;
73
102
  };
74
- declare const ImageUploadAvatar: React$1.FC<ImageUploadAvatarProps>;
103
+ declare const ImageUploadAvatar: React__default.FC<ImageUploadAvatarProps>;
75
104
 
76
105
  declare const FormSnackBar: ({ snackBar, setSnackBar }: {
77
106
  snackBar?: {} | undefined;
@@ -82,7 +111,7 @@ interface LoaderProps {
82
111
  size?: number;
83
112
  color?: "primary" | "secondary" | "inherit" | "success" | "error" | "info" | "warning";
84
113
  }
85
- declare const Loader: React$1.FC<LoaderProps>;
114
+ declare const Loader: React__default.FC<LoaderProps>;
86
115
 
87
116
  interface SkeletonBarProps {
88
117
  width?: string | number;
@@ -93,7 +122,7 @@ interface SkeletonBarProps {
93
122
  * Horizontal bar with sideways shimmer loading animation.
94
123
  * Use in tables, cards, selects, and any loading placeholder.
95
124
  */
96
- declare const SkeletonBar: React$1.FC<SkeletonBarProps>;
125
+ declare const SkeletonBar: React__default.FC<SkeletonBarProps>;
97
126
 
98
127
  interface EmptyStateProps {
99
128
  /** Label text to display (e.g. getContent("noDataDescription")) */
@@ -101,9 +130,9 @@ interface EmptyStateProps {
101
130
  /** Vertical margin (theme spacing, default 8) */
102
131
  m?: number;
103
132
  /** Optional custom icon */
104
- icon?: React$1.ReactNode;
133
+ icon?: React__default.ReactNode;
105
134
  }
106
- declare const EmptyState: React$1.FC<EmptyStateProps>;
135
+ declare const EmptyState: React__default.FC<EmptyStateProps>;
107
136
 
108
137
  type PillProps = {
109
138
  label?: string;
@@ -116,19 +145,19 @@ type PillProps = {
116
145
  };
117
146
  declare const Pill: ({ variant, leftIcon, rightIcon, color, isSelected, onClick, label, disabled, }: PillProps) => react_jsx_runtime.JSX.Element;
118
147
 
119
- declare const IOSSwitch: React$1.FC<SwitchProps>;
148
+ declare const IOSSwitch: React__default.FC<SwitchProps>;
120
149
 
121
150
  interface StatusPillProps {
122
151
  status: userStatus;
123
152
  }
124
- declare const StatusPill: React$1.FC<StatusPillProps>;
153
+ declare const StatusPill: React__default.FC<StatusPillProps>;
125
154
 
126
155
  interface FormPopoverProps {
127
156
  row?: any;
128
157
  children: (props: {
129
158
  row: any;
130
159
  handleClose: () => void;
131
- }) => React$1.ReactNode;
160
+ }) => React__default.ReactNode;
132
161
  title?: string;
133
162
  }
134
163
  declare const FormPopover: FC<FormPopoverProps>;
@@ -140,13 +169,13 @@ interface SearchableSelectProps {
140
169
  onChange: (value: string) => void;
141
170
  options: GenericPayload[];
142
171
  size?: "small" | "medium";
143
- style?: React$1.CSSProperties;
172
+ style?: React__default.CSSProperties;
144
173
  disabled?: boolean;
145
174
  onClear?: () => void;
146
175
  defaultEditMode?: boolean;
147
176
  multiple?: boolean;
148
177
  }
149
- declare const SearchableSelect: React$1.FC<SearchableSelectProps>;
178
+ declare const SearchableSelect: React__default.FC<SearchableSelectProps>;
150
179
 
151
180
  interface FormDrawerProps {
152
181
  open: boolean;
@@ -167,6 +196,6 @@ interface PhoneNumberFieldProps {
167
196
  autoFocus?: boolean;
168
197
  onBlur?: () => void;
169
198
  }
170
- declare const PhoneNumberField: React$1.FC<PhoneNumberFieldProps>;
199
+ declare const PhoneNumberField: React__default.FC<PhoneNumberFieldProps>;
171
200
 
172
- export { ClearableSelect, EmptyState, FormDialog, FormDrawer, FormPopover, FormSnackBar, IOSSwitch, ImageUploadAvatar, InputFileUpload, Loader, Logo, PhoneNumberField, Pill, SearchableSelect, SkeletonBar, StatusPill, TabPanel };
201
+ export { ClearableSelect, EmptyState, FormDialog, FormDrawer, FormPopover, FormSnackBar, IOSSwitch, ImageUploadAvatar, InputFileUpload, Loader, Logo, PhoneNumberField, Pill, SearchableSelect, SkeletonBar, StatusPill, TabPanel, TablePagination, type TablePaginationDesignProps };
package/dist/index.d.ts CHANGED
@@ -1,7 +1,11 @@
1
1
  import { SelectChangeEvent } from '@mui/material';
2
2
  export * from '@mui/material';
3
- import React$1, { FC } from 'react';
3
+ import * as React$1 from 'react';
4
+ import React__default, { FC } from 'react';
4
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
+ import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
7
+ import * as _mui_material_TablePagination from '@mui/material/TablePagination';
8
+ import _mui_material_TablePagination__default, { LabelDisplayedRowsArgs } from '@mui/material/TablePagination';
5
9
  export { ThemeProvider, createTheme, styled, useTheme } from '@mui/material/styles';
6
10
  export { makeStyles } from '@mui/styles';
7
11
  import { SwitchProps } from '@mui/material/Switch';
@@ -13,23 +17,48 @@ interface ClearableSelectProps {
13
17
  value: string | number | (string | number)[];
14
18
  onChange: (event: SelectChangeEvent<string | number | (string | number)[]>) => void;
15
19
  size?: "small" | "medium";
16
- style?: React$1.CSSProperties;
20
+ style?: React__default.CSSProperties;
17
21
  disabled?: boolean;
18
22
  onClear?: () => void;
19
23
  multiple?: boolean;
20
24
  defaultEditMode?: boolean;
21
25
  renderValue?: () => null;
22
- children: React$1.ReactNode;
26
+ children: React__default.ReactNode;
23
27
  }
24
- declare const ClearableSelect: React$1.FC<ClearableSelectProps>;
28
+ declare const ClearableSelect: React__default.FC<ClearableSelectProps>;
25
29
 
26
30
  interface TabPanelProps {
27
- children?: React$1.ReactNode;
31
+ children?: React__default.ReactNode;
28
32
  index: number;
29
33
  value: number;
30
34
  }
31
35
  declare const TabPanel: (props: TabPanelProps) => react_jsx_runtime.JSX.Element;
32
36
 
37
+ type TablePaginationDesignProps = React$1.ComponentProps<typeof _mui_material_TablePagination__default> & {
38
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
39
+ rowsPerPageLabel?: React$1.ReactNode;
40
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
41
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
42
+ };
43
+ /**
44
+ * Design-library TablePagination: forwards MUI props and ref, with a compact
45
+ * toolbar (spacer + `justifyContent: flex-end` so controls stay right),
46
+ * optional `rowsPerPageLabel` / `displayedRangeLabel`, and first/last
47
+ * navigation by default. Use inside `TableFooter` for vertical alignment with
48
+ * table rows.
49
+ */
50
+ declare const TablePagination: React$1.ForwardRefExoticComponent<(Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<_mui_material_TablePagination.TablePaginationBaseProps, "classes" | "align" | "colSpan" | "headers" | "rowSpan" | "scope" | "abbr" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "width" | "valign" | "padding" | "size" | "sortDirection" | "sx" | "variant" | "ref" | "ActionsComponent" | "backIconButtonProps" | "count" | "disabled" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "nextIconButtonProps" | "onPageChange" | "onRowsPerPageChange" | "page" | "rowsPerPage" | "rowsPerPageOptions" | "SelectProps" | "showFirstButton" | "showLastButton" | "slotProps" | "slots"> & {
51
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
52
+ rowsPerPageLabel?: React$1.ReactNode;
53
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
54
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
55
+ }, "ref"> | Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<Omit<_mui_material_TablePagination.TablePaginationBaseProps, "ref"> & React$1.RefAttributes<React$1.Component<any, any, any>>, "classes" | "align" | "colSpan" | "headers" | "rowSpan" | "scope" | "abbr" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "height" | "width" | "valign" | "padding" | "size" | "sortDirection" | "sx" | "variant" | "ref" | "ActionsComponent" | "backIconButtonProps" | "count" | "disabled" | "getItemAriaLabel" | "labelDisplayedRows" | "labelRowsPerPage" | "nextIconButtonProps" | "onPageChange" | "onRowsPerPageChange" | "page" | "rowsPerPage" | "rowsPerPageOptions" | "SelectProps" | "showFirstButton" | "showLastButton" | "slotProps" | "slots"> & {
56
+ /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
57
+ rowsPerPageLabel?: React$1.ReactNode;
58
+ /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
59
+ displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React$1.ReactNode;
60
+ }, "ref">) & React$1.RefAttributes<unknown>>;
61
+
33
62
  type LogoProps = {
34
63
  loggedIn?: boolean;
35
64
  centered?: boolean;
@@ -39,11 +68,11 @@ type LogoProps = {
39
68
  url?: string;
40
69
  };
41
70
  } | null;
42
- defaultLogo?: React$1.ReactNode;
43
- companyComponent?: React$1.ReactNode;
71
+ defaultLogo?: React__default.ReactNode;
72
+ companyComponent?: React__default.ReactNode;
44
73
  handleClick?: () => void;
45
74
  };
46
- declare const Logo: React$1.FC<LogoProps>;
75
+ declare const Logo: React__default.FC<LogoProps>;
47
76
 
48
77
  declare const FormDialog: ({ open, setOpen, title, actions, children, maxWidth, ...props }: {
49
78
  [x: string]: any;
@@ -71,7 +100,7 @@ type ImageUploadAvatarProps = {
71
100
  disabled?: boolean;
72
101
  allowClear?: boolean;
73
102
  };
74
- declare const ImageUploadAvatar: React$1.FC<ImageUploadAvatarProps>;
103
+ declare const ImageUploadAvatar: React__default.FC<ImageUploadAvatarProps>;
75
104
 
76
105
  declare const FormSnackBar: ({ snackBar, setSnackBar }: {
77
106
  snackBar?: {} | undefined;
@@ -82,7 +111,7 @@ interface LoaderProps {
82
111
  size?: number;
83
112
  color?: "primary" | "secondary" | "inherit" | "success" | "error" | "info" | "warning";
84
113
  }
85
- declare const Loader: React$1.FC<LoaderProps>;
114
+ declare const Loader: React__default.FC<LoaderProps>;
86
115
 
87
116
  interface SkeletonBarProps {
88
117
  width?: string | number;
@@ -93,7 +122,7 @@ interface SkeletonBarProps {
93
122
  * Horizontal bar with sideways shimmer loading animation.
94
123
  * Use in tables, cards, selects, and any loading placeholder.
95
124
  */
96
- declare const SkeletonBar: React$1.FC<SkeletonBarProps>;
125
+ declare const SkeletonBar: React__default.FC<SkeletonBarProps>;
97
126
 
98
127
  interface EmptyStateProps {
99
128
  /** Label text to display (e.g. getContent("noDataDescription")) */
@@ -101,9 +130,9 @@ interface EmptyStateProps {
101
130
  /** Vertical margin (theme spacing, default 8) */
102
131
  m?: number;
103
132
  /** Optional custom icon */
104
- icon?: React$1.ReactNode;
133
+ icon?: React__default.ReactNode;
105
134
  }
106
- declare const EmptyState: React$1.FC<EmptyStateProps>;
135
+ declare const EmptyState: React__default.FC<EmptyStateProps>;
107
136
 
108
137
  type PillProps = {
109
138
  label?: string;
@@ -116,19 +145,19 @@ type PillProps = {
116
145
  };
117
146
  declare const Pill: ({ variant, leftIcon, rightIcon, color, isSelected, onClick, label, disabled, }: PillProps) => react_jsx_runtime.JSX.Element;
118
147
 
119
- declare const IOSSwitch: React$1.FC<SwitchProps>;
148
+ declare const IOSSwitch: React__default.FC<SwitchProps>;
120
149
 
121
150
  interface StatusPillProps {
122
151
  status: userStatus;
123
152
  }
124
- declare const StatusPill: React$1.FC<StatusPillProps>;
153
+ declare const StatusPill: React__default.FC<StatusPillProps>;
125
154
 
126
155
  interface FormPopoverProps {
127
156
  row?: any;
128
157
  children: (props: {
129
158
  row: any;
130
159
  handleClose: () => void;
131
- }) => React$1.ReactNode;
160
+ }) => React__default.ReactNode;
132
161
  title?: string;
133
162
  }
134
163
  declare const FormPopover: FC<FormPopoverProps>;
@@ -140,13 +169,13 @@ interface SearchableSelectProps {
140
169
  onChange: (value: string) => void;
141
170
  options: GenericPayload[];
142
171
  size?: "small" | "medium";
143
- style?: React$1.CSSProperties;
172
+ style?: React__default.CSSProperties;
144
173
  disabled?: boolean;
145
174
  onClear?: () => void;
146
175
  defaultEditMode?: boolean;
147
176
  multiple?: boolean;
148
177
  }
149
- declare const SearchableSelect: React$1.FC<SearchableSelectProps>;
178
+ declare const SearchableSelect: React__default.FC<SearchableSelectProps>;
150
179
 
151
180
  interface FormDrawerProps {
152
181
  open: boolean;
@@ -167,6 +196,6 @@ interface PhoneNumberFieldProps {
167
196
  autoFocus?: boolean;
168
197
  onBlur?: () => void;
169
198
  }
170
- declare const PhoneNumberField: React$1.FC<PhoneNumberFieldProps>;
199
+ declare const PhoneNumberField: React__default.FC<PhoneNumberFieldProps>;
171
200
 
172
- export { ClearableSelect, EmptyState, FormDialog, FormDrawer, FormPopover, FormSnackBar, IOSSwitch, ImageUploadAvatar, InputFileUpload, Loader, Logo, PhoneNumberField, Pill, SearchableSelect, SkeletonBar, StatusPill, TabPanel };
201
+ export { ClearableSelect, EmptyState, FormDialog, FormDrawer, FormPopover, FormSnackBar, IOSSwitch, ImageUploadAvatar, InputFileUpload, Loader, Logo, PhoneNumberField, Pill, SearchableSelect, SkeletonBar, StatusPill, TabPanel, TablePagination, type TablePaginationDesignProps };