@verma-consulting/design-library 0.1.46 → 0.1.47

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/README.md CHANGED
@@ -16,11 +16,11 @@ yarn add @verma-consulting/design-library
16
16
 
17
17
  Install these in your app (they are not bundled):
18
18
 
19
- - `react` (>=17)
20
- - `react-dom` (>=17)
21
- - `@mui/material` (^5.15.15)
22
- - `@mui/icons-material` (^7.3.0)
23
- - `@mui/styles` (^5.15.15)
19
+ - `react` (^18 or ^19)
20
+ - `react-dom` (^18 or ^19)
21
+ - `@mui/material` (^5.16.8 or ^7.3)
22
+ - `@mui/icons-material` (^5.16.8 or ^7.3)
23
+ - `@mui/styles` (^5.16.8 or ^7.3)
24
24
 
25
25
  The package also depends on `@verma-consulting/common-library`; it will be installed automatically.
26
26
 
package/dist/index.d.mts CHANGED
@@ -3,9 +3,8 @@ export * from '@mui/material';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import * as React from 'react';
5
5
  import React__default, { FC, KeyboardEvent } from 'react';
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';
6
+ import MuiTablePagination, { LabelDisplayedRowsArgs } from '@mui/material/TablePagination';
7
+ import { SxProps, Theme } from '@mui/material/styles';
9
8
  export { ThemeProvider, createTheme, styled, useTheme } from '@mui/material/styles';
10
9
  export { makeStyles } from '@mui/styles';
11
10
  import { SwitchProps } from '@mui/material/Switch';
@@ -18,7 +17,7 @@ interface TabPanelProps {
18
17
  }
19
18
  declare const TabPanel: (props: TabPanelProps) => react_jsx_runtime.JSX.Element;
20
19
 
21
- type TablePaginationDesignProps = React.ComponentProps<typeof _mui_material_TablePagination__default> & {
20
+ type TablePaginationDesignProps = React.ComponentProps<typeof MuiTablePagination> & {
22
21
  /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
23
22
  rowsPerPageLabel?: React.ReactNode;
24
23
  /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
@@ -31,17 +30,7 @@ type TablePaginationDesignProps = React.ComponentProps<typeof _mui_material_Tabl
31
30
  * navigation by default. Use inside `TableFooter` for vertical alignment with
32
31
  * table rows.
33
32
  */
34
- declare const TablePagination: React.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"> & {
35
- /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
36
- rowsPerPageLabel?: React.ReactNode;
37
- /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
38
- displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React.ReactNode;
39
- }, "ref"> | Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<Omit<_mui_material_TablePagination.TablePaginationBaseProps, "ref"> & React.RefAttributes<React.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"> & {
40
- /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
41
- rowsPerPageLabel?: React.ReactNode;
42
- /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
43
- displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React.ReactNode;
44
- }, "ref">) & React.RefAttributes<unknown>>;
33
+ declare const TablePagination: React.ForwardRefExoticComponent<Omit<TablePaginationDesignProps, "ref"> & React.RefAttributes<unknown>>;
45
34
 
46
35
  type LogoProps = {
47
36
  loggedIn?: boolean;
@@ -216,7 +205,8 @@ interface CountrySelectProps {
216
205
  label?: string;
217
206
  size?: "small" | "medium";
218
207
  disabled?: boolean;
219
- style?: React__default.CSSProperties;
208
+ /** Applied to the view wrapper and the edit-mode `Autocomplete` root. */
209
+ sx?: SxProps<Theme>;
220
210
  }
221
211
  declare const CountrySelect: React__default.FC<CountrySelectProps>;
222
212
 
package/dist/index.d.ts CHANGED
@@ -3,9 +3,8 @@ export * from '@mui/material';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import * as React from 'react';
5
5
  import React__default, { FC, KeyboardEvent } from 'react';
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';
6
+ import MuiTablePagination, { LabelDisplayedRowsArgs } from '@mui/material/TablePagination';
7
+ import { SxProps, Theme } from '@mui/material/styles';
9
8
  export { ThemeProvider, createTheme, styled, useTheme } from '@mui/material/styles';
10
9
  export { makeStyles } from '@mui/styles';
11
10
  import { SwitchProps } from '@mui/material/Switch';
@@ -18,7 +17,7 @@ interface TabPanelProps {
18
17
  }
19
18
  declare const TabPanel: (props: TabPanelProps) => react_jsx_runtime.JSX.Element;
20
19
 
21
- type TablePaginationDesignProps = React.ComponentProps<typeof _mui_material_TablePagination__default> & {
20
+ type TablePaginationDesignProps = React.ComponentProps<typeof MuiTablePagination> & {
22
21
  /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
23
22
  rowsPerPageLabel?: React.ReactNode;
24
23
  /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
@@ -31,17 +30,7 @@ type TablePaginationDesignProps = React.ComponentProps<typeof _mui_material_Tabl
31
30
  * navigation by default. Use inside `TableFooter` for vertical alignment with
32
31
  * table rows.
33
32
  */
34
- declare const TablePagination: React.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"> & {
35
- /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
36
- rowsPerPageLabel?: React.ReactNode;
37
- /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
38
- displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React.ReactNode;
39
- }, "ref"> | Omit<_mui_material_TablePagination.TablePaginationOwnProps & _mui_material_OverridableComponent.CommonProps & Omit<Omit<_mui_material_TablePagination.TablePaginationBaseProps, "ref"> & React.RefAttributes<React.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"> & {
40
- /** Label before the rows-per-page control. Default: "Per page". Overrides MUI `labelRowsPerPage` when both are omitted; explicit `labelRowsPerPage` wins. */
41
- rowsPerPageLabel?: React.ReactNode;
42
- /** Formats the range summary (e.g. total count). Default: "1–10 of 47 results". Overrides MUI `labelDisplayedRows` when both are omitted; explicit `labelDisplayedRows` wins. */
43
- displayedRangeLabel?: (info: LabelDisplayedRowsArgs) => React.ReactNode;
44
- }, "ref">) & React.RefAttributes<unknown>>;
33
+ declare const TablePagination: React.ForwardRefExoticComponent<Omit<TablePaginationDesignProps, "ref"> & React.RefAttributes<unknown>>;
45
34
 
