@splunk/react-ui 4.27.0 → 4.28.1

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 (55) hide show
  1. package/Box.js +45 -44
  2. package/Button.js +1 -2
  3. package/ButtonSimple.js +145 -147
  4. package/CHANGELOG.md +36 -2
  5. package/CollapsiblePanel.js +60 -73
  6. package/JSONTree.js +1311 -629
  7. package/Markdown.js +521 -222
  8. package/Modal.js +11 -4
  9. package/Multiselect.js +844 -804
  10. package/Paginator.js +593 -271
  11. package/TabBar.js +487 -312
  12. package/Table.js +5 -3
  13. package/TextArea.js +368 -344
  14. package/Tree.js +607 -519
  15. package/package.json +2 -2
  16. package/types/src/Box/Box.d.ts +3 -2
  17. package/types/src/CollapsiblePanel/CollapsiblePanel.d.ts +5 -4
  18. package/types/src/CollapsiblePanel/SingleOpenPanelGroup.d.ts +4 -4
  19. package/types/src/File/docs/examples/FullScreen.d.ts +1 -14
  20. package/types/src/JSONTree/JSONTreeItem.d.ts +45 -0
  21. package/types/src/JSONTree/renderTreeItems.d.ts +17 -0
  22. package/types/src/Markdown/renderers/MarkdownAnchorHeading.d.ts +1 -1
  23. package/types/src/Markdown/renderers/MarkdownBlockquote.d.ts +1 -1
  24. package/types/src/Markdown/renderers/MarkdownCode.d.ts +1 -1
  25. package/types/src/Markdown/renderers/MarkdownCodeBlock.d.ts +1 -1
  26. package/types/src/Markdown/renderers/MarkdownHeading.d.ts +1 -1
  27. package/types/src/Markdown/renderers/MarkdownImage.d.ts +1 -1
  28. package/types/src/Markdown/renderers/MarkdownItem.d.ts +1 -1
  29. package/types/src/Markdown/renderers/MarkdownList.d.ts +1 -1
  30. package/types/src/Markdown/renderers/MarkdownParagraph.d.ts +1 -1
  31. package/types/src/Modal/Modal.d.ts +4 -5
  32. package/types/src/Multiselect/Normal.d.ts +1 -0
  33. package/types/src/Paginator/Button.d.ts +8 -3
  34. package/types/src/Paginator/Compact.d.ts +50 -0
  35. package/types/src/Paginator/PageControl.d.ts +37 -0
  36. package/types/src/Paginator/PageSelect.d.ts +32 -0
  37. package/types/src/Paginator/Paginator.d.ts +9 -4
  38. package/types/src/Paginator/docs/examples/Compact.d.ts +2 -0
  39. package/types/src/Paginator/docs/examples/CompactCustomLabel.d.ts +2 -0
  40. package/types/src/Paginator/docs/examples/CompactWithLabel.d.ts +2 -0
  41. package/types/src/Paginator/docs/examples/Labelled.d.ts +2 -0
  42. package/types/src/Paginator/docs/examples/PageControl.d.ts +2 -0
  43. package/types/src/Paginator/icons/ChevronLeft.d.ts +5 -0
  44. package/types/src/Paginator/icons/ChevronRight.d.ts +5 -0
  45. package/types/src/SlidingPanels/docs/examples/Modal.d.ts +1 -13
  46. package/types/src/TabBar/Tab.d.ts +12 -2
  47. package/types/src/TabBar/TabBar.d.ts +4 -3
  48. package/types/src/TabBar/TabBarContext.d.ts +6 -1
  49. package/types/src/TextArea/TextArea.d.ts +3 -2
  50. package/types/src/TextArea/icons/ClearButton.d.ts +3 -0
  51. package/types/src/TextArea/icons/SearchIcon.d.ts +1 -0
  52. package/types/src/Tree/TreeContext.d.ts +2 -1
  53. package/types/src/Tree/TreeItem.d.ts +18 -5
  54. package/types/src/JSONTree/JSONTreeContext.d.ts +0 -7
  55. package/types/src/JSONTree/TreeNode.d.ts +0 -44
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@splunk/react-ui",
3
- "version": "4.27.0",
3
+ "version": "4.28.1",
4
4
  "description": "Library of React components that implement the Splunk design language",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Splunk Inc.",
@@ -43,7 +43,7 @@
43
43
  "@dnd-kit/sortable": "7.0.2",
44
44
  "@dnd-kit/utilities": "3.2.1",
45
45
  "@splunk/react-icons": "^4.3.0",
46
- "@splunk/themes": "^0.16.4",
46
+ "@splunk/themes": "^0.17.0",
47
47
  "@splunk/ui-utils": "^1.6.0",
48
48
  "commonmark": "^0.30.0",
49
49
  "commonmark-react-renderer": "^4.3.2",
@@ -6,7 +6,8 @@ interface BoxPropsBase {
6
6
  /**
7
7
  * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
8
8
  */
9
- elementRef?: React.Ref<HTMLDivElement>;
9
+ elementRef?: React.Ref<HTMLElement>;
10
+ tag?: keyof JSX.IntrinsicElements;
10
11
  flex?: boolean;
11
12
  inline?: boolean;
12
13
  }
@@ -14,7 +15,7 @@ declare type BoxProps = ComponentProps<BoxPropsBase, 'div'>;
14
15
  /**
15
16
  * Box is a utility component to normalize and abstract common layout styles.
16
17
  */
17
- declare function Box({ children, elementRef, flex, inline, ...otherProps }: BoxProps): JSX.Element;
18
+ declare function Box({ children, elementRef, flex, tag, inline, ...otherProps }: BoxProps): JSX.Element;
18
19
  declare namespace Box {
19
20
  var propTypes: {
20
21
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -16,6 +16,7 @@ declare type CollapsiblePanelRequestOpenHandler = (data: {
16
16
  }) => void;
17
17
  /** @public */
18
18
  declare type CollapsiblePanelChangeHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
19
+ action: 'open' | 'close';
19
20
  panelId?: string | number;
20
21
  reason: 'toggleClick';
21
22
  }) => void;
@@ -66,9 +67,8 @@ interface CollapsiblePanelPropsBase {
66
67
  */
67
68
  onRequestOpen?: CollapsiblePanelRequestOpenHandler;
68
69
  /**
69
- * Invoked on a change of the open panel. Callback is passed data, such as
70
- * the `panelId` of the `CollapsiblePanel` that originated the expand request.
71
- * `panelId` is `undefined` when the open panel is collapsed.
70
+ * Invoked on a change of the open panel.
71
+ * Callback is passed the `panelId` of the `CollapsiblePanel` that originated the expand request and the `action` ("open" or "close")
72
72
  */
73
73
  onChange?: CollapsiblePanelChangeHandler;
74
74
  /**
@@ -102,7 +102,7 @@ interface CollapsiblePanelDeprecatedControlledProps extends CollapsiblePanelProp
102
102
  defaultOpen?: never;
103
103
  onRequestOpen?: CollapsiblePanelRequestOpenHandler;
104
104
  onRequestClose?: CollapsiblePanelRequestCloseHandler;
105
- onChange: never;
105
+ onChange?: never;
106
106
  open?: boolean;
107
107
  }
108
108
  interface CollapsiblePanelControlledProps extends CollapsiblePanelPropsBase {
@@ -133,6 +133,7 @@ declare class CollapsiblePanel extends Component<CollapsiblePanelProps, Collapsi
133
133
  constructor(props: Readonly<CollapsiblePanelProps>);
134
134
  componentDidMount(): void;
135
135
  componentDidUpdate(prevProps: Readonly<CollapsiblePanelProps>): void;
136
+ private isOpen;
136
137
  private handleRequestClose;
137
138
  private handleRequestOpen;
138
139
  private handleChange;
@@ -3,7 +3,8 @@ import PropTypes from 'prop-types';
3
3
  import { ComponentProps } from '../utils/types';
4
4
  /** @public */
5
5
  declare type SingleOpenPanelGroupChangeHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
6
- openPanelId?: string | number | null;
6
+ action: 'open' | 'close';
7
+ panelId?: string | number;
7
8
  reason: 'toggleClick';
8
9
  }) => void;