46
35
  type LogoProps = {
47
36
  loggedIn?: boolean;
@@ -216,7 +205,8 @@ interface CountrySelectProps {
216
205
  label?: string;
217
206
  size?: "small" | "medium";
218
207
  disabled?: boolean;
219
- style?: React__default.CSSProperties;
208
+ /** Applied to the view wrapper and the edit-mode `Autocomplete` root. */
209
+ sx?: SxProps<Theme>;
220
210
  }
221
211
  declare const CountrySelect: React__default.FC<CountrySelectProps>;
222
212
 
package/dist/index.js CHANGED
@@ -2100,23 +2100,33 @@ var CountrySelect = ({
2100
2100
  label = "Country",
2101
2101
  size = "small",
2102
2102
  disabled = false,
2103
- style = {}
2103
+ sx
2104
2104
  }) => {
2105
2105
  const theme = (0, import_styles16.useTheme)();
2106
2106
  const classes = useStyles3();
2107
2107
  const [editMode, setEditMode] = (0, import_react9.useState)(false);
2108
+ const [listOpen, setListOpen] = (0, import_react9.useState)(false);
2108
2109
  const glassBackground = theme.palette.mode === "dark" ? "linear-gradient(160deg, rgba(31,41,55,0.78), rgba(17,24,39,0.68))" : "linear-gradient(160deg, rgba(255,255,255,0.9), rgba(245,249,255,0.72))";
2109
2110
  const handleBlur = () => {
2110
2111
  setTimeout(() => setEditMode(false), 15);
2111
2112
  };
2113
+ (0, import_react9.useEffect)(() => {
2114
+ if (!editMode) setListOpen(false);
2115
+ }, [editMode]);
2112
2116
  const selectedOption = COUNTRIES.find((country) => country.code === value);
2113
2117
  if (!editMode) {
2114
2118
  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
2115
- "div",
2119
+ import_material16.Box,
2116
2120
  {
2117
- onClick: () => !disabled && setEditMode(true),
2121
+ component: "div",
2122
+ onClick: () => {
2123
+ if (!disabled) {
2124
+ setEditMode(true);
2125
+ setListOpen(true);
2126
+ }
2127
+ },
2118
2128
  className: classes.defaultMode,
2119
- style,
2129
+ sx,
2120
2130
  children: [
2121
2131
  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_material16.FormLabel, { className: classes.formLabel, children: label }),
2122
2132
  /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
@@ -2156,14 +2166,20 @@ var CountrySelect = ({
2156
2166
  options: COUNTRIES,
2157
2167
  getOptionLabel: (option) => option.label,
2158
2168
  autoHighlight: true,
2169
+ open: listOpen,
2170
+ onOpen: () => setListOpen(true),
2171
+ onClose: () => setListOpen(false),
2159
2172
  openOnFocus: true,
2160
2173
  disableClearable: true,
2161
2174
  value: selectedOption != null ? selectedOption : void 0,
2162
2175
  onChange: (_, newValue) => {
2163
- if (newValue != null) onChange(newValue);
2176
+ if (newValue == null) return;
2177
+ onChange(newValue);
2178
+ setListOpen(false);
2179
+ setEditMode(false);
2164
2180
  },
2165
2181
  onBlur: handleBlur,
2166
- sx: style,
2182
+ sx,
2167
2183
  size,
2168
2184
  componentsProps: {
2169
2185
  paper: {
@@ -2207,6 +2223,7 @@ var CountrySelect = ({
2207
2223
  label,
2208
2224
  variant: "outlined",
2209
2225
  size,
2226
+ autoFocus: true,
2210
2227
  inputProps: {
2211
2228
  ...params.inputProps,
2212
2229
  autoComplete: "new-password"