9
10
  interface SingleOpenPanelGroupPropsBase {
@@ -26,9 +27,8 @@ interface SingleOpenPanelGroupPropsBase {
26
27
  */
27
28
  inset?: boolean;
28
29
  /**
29
- * Invoked on a change of the open panel. Callback is passed data, such as
30
- * the `panelId` of the `CollapsiblePanel` that originated the expand request.
31
- * `panelId` is `undefined` when the open panel is collapsed.
30
+ * Invoked on a change of the open panel.
31
+ * Callback is passed the `panelId` of the `CollapsiblePanel` that originated the expand request and the `action` ("open" or "close")
32
32
  */
33
33
  onChange?: SingleOpenPanelGroupChangeHandler;
34
34
  /**
@@ -1,15 +1,2 @@
1
- import { Component } from 'react';
2
- import { FileRequestAddHandler } from '@splunk/react-ui/File';
3
- declare class Fullscreen extends Component<{}, {
4
- filename?: string;
5
- open: boolean;
6
- }> {
7
- private fileReader;
8
- constructor(props: {});
9
- handleAddFiles: FileRequestAddHandler;
10
- handleRemoveFile: () => void;
11
- handleOpen: () => void;
12
- handleClose: () => void;
13
- render(): JSX.Element;
14
- }
1
+ declare function Fullscreen(): JSX.Element;
15
2
  export default Fullscreen;
@@ -0,0 +1,45 @@
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { JSONElement } from './JSONTree';
4
+ import { TreeItemPropsBase } from '../Tree';
5
+ import { ComponentProps } from '../utils/types';
6
+ declare type ExpandLinkHandler = (data: {
7
+ open: boolean;
8
+ withTooltip: boolean;
9
+ }) => {
10
+ expandLink: JSX.Element;
11
+ expandLinkRef: React.RefObject<HTMLButtonElement>;
12
+ };
13
+ interface JSONTreeItemPropsBase extends TreeItemPropsBase {
14
+ clickableKeyRef?: React.RefObject<HTMLButtonElement> | undefined;
15
+ clickableValRef?: React.RefObject<HTMLButtonElement> | undefined;
16
+ hasChildren?: boolean;
17
+ indentArray?: string[];
18
+ index: number;
19
+ initialOpenState: boolean;
20
+ properties?: string[];
21
+ propertyDataPath: string;
22
+ propertyElement?: JSX.Element | undefined;
23
+ renderExpandLink?: ExpandLinkHandler;
24
+ representation?: JSX.Element | JSX.Element[];
25
+ value?: JSONElement;
26
+ }
27
+ declare type JSONTreeItemProps = ComponentProps<JSONTreeItemPropsBase, 'li'>;
28
+ export declare function JSONTreeItem({ clickableKeyRef, clickableValRef, hasChildren, indentArray, index, initialOpenState, onFocus, properties, propertyDataPath, propertyElement, renderExpandLink, representation, value, ...otherProps }: JSONTreeItemProps): JSX.Element;
29
+ export declare namespace JSONTreeItem {
30
+ var propTypes: {
31
+ clickableKeyRef: PropTypes.Requireable<object>;
32
+ clickableValRef: PropTypes.Requireable<object>;
33
+ hasChildren: PropTypes.Requireable<boolean>;
34
+ indentArray: PropTypes.Requireable<(string | null | undefined)[]>;
35
+ index: PropTypes.Requireable<number>;
36
+ initialOpenState: PropTypes.Requireable<boolean>;
37
+ properties: PropTypes.Requireable<(string | null | undefined)[]>;
38
+ propertyDataPath: PropTypes.Requireable<string>;
39
+ propertyElement: PropTypes.Requireable<PropTypes.ReactNodeLike>;
40
+ renderExpandLink: PropTypes.Requireable<(...args: any[]) => any>;
41
+ representation: PropTypes.Requireable<PropTypes.ReactNodeLike>;
42
+ value: PropTypes.Requireable<string | number | boolean | object>;
43
+ };
44
+ }
45
+ export {};
@@ -0,0 +1,17 @@
1
+ import { JSONElement, JSONTreeClickKeyHandler, JSONTreeClickValueHandler } from './JSONTree';
2
+ declare type renderTreeItemsProps = {
3
+ defaultOpen?: boolean;
4
+ expandChildren?: boolean | 'withShiftModifier';
5
+ expandChildrenOnShiftKey?: boolean;
6
+ indent?: number;
7
+ indentLevel?: number;
8
+ obj: JSONElement;
9
+ onClickKey?: JSONTreeClickKeyHandler;
10
+ onClickValue?: JSONTreeClickValueHandler;
11
+ overflow?: 'wrap' | 'scroll';
12
+ path?: (string | number)[];
13
+ shift?: boolean;
14
+ updateShift: ((newShift: boolean) => void) | undefined;
15
+ };
16
+ export declare function renderTreeItems({ defaultOpen, expandChildren, expandChildrenOnShiftKey, indent, indentLevel, obj, onClickKey, onClickValue, overflow, path, shift, updateShift, }: renderTreeItemsProps): JSX.Element | JSX.Element[];
17
+ export {};
@@ -6,7 +6,7 @@ interface MarkdownAnchorHeadingPropsBase {
6
6
  level: 1 | 2 | 3 | 4 | 5 | 6;
7
7
  }
8
8
  declare type MarkdownAnchorHeadingProps = ComponentProps<MarkdownAnchorHeadingPropsBase, 'h1'>;
9
- declare function MarkdownAnchorHeading({ level, children }: MarkdownAnchorHeadingProps): JSX.Element;
9
+ declare function MarkdownAnchorHeading({ level, children, ...otherProps }: MarkdownAnchorHeadingProps): JSX.Element;
10
10
  declare namespace MarkdownAnchorHeading {
11
11
  var propTypes: {
12
12
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -5,7 +5,7 @@ interface MarkdownBlockquotePropsBase {
5
5
  children: React.ReactNode[];
6
6
  }
7
7
  declare type MarkdownBlockquoteProps = ComponentProps<MarkdownBlockquotePropsBase, 'blockquote'>;
8
- declare function MarkdownBlockquote({ children }: MarkdownBlockquoteProps): JSX.Element;
8
+ declare function MarkdownBlockquote({ children, ...otherProps }: MarkdownBlockquoteProps): JSX.Element;
9
9
  declare namespace MarkdownBlockquote {
10
10
  var propTypes: {
11
11
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -5,7 +5,7 @@ interface MarkdownCodePropsBase {
5
5
  literal: string;
6
6
  }
7
7
  declare type MarkdownCodeProps = ComponentProps<MarkdownCodePropsBase, 'code'>;
8
- declare function MarkdownCode({ literal }: MarkdownCodeProps): JSX.Element;
8
+ declare function MarkdownCode({ literal, ...otherProps }: MarkdownCodeProps): JSX.Element;
9
9
  declare namespace MarkdownCode {
10
10
  var propTypes: {
11
11
  literal: PropTypes.Requireable<string>;
@@ -5,7 +5,7 @@ interface MarkdownCodeBlockPropsBase {
5
5
  literal: string;
6
6
  }
7
7
  declare type MarkdownCodeBlockProps = ComponentProps<MarkdownCodeBlockPropsBase, 'div'>;
8
- declare function MarkdownCodeBlock({ literal, language }: MarkdownCodeBlockProps): JSX.Element;
8
+ declare function MarkdownCodeBlock({ literal, language, ...otherProps }: MarkdownCodeBlockProps): JSX.Element;
9
9
  declare namespace MarkdownCodeBlock {
10
10
  var propTypes: {
11
11
  literal: PropTypes.Requireable<string>;
@@ -6,7 +6,7 @@ interface MarkdownHeadingPropsBase {
6
6
  level: 1 | 2 | 3 | 4 | 5 | 6;
7
7
  }
8
8
  declare type MarkdownHeadingProps = ComponentProps<MarkdownHeadingPropsBase, 'h1'>;
9
- declare function MarkdownHeading({ level, children }: MarkdownHeadingProps): JSX.Element;
9
+ declare function MarkdownHeading({ level, children, ...otherProps }: MarkdownHeadingProps): JSX.Element;
10
10
  declare namespace MarkdownHeading {
11
11
  var propTypes: {
12
12
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -6,7 +6,7 @@ interface MarkdownImagePropsBase {
6
6
  title?: string;
7
7
  }
8
8
  declare type MarkdownImageProps = ComponentProps<MarkdownImagePropsBase, 'img'>;
9
- declare function MarkdownImage({ src, title, alt }: MarkdownImageProps): JSX.Element;
9
+ declare function MarkdownImage({ src, title, alt, ...otherProps }: MarkdownImageProps): JSX.Element;
10
10
  declare namespace MarkdownImage {
11
11
  var propTypes: {
12
12
  alt: PropTypes.Requireable<string>;
@@ -5,7 +5,7 @@ interface MarkdownItemPropsBase {
5
5
  children: React.ReactNode[];
6
6
  }
7
7
  declare type MarkdownItemProps = ComponentProps<MarkdownItemPropsBase, 'li'>;
8
- declare function MarkdownItem({ children }: MarkdownItemProps): JSX.Element;
8
+ declare function MarkdownItem({ children, ...otherProps }: MarkdownItemProps): JSX.Element;
9
9
  declare namespace MarkdownItem {
10
10
  var propTypes: {
11
11
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -18,7 +18,7 @@ interface MarkdownListUnorderedPropsBase extends MarkdownListPropsBase {
18
18
  declare type MarkdownListOrderedProps = ComponentProps<MarkdownListOrderedPropsBase, 'ol'>;
19
19
  declare type MarkdownListUnorderedProps = ComponentProps<MarkdownListUnorderedPropsBase, 'ul'>;
20
20
  declare type MarkdownListProps = MarkdownListOrderedProps | MarkdownListUnorderedProps;
21
- declare function MarkdownList({ children, type }: MarkdownListProps): JSX.Element;
21
+ declare function MarkdownList({ children, type, ...otherProps }: MarkdownListProps): JSX.Element;
22
22
  declare namespace MarkdownList {
23
23
  var propTypes: {
24
24
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -5,7 +5,7 @@ interface MarkdownParagraphPropsBase {
5
5
  children: React.ReactNode[];
6
6
  }
7
7
  declare type MarkdownParagraphProps = ComponentProps<MarkdownParagraphPropsBase, 'p'>;
8
- declare function MarkdownParagraph({ children }: MarkdownParagraphProps): JSX.Element;
8
+ declare function MarkdownParagraph({ children, ...otherProps }: MarkdownParagraphProps): JSX.Element;
9
9
  declare namespace MarkdownParagraph {
10
10
  var propTypes: {
11
11
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -37,8 +37,6 @@ interface ModalPropsBase {
37
37
  * and a reason, which is either 'escapeKey' or 'clickAway'.
38
38
  *
39
39
  * Generally, use this callback to toggle the `open` prop.
40
- *
41
- * This callback must return focus to the invoking element or other element that follows the logical flow of the application.
42
40
  */
43
41
  onRequestClose?: ModalRequestCloseHandler;
44
42
  /**
@@ -46,12 +44,13 @@ interface ModalPropsBase {
46
44
  */
47
45
  open?: boolean;
48
46
  /**
49
- * Ref of the invoking element (or other element that follows the logical flow of the application) to be focused after the `Modal` is closed.
50
- * If you are not using this prop, then you *must* manually return focus to the invoking element in `onRequestClose`.
47
+ * Pass the ref of the invoking element (or other element that follows the logical flow of the application) to automatically move focus
48
+ * to the invoking element on `Modal` close. If using a ref is not possible, you *must* pass a function that sets focus to the appropriate element.
49
+ * This function will be called after `onRequestClose`.
51
50
  */
52
51
  returnFocus?: React.MutableRefObject<(React.Component & {
53
52
  focus: () => void;
54
- }) | HTMLElement | null>;
53
+ }) | HTMLElement | null> | (() => void);
55
54
  }
56
55
  declare const defaultProps: Required<Pick<ModalPropsBase, 'initialFocus' | 'open' | 'divider'>>;
57
56
  declare type ModalProps = ClassComponentProps<ModalPropsBase, typeof defaultProps, 'div'>;
@@ -176,6 +176,7 @@ declare class Normal extends Component<NormalProps, NormalState> {
176
176
  private removeValue;
177
177
  private renderButtons;
178
178
  private renderMenu;
179
+ private getSelectedItemsContent;
179
180
  render(): JSX.Element;
180
181
  }
181
182
  export default Normal;
@@ -1,10 +1,14 @@
1
1
  import React, { Component } from 'react';
2
- import { PaginatorChangeHandler } from './Paginator';
3
2
  import { ClassComponentProps } from '../utils/types';
4
- declare type PaginatorButtonClickHandler = PaginatorChangeHandler;
3
+ declare type PaginatorButtonClickHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
4
+ page?: number;
5
+ }) => void;
5
6
  interface PaginatorButtonPropsBase {
6
7
  children?: React.ReactNode;
7
- label?: React.ReactNode;
8
+ /** Prevents user from clicking the button. If set to `dimmed`, the button
9
+ * does not respond to mouse events but can still receive focus, and
10
+ * `aria-disabled` is set to `true`. */
11
+ disabled?: boolean | 'dimmed';
8
12
  /** Callback for button click event */
9
13
  onClick?: PaginatorButtonClickHandler;
10
14
  /** Index of page */
@@ -21,3 +25,4 @@ declare class PaginatorButton extends Component<PaginatorButtonProps, {}> {
21
25
  render(): JSX.Element;
22
26
  }
23
27
  export default PaginatorButton;
28
+ export { PaginatorButtonClickHandler };
@@ -0,0 +1,50 @@
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { ComponentProps } from '../utils/types';
4
+ /** @public */
5
+ declare type PaginatorCompactChangeHandler = (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLInputElement>, data: {
6
+ direction: 'prev' | 'next';
7
+ page?: number;
8
+ }) => void;
9
+ /** @public */
10
+ declare type PaginatorCompactRenderLabelCallback = (data: {
11
+ current?: number;
12
+ totalPages?: number;
13
+ }) => React.ReactNode;
14
+ interface PaginatorCompactPropsBase {
15
+ /**
16
+ * The current page number. If not provided, the component will not keep track of the page number and will not provide it in the callback.
17
+ */
18
+ current?: number;
19
+ /**
20
+ * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
21
+ */
22
+ elementRef?: React.Ref<HTMLElement>;
23
+ /**
24
+ * Callback to handle page change.
25
+ */
26
+ onChange?: PaginatorCompactChangeHandler;
27
+ /**
28
+ * If true, renders the a label for the current and total pages.
29
+ * Can be passed a function to render a custom label that receives an object with current and totalPages as an argument.
30
+ */
31
+ renderLabel?: boolean | PaginatorCompactRenderLabelCallback;
32
+ /**
33
+ * The total number of pages.
34
+ * If not provided, the component will operate in indeterminate mode and will not prevent the current page number from exceeding any values.
35
+ */
36
+ totalPages?: number;
37
+ }
38
+ declare type PageButtonProps = ComponentProps<PaginatorCompactPropsBase, 'nav'>;
39
+ declare function Compact({ onChange, current, renderLabel, totalPages, ...otherProps }: PageButtonProps): JSX.Element;
40
+ declare namespace Compact {
41
+ var propTypes: {
42
+ current: PropTypes.Requireable<number>;
43
+ elementRef: PropTypes.Requireable<object>;
44
+ onChange: PropTypes.Requireable<(...args: any[]) => any>;
45
+ renderLabel: PropTypes.Requireable<boolean | ((...args: any[]) => any)>;
46
+ totalPages: PropTypes.Requireable<number>;
47
+ };
48
+ }
49
+ export default Compact;
50
+ export type { PaginatorCompactChangeHandler, PaginatorCompactRenderLabelCallback };
@@ -0,0 +1,37 @@
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { ComponentProps } from '../utils/types';
4
+ /** @public */
5
+ declare type PaginatorPageControlChangeHandler = (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLInputElement>, data: {
6
+ page: number;
7
+ }) => void;
8
+ interface PaginatorPageControlPropsBase {
9
+ /**
10
+ * Currently selected page.
11
+ */
12
+ current?: number;
13
+ /**
14
+ * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
15
+ */
16
+ elementRef?: React.Ref<HTMLElement>;
17
+ /**
18
+ * Callback to handle page change.
19
+ */
20
+ onChange?: PaginatorPageControlChangeHandler;
21
+ /**
22
+ * The total number of pages.
23
+ */
24
+ totalPages: number;
25
+ }
26
+ declare type PageControlProps = ComponentProps<PaginatorPageControlPropsBase, 'nav'>;
27
+ declare function PageControl({ onChange, current, totalPages, ...otherProps }: PageControlProps): JSX.Element;
28
+ declare namespace PageControl {
29
+ var propTypes: {
30
+ elementRef: PropTypes.Requireable<object>;
31
+ onChange: PropTypes.Requireable<(...args: any[]) => any>;
32
+ current: PropTypes.Requireable<number>;
33
+ totalPages: PropTypes.Requireable<number>;
34
+ };
35
+ }
36
+ export default PageControl;
37
+ export type { PaginatorPageControlChangeHandler };
@@ -0,0 +1,32 @@
1
+ import React from 'react';
2
+ import PropTypes from 'prop-types';
3
+ import { ComponentProps } from '../utils/types';
4
+ /** @public */
5
+ declare type PaginatorPageSelectChangeHandler = (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLInputElement>, data: {
6
+ page: number;
7
+ }) => void;
8
+ interface PaginatorPageSelectPropsBase {
9
+ /**
10
+ * Currently selected page.
11
+ */
12
+ current: number;
13
+ /**
14
+ * Callback to handle page change.
15
+ */
16
+ onChange?: PaginatorPageSelectChangeHandler;
17
+ /**
18
+ * The total number of pages.
19
+ */
20
+ totalPages: number;
21
+ }
22
+ declare type PageControlProps = ComponentProps<PaginatorPageSelectPropsBase, 'div'>;
23
+ declare function PageSelect({ onChange, current, totalPages, ...otherProps }: PageControlProps): JSX.Element;
24
+ declare namespace PageSelect {
25
+ var propTypes: {
26
+ onChange: PropTypes.Requireable<(...args: any[]) => any>;
27
+ current: PropTypes.Requireable<number>;
28
+ totalPages: PropTypes.Requireable<number>;
29
+ };
30
+ }
31
+ export default PageSelect;
32
+ export type { PaginatorPageSelectChangeHandler };
@@ -1,5 +1,7 @@
1
1
  import React from 'react';
2
2
  import PropTypes from 'prop-types';
3
+ import Compact, { PaginatorCompactChangeHandler } from './Compact';
4
+ import PageControl, { PaginatorPageControlChangeHandler } from './PageControl';
3
5
  import { ComponentProps } from '../utils/types';
4
6
  /** @public */
5
7
  declare type PaginatorChangeHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
@@ -13,19 +15,21 @@ interface PaginatorPropsBase {
13
15
  /**
14
16
  * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
15
17
  */
16
- elementRef?: React.Ref<HTMLDivElement>;
18
+ elementRef?: React.Ref<HTMLElement>;
17
19
  /**
18
20
  * Number of pages to display. If greater than `totalPages`, `totalPages` is used instead.
19
21
  */
20
22
  numPageLinks?: number;
21
23
  /** Callback to handle page change. */
22
24
  onChange?: PaginatorChangeHandler;
23
- /** Total number of pages in collection. This can change as collection populates. */
25
+ /** The total number of pages. */
24
26
  totalPages: number;
25
27
  }
26
- declare type PaginatorProps = ComponentProps<PaginatorPropsBase, 'div'>;
28
+ declare type PaginatorProps = ComponentProps<PaginatorPropsBase, 'nav'>;
27
29
  declare function Paginator({ onChange, current, alwaysShowLastPageLink, numPageLinks, totalPages, ...otherProps }: PaginatorProps): JSX.Element | null;
28
30
  declare namespace Paginator {
31
+ var Compact: typeof import("./Compact").default;
32
+ var PageControl: typeof import("./PageControl").default;
29
33
  var propTypes: {
30
34
  alwaysShowLastPageLink: PropTypes.Requireable<boolean>;
31
35
  current: PropTypes.Requireable<number>;
@@ -36,4 +40,5 @@ declare namespace Paginator {
36
40
  };
37
41
  }
38
42
  export default Paginator;
39
- export type { PaginatorChangeHandler };
43
+ export { Compact, PageControl };
44
+ export type { PaginatorCompactChangeHandler, PaginatorChangeHandler, PaginatorPageControlChangeHandler, };
@@ -0,0 +1,2 @@
1
+ declare function Compact(): JSX.Element;
2
+ export default Compact;
@@ -0,0 +1,2 @@
1
+ declare function CompactCustomLabel(): JSX.Element;
2
+ export default CompactCustomLabel;
@@ -0,0 +1,2 @@
1
+ declare function CompactWithLabel(): JSX.Element;
2
+ export default CompactWithLabel;
@@ -0,0 +1,2 @@
1
+ declare function Labelled(): JSX.Element;
2
+ export default Labelled;
@@ -0,0 +1,2 @@
1
+ declare function PageControl(): JSX.Element;
2
+ export default PageControl;
@@ -0,0 +1,5 @@
1
+ interface ChevronLeftProps {
2
+ className?: string;
3
+ }
4
+ declare function ChevronLeft({ className }: ChevronLeftProps): JSX.Element;
5
+ export default ChevronLeft;
@@ -0,0 +1,5 @@
1
+ interface ChevronRightProps {
2
+ className?: string;
3
+ }
4
+ declare function ChevronRight({ className }: ChevronRightProps): JSX.Element;
5
+ export default ChevronRight;
@@ -1,14 +1,2 @@
1
- import { Component } from 'react';
2
- declare class ModalExample extends Component<{}, {
3
- activePanelId: string;
4
- modalOpen: boolean;
5
- transition: 'forward' | 'backward';
6
- }> {
7
- constructor(props: {});
8
- goBack: () => void;
9
- goForward: () => void;
10
- open: () => void;
11
- close: () => void;
12
- render(): JSX.Element;
13
- }
1
+ declare function ModalExample(): JSX.Element;
14
2
  export default ModalExample;