@splunk/react-ui 4.24.0 → 4.26.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Breadcrumbs.js +65 -42
- package/Button.js +8 -7
- package/ButtonSimple.js +40 -39
- package/CHANGELOG.md +30 -1
- package/Code.js +193 -100
- package/Color.js +18 -15
- package/JSONTree.js +1 -1
- package/MIGRATION.mdx +48 -0
- package/Modal.js +69 -58
- package/RadioList.js +12 -11
- package/Table.js +2330 -2543
- package/TextArea.js +298 -302
- package/cypress/README.md +11 -0
- package/cypress/support/commands.ts +1 -0
- package/cypress/support/component.ts +0 -1
- package/cypress/tsconfig.cypress.json +14 -0
- package/package.json +13 -13
- package/types/src/Breadcrumbs/Breadcrumbs.d.ts +18 -2
- package/types/src/Breadcrumbs/Item.d.ts +7 -1
- package/types/src/Breadcrumbs/docs/examples/CustomizedClick.d.ts +2 -0
- package/types/src/Button/Button.d.ts +4 -2
- package/types/src/Button/docs/examples/Block.d.ts +2 -2
- package/types/src/Button/docs/examples/Dimmed.d.ts +2 -0
- package/types/src/Button/docs/examples/Disabled.d.ts +2 -2
- package/types/src/Button/docs/examples/Icons.d.ts +2 -2
- package/types/src/Button/docs/examples/Menus.d.ts +2 -2
- package/types/src/Button/docs/examples/To.d.ts +2 -2
- package/types/src/Button/docs/examples/Truncated.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/Basic.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/Block.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/Dimmed.d.ts +2 -0
- package/types/src/Button/docs/examples/prisma/Disabled.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/Menus.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/To.d.ts +2 -2
- package/types/src/Button/docs/examples/prisma/Truncated.d.ts +2 -2
- package/types/src/ButtonSimple/ButtonSimple.d.ts +4 -2
- package/types/src/Color/Color.d.ts +5 -3
- package/types/src/JSONTree/JSONTree.d.ts +1 -1
- package/types/src/Modal/Header.d.ts +6 -7
- package/types/src/Modal/Modal.d.ts +10 -2
- package/types/src/Modal/ModalContext.d.ts +1 -0
- package/types/src/RadioList/RadioList.d.ts +27 -27
- package/types/src/RadioList/RadioListContext.d.ts +5 -4
- package/types/src/Table/Body.d.ts +26 -22
- package/types/src/Table/Row.d.ts +47 -16
- package/types/src/Table/RowDragCell.d.ts +23 -42
- package/types/src/Table/Table.d.ts +28 -78
- package/types/src/TextArea/TextArea.d.ts +1 -0
- package/types/unit-test-setup-testing-library.d.ts +1 -0
- package/types/src/Modal/docs/examples/prisma/TypicalUsage.d.ts +0 -2
|
@@ -58,7 +58,7 @@ interface JSONTreePropsBase {
|
|
|
58
58
|
*/
|
|
59
59
|
overflow?: 'wrap' | 'scroll';
|
|
60
60
|
/**
|
|
61
|
-
* If set to `true`, using `shift + click` or `shift + enter` will expand
|
|
61
|
+
* If set to `true`, using `shift + click` or `shift + enter` will expand all descendant nodes
|
|
62
62
|
* of the tree at once. A tooltip is added to the expand all / collapse all button to indicate that this feature
|
|
63
63
|
* is enabled.
|
|
64
64
|
*/
|
|
@@ -7,11 +7,16 @@ interface HeaderPropsBase {
|
|
|
7
7
|
* rendered if a title is provided.
|
|
8
8
|
*/
|
|
9
9
|
children?: React.ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* The icon to show before the title.
|
|
12
|
+
*/
|
|
13
|
+
icon?: React.ReactNode;
|
|
10
14
|
/**
|
|
11
15
|
* If an `onRequestClose` function is provided, the header includes a close
|
|
12
16
|
* button, which invokes the `onRequestClose` callback when clicked.
|
|
13
17
|
*
|
|
14
|
-
*
|
|
18
|
+
* If `Modal`'s `returnFocus` prop isn't used, this callback *must* return focus to the invoking element
|
|
19
|
+
* or other element that follows the logical flow of the application.
|
|
15
20
|
*/
|
|
16
21
|
onRequestClose?: React.MouseEventHandler<HTMLButtonElement>;
|
|
17
22
|
/**
|
|
@@ -20,14 +25,8 @@ interface HeaderPropsBase {
|
|
|
20
25
|
title?: string;
|
|
21
26
|
/**
|
|
22
27
|
* Used as the subheading. Only shown if `title` is also present.
|
|
23
|
-
* @includeTheme prisma
|
|
24
28
|
*/
|
|
25
29
|
subtitle?: React.ReactNode;
|
|
26
|
-
/**
|
|
27
|
-
* The icon to show before the title.
|
|
28
|
-
* @includeTheme prisma
|
|
29
|
-
*/
|
|
30
|
-
icon?: React.ReactNode;
|
|
31
30
|
}
|
|
32
31
|
declare type HeaderProps = ComponentProps<HeaderPropsBase, 'div'>;
|
|
33
32
|
/**
|
|
@@ -9,7 +9,7 @@ declare type ModalRequestCloseHandler = (data: {
|
|
|
9
9
|
reason: 'clickAway' | 'escapeKey';
|
|
10
10
|
}) => void;
|
|
11
11
|
declare type ModalInitialFocus = 'first' | 'container' | (React.Component & {
|
|
12
|
-
focus: () =>
|
|
12
|
+
focus: () => void;
|
|
13
13
|
}) | HTMLElement | null;
|
|
14
14
|
interface ModalPropsBase {
|
|
15
15
|
/**
|
|
@@ -45,6 +45,13 @@ interface ModalPropsBase {
|
|
|
45
45
|
* Set to `true` if the `Modal` is currently open. Otherwise, set to `false`.
|
|
46
46
|
*/
|
|
47
47
|
open?: boolean;
|
|
48
|
+
/**
|
|
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`.
|
|
51
|
+
*/
|
|
52
|
+
returnFocus?: React.MutableRefObject<(React.Component & {
|
|
53
|
+
focus: () => void;
|
|
54
|
+
}) | HTMLElement | null>;
|
|
48
55
|
}
|
|
49
56
|
declare const defaultProps: Required<Pick<ModalPropsBase, 'initialFocus' | 'open' | 'divider'>>;
|
|
50
57
|
declare type ModalProps = ClassComponentProps<ModalPropsBase, typeof defaultProps, 'div'>;
|
|
@@ -53,6 +60,7 @@ declare class Modal extends Component<ModalProps> {
|
|
|
53
60
|
private initialFocusTimeoutId;
|
|
54
61
|
private initialFocus;
|
|
55
62
|
private headerTitleId;
|
|
63
|
+
private headerSubtitleId;
|
|
56
64
|
static propTypes: React.WeakValidationMap<ClassComponentProps<ModalPropsBase, Required<Pick<ModalPropsBase, "open" | "divider" | "initialFocus">>, "div", never>>;
|
|
57
65
|
static defaultProps: Required<Pick<ModalPropsBase, "open" | "divider" | "initialFocus">>;
|
|
58
66
|
static Header: typeof Header;
|
|
@@ -63,7 +71,7 @@ declare class Modal extends Component<ModalProps> {
|
|
|
63
71
|
componentDidUpdate(prevProps: ModalProps): void;
|
|
64
72
|
private getDefaultMotionStyle;
|
|
65
73
|
private getMotionStyle;
|
|
66
|
-
private
|
|
74
|
+
private handleFocus;
|
|
67
75
|
private handleModalMount;
|
|
68
76
|
private handleModalKeyDown;
|
|
69
77
|
private handleRequestClose;
|
|
@@ -13,47 +13,47 @@ interface RadioListPropsBase {
|
|
|
13
13
|
* `children` should be `RadioList.Option`s.
|
|
14
14
|
*/
|
|
15
15
|
children?: React.ReactNode;
|
|
16
|
-
disabled?: boolean;
|
|
17
|
-
/** The name is returned with onChange events, which can be used to identify the
|
|
18
|
-
* control when multiple controls share an onChange callback.
|
|
19
|
-
* A randomly generated name is used if one is not provided. */
|
|
20
|
-
name?: string;
|
|
21
|
-
/** Changes the layout of the RadioList. */
|
|
22
|
-
direction?: 'column' | 'row';
|
|
23
|
-
/**
|
|
24
|
-
* Highlight the field as having an error. The buttons and labels will turn red.
|
|
25
|
-
*/
|
|
26
|
-
error?: boolean;
|
|
27
|
-
/** The current selected value. Setting this value makes the property controlled. A
|
|
28
|
-
* callback is required.
|
|
29
|
-
*/
|
|
30
|
-
value?: RadioListValueTypes;
|
|
31
16
|
/**
|
|
32
17
|
* Set this property instead of value to make value uncontrolled.
|
|
33
18
|
*/
|
|
34
19
|
defaultValue?: RadioListValueTypes;
|
|
20
|
+
/**
|
|
21
|
+
* When placed in a ControlGroup, this is automatically set to the ControlGroup's help component.
|
|
22
|
+
* @private
|
|
23
|
+
*/
|
|
24
|
+
describedBy?: string;
|
|
25
|
+
/** Changes the layout of the RadioList. */
|
|
26
|
+
direction?: 'column' | 'row';
|
|
27
|
+
disabled?: boolean;
|
|
35
28
|
/**
|
|
36
29
|
* A React ref which is set to the DOM element when the component mounts and null when it unmounts.
|
|
37
30
|
*/
|
|
38
31
|
elementRef?: React.Ref<HTMLDivElement>;
|
|
39
32
|
/**
|
|
40
|
-
*
|
|
41
|
-
* If value is set, this callback is required. This must set the value prop to retain the
|
|
42
|
-
* change.
|
|
33
|
+
* Highlight the field as having an error. The buttons and labels will turn red.
|
|
43
34
|
*/
|
|
44
|
-
|
|
45
|
-
/** @private. */
|
|
46
|
-
required?: boolean;
|
|
35
|
+
error?: boolean;
|
|
47
36
|
/**
|
|
48
37
|
* When placed in a ControlGroup, this is automatically set to the ControlGroup's label.
|
|
49
38
|
* @private
|
|
50
39
|
*/
|
|
51
40
|
labelledBy?: string;
|
|
41
|
+
/** The name is returned with onChange events, which can be used to identify the
|
|
42
|
+
* control when multiple controls share an onChange callback.
|
|
43
|
+
* A randomly generated name is used if one is not provided. */
|
|
44
|
+
name?: string;
|
|
52
45
|
/**
|
|
53
|
-
*
|
|
54
|
-
*
|
|
46
|
+
* A callback to receive the change events.
|
|
47
|
+
* If value is set, this callback is required. This must set the value prop to retain the
|
|
48
|
+
* change.
|
|
55
49
|
*/
|
|
56
|
-
|
|
50
|
+
onChange?: RadioListChangeHandler;
|
|
51
|
+
/** @private. */
|
|
52
|
+
required?: boolean;
|
|
53
|
+
/** The current selected value. Setting this value makes the property controlled. A
|
|
54
|
+
* callback is required.
|
|
55
|
+
*/
|
|
56
|
+
value?: RadioListValueTypes;
|
|
57
57
|
}
|
|
58
58
|
interface RadioListPropsBaseControlled extends RadioListPropsBase {
|
|
59
59
|
value: RadioListValueTypes;
|
|
@@ -69,19 +69,19 @@ declare type RadioListProps = ComponentProps<RadioListPropsBaseControlled | Radi
|
|
|
69
69
|
declare function RadioList({ children, defaultValue: defaultValueProp, describedBy, direction, disabled, error, labelledBy, name: nameProp, onChange, required, value: valueProp, ...otherProps }: RadioListProps): JSX.Element;
|
|
70
70
|
declare namespace RadioList {
|
|
71
71
|
var propTypes: {
|
|
72
|
-
direction: PropTypes.Requireable<string>;
|
|
73
72
|
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
74
73
|
defaultValue: PropTypes.Requireable<any>;
|
|
74
|
+
describedBy: PropTypes.Requireable<string>;
|
|
75
|
+
direction: PropTypes.Requireable<string>;
|
|
75
76
|
disabled: PropTypes.Requireable<boolean>;
|
|
76
77
|
elementRef: PropTypes.Requireable<object>;
|
|
77
78
|
error: PropTypes.Requireable<boolean>;
|
|
79
|
+
labelledBy: PropTypes.Requireable<string>;
|
|
78
80
|
name: PropTypes.Requireable<string>;
|
|
79
81
|
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
80
82
|
/** @private. */
|
|
81
83
|
required: PropTypes.Requireable<boolean>;
|
|
82
84
|
value: PropTypes.Requireable<any>;
|
|
83
|
-
labelledBy: PropTypes.Requireable<string>;
|
|
84
|
-
describedBy: PropTypes.Requireable<string>;
|
|
85
85
|
};
|
|
86
86
|
var Option: typeof import("./Option").default;
|
|
87
87
|
}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { RadioListChangeHandler, RadioListValueTypes } from './RadioList';
|
|
3
3
|
export interface RadioListContext {
|
|
4
|
-
value?: RadioListValueTypes;
|
|
5
|
-
onChange?: RadioListChangeHandler;
|
|
6
|
-
name?: string;
|
|
7
|
-
error?: boolean;
|
|
8
4
|
disabled?: boolean;
|
|
5
|
+
error?: boolean;
|
|
6
|
+
name?: string;
|
|
7
|
+
onChange?: RadioListChangeHandler;
|
|
8
|
+
required?: boolean;
|
|
9
|
+
value?: RadioListValueTypes;
|
|
9
10
|
}
|
|
10
11
|
export declare const RadioListContext: import("react").Context<RadioListContext>;
|
|
11
12
|
export default RadioListContext;
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import React, { Component } from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
2
3
|
import { RowRequestMoveRowHandler } from './Row';
|
|
3
4
|
import { ClassComponentProps } from '../utils/types';
|
|
4
5
|
declare type BodyRequestMoveRowHandler = RowRequestMoveRowHandler;
|
|
5
6
|
interface BodyPropsBase {
|
|
6
7
|
/** @private. Generally passed by Table rather than added directly. */
|
|
7
8
|
actions?: boolean;
|
|
9
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
10
|
+
activeElementId?: string;
|
|
8
11
|
/**
|
|
9
12
|
* Must be `Table.Row`.
|
|
10
13
|
*/
|
|
@@ -26,13 +29,28 @@ interface BodyPropsBase {
|
|
|
26
29
|
}
|
|
27
30
|
declare const defaultProps: Required<Pick<BodyPropsBase, 'actions' | 'rowExpansion' | 'stripeRows'>>;
|
|
28
31
|
declare type BodyProps = ClassComponentProps<BodyPropsBase, typeof defaultProps, 'tbody'>;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
declare function BodyBase({ activeElementId, actions, children, elementRef, movableColumns, onRequestMoveRow, rowExpansion, primaryColumnIndex, stripeRows, ...otherProps }: BodyProps): JSX.Element | null;
|
|
33
|
+
declare namespace BodyBase {
|
|
34
|
+
var propTypes: {
|
|
35
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
36
|
+
actions: PropTypes.Requireable<boolean>;
|
|
37
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
38
|
+
activeElementId: PropTypes.Requireable<string>;
|
|
39
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
40
|
+
elementRef: PropTypes.Requireable<object>;
|
|
41
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
42
|
+
movableColumns: PropTypes.Requireable<boolean>;
|
|
43
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
44
|
+
rowExpansion: PropTypes.Requireable<string>;
|
|
45
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
46
|
+
onRequestMoveRow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
47
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
48
|
+
primaryColumnIndex: PropTypes.Requireable<number>;
|
|
49
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
50
|
+
stripeRows: PropTypes.Requireable<boolean>;
|
|
51
|
+
};
|
|
34
52
|
}
|
|
35
|
-
declare class Body extends Component<BodyProps,
|
|
53
|
+
declare class Body extends Component<BodyProps, {}> {
|
|
36
54
|
private el;
|
|
37
55
|
private rect?;
|
|
38
56
|
private rowHeight?;
|
|
@@ -40,21 +58,7 @@ declare class Body extends Component<BodyProps, BodyState> {
|
|
|
40
58
|
static splunkUiType: string;
|
|
41
59
|
static propTypes: React.WeakValidationMap<ClassComponentProps<BodyPropsBase, Required<Pick<BodyPropsBase, "actions" | "rowExpansion" | "stripeRows">>, "tbody", never>>;
|
|
42
60
|
static defaultProps: Required<Pick<BodyPropsBase, "actions" | "rowExpansion" | "stripeRows">>;
|
|
43
|
-
|
|
44
|
-
componentWillUnmount(): void;
|
|
45
|
-
private handleDragStart;
|
|
46
|
-
private handleDragOver;
|
|
47
|
-
private handleDragEnter;
|
|
48
|
-
private handleDrop;
|
|
49
|
-
private handleDragEnd;
|
|
50
|
-
private onRequestMoveRow;
|
|
51
|
-
private handleMount;
|
|
52
|
-
private handleRowExpansion;
|
|
53
|
-
private calculateGuideIndex;
|
|
54
|
-
private updateDragPositionImpl;
|
|
55
|
-
private updateDragPosition;
|
|
56
|
-
private updateScrollPosition;
|
|
57
|
-
private cleanupDrag;
|
|
58
|
-
render(): JSX.Element | null;
|
|
61
|
+
render(): JSX.Element;
|
|
59
62
|
}
|
|
60
63
|
export default Body;
|
|
64
|
+
export { BodyBase };
|
package/types/src/Table/Row.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import React, { Component } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import { DragStartEvent } from '@dnd-kit/core';
|
|
4
|
+
import { TableRequestMoveRowHandler } from './Table';
|
|
3
5
|
import { ClassComponentProps } from '../utils/types';
|
|
4
6
|
/** @public */
|
|
5
7
|
declare type RowActionPrimaryClickHandler = (event: React.MouseEvent, data?: any) => void;
|
|
@@ -7,9 +9,9 @@ declare type RowActionPrimaryClickHandler = (event: React.MouseEvent, data?: any
|
|
|
7
9
|
declare type RowActionSecondaryClickHandler = (event: React.MouseEvent, data?: any) => void;
|
|
8
10
|
/** @public */
|
|
9
11
|
declare type RowClickHandler = (event: React.MouseEvent<HTMLTableRowElement> | React.KeyboardEvent<HTMLTableRowElement>, data?: any) => void;
|
|
10
|
-
declare type RowDragStartHandler =
|
|
12
|
+
declare type RowDragStartHandler = (event: DragStartEvent) => void;
|
|
13
|
+
declare type RowRequestMoveRowHandler = TableRequestMoveRowHandler;
|
|
11
14
|
declare type RowExpansionHandler = (event: React.MouseEvent<HTMLTableCellElement> | React.KeyboardEvent<HTMLTableCellElement>, data?: any) => void;
|
|
12
|
-
declare type RowRequestMoveRowHandler = RowDragCellRequestMoveRowHandler;
|
|
13
15
|
/** @public */
|
|
14
16
|
declare type RowRequestToggleHandler = (event: React.MouseEvent<HTMLTableCellElement> | React.KeyboardEvent<HTMLTableCellElement>, data?: any) => void;
|
|
15
17
|
interface RowPropsBase {
|
|
@@ -61,8 +63,6 @@ interface RowPropsBase {
|
|
|
61
63
|
movableColumns?: boolean;
|
|
62
64
|
/** Providing an `onClick` handler enables focus, hover, and related styles. */
|
|
63
65
|
onClick?: RowClickHandler;
|
|
64
|
-
/** @private. Generally passed by `Table` rather than added directly. */
|
|
65
|
-
onDragStart?: RowDragStartHandler;
|
|
66
66
|
/**
|
|
67
67
|
* An event handler that triggers when the row expansion element is selected.
|
|
68
68
|
*/
|
|
@@ -88,26 +88,57 @@ interface RowPropsBase {
|
|
|
88
88
|
* of the toggle.
|
|
89
89
|
*/
|
|
90
90
|
selected?: boolean;
|
|
91
|
-
/** @private. Generally passed by `Table` rather than added directly. */
|
|
92
|
-
showRowGuideline?: 'none' | 'before' | 'after';
|
|
93
91
|
/** @private. */
|
|
94
92
|
stripe?: 'odd' | 'even' | 'none';
|
|
95
93
|
}
|
|
96
94
|
declare const defaultProps: Required<Pick<RowPropsBase, 'stripe' | 'primaryColumnIndex'>>;
|
|
97
95
|
declare type RowProps = ClassComponentProps<RowPropsBase, typeof defaultProps, 'tr'>;
|
|
96
|
+
declare function RowBase(props: RowProps): JSX.Element;
|
|
97
|
+
declare namespace RowBase {
|
|
98
|
+
var propTypes: {
|
|
99
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
100
|
+
activeElementId: PropTypes.Requireable<string>;
|
|
101
|
+
actionPrimary: PropTypes.Requireable<PropTypes.ReactElementLike>;
|
|
102
|
+
actionsSecondary: PropTypes.Requireable<PropTypes.ReactElementLike>;
|
|
103
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
104
|
+
data: PropTypes.Requireable<any>;
|
|
105
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
106
|
+
dataId: PropTypes.Requireable<React.ReactText>;
|
|
107
|
+
disabled: PropTypes.Requireable<boolean>;
|
|
108
|
+
/** @private. Generally passed by Table rather than added directly. */
|
|
109
|
+
draggable: PropTypes.Requireable<boolean>;
|
|
110
|
+
elementRef: PropTypes.Requireable<object>;
|
|
111
|
+
/** @private. */
|
|
112
|
+
expandable: PropTypes.Requireable<boolean>;
|
|
113
|
+
expanded: PropTypes.Requireable<boolean>;
|
|
114
|
+
expansionRow: PropTypes.Requireable<PropTypes.ReactElementLike | (PropTypes.ReactElementLike | null | undefined)[]>;
|
|
115
|
+
/** @private. Indicates whether the table has an actions column. */
|
|
116
|
+
actions: PropTypes.Requireable<boolean>;
|
|
117
|
+
/** @private. Generally passed by `Table` rather than added directly. */
|
|
118
|
+
index: PropTypes.Requireable<number>;
|
|
119
|
+
/** @private. Generally passed by `Table` rather than added directly. */
|
|
120
|
+
movableColumns: PropTypes.Requireable<boolean>;
|
|
121
|
+
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
122
|
+
onExpansion: PropTypes.Requireable<(...args: any[]) => any>;
|
|
123
|
+
/** @private. This is passed through and works as expected. */
|
|
124
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
125
|
+
/** @private. Generally passed by `Table` rather than added directly. */
|
|
126
|
+
onRequestMoveRow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
127
|
+
onRequestToggle: PropTypes.Requireable<(...args: any[]) => any>;
|
|
128
|
+
/** @private. Generally passed by `Table` rather than added directly. */
|
|
129
|
+
primaryColumnIndex: PropTypes.Requireable<number>;
|
|
130
|
+
rowScreenReaderText: PropTypes.Requireable<string>;
|
|
131
|
+
selected: PropTypes.Requireable<boolean>;
|
|
132
|
+
/** @private. */
|
|
133
|
+
stripe: PropTypes.Requireable<string>;
|
|
134
|
+
};
|
|
135
|
+
}
|
|
98
136
|
declare class Row extends Component<RowProps, {}> {
|
|
99
137
|
static splunkUiType: string;
|
|
100
138
|
static propTypes: React.WeakValidationMap<ClassComponentProps<RowPropsBase, Required<Pick<RowPropsBase, "stripe" | "primaryColumnIndex">>, "tr", never>>;
|
|
101
139
|
static defaultProps: Required<Pick<RowPropsBase, "stripe" | "primaryColumnIndex">>;
|
|
102
|
-
private elementRef;
|
|
103
|
-
private handleClick;
|
|
104
|
-
private handleKeyDown;
|
|
105
|
-
private handleToggle;
|
|
106
|
-
private handleExpansion;
|
|
107
|
-
private renderActionPrimary;
|
|
108
|
-
private renderActionsSecondary;
|
|
109
|
-
private handleMount;
|
|
110
140
|
render(): JSX.Element;
|
|
111
141
|
}
|
|
112
142
|
export default Row;
|
|
113
|
-
export { RowActionPrimaryClickHandler, RowActionSecondaryClickHandler,
|
|
143
|
+
export { RowActionPrimaryClickHandler, RowActionSecondaryClickHandler, RowBase, // exporting the base component for testing purpose
|
|
144
|
+
RowClickHandler, RowDragStartHandler, RowRequestMoveRowHandler, RowRequestToggleHandler, RowExpansionHandler, };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
2
3
|
import { TableRequestMoveRowHandler } from './Table';
|
|
3
|
-
|
|
4
|
+
import { ComponentProps } from '../utils/types';
|
|
4
5
|
declare type RowDragCellKeyDownHandler = (event: React.KeyboardEvent<HTMLTableCellElement>, data: {
|
|
5
6
|
dataId?: string | number;
|
|
6
7
|
index: number;
|
|
@@ -8,61 +9,41 @@ declare type RowDragCellKeyDownHandler = (event: React.KeyboardEvent<HTMLTableCe
|
|
|
8
9
|
declare type RowDragCellRequestMoveRowHandler = TableRequestMoveRowHandler;
|
|
9
10
|
interface RowDragCellPropsBase {
|
|
10
11
|
/**
|
|
11
|
-
*
|
|
12
|
-
*/
|
|
13
|
-
onDragStart?: RowDragCellDragStartHandler;
|
|
14
|
-
/**
|
|
15
|
-
* event-handler that is triggered when row drag ends
|
|
16
|
-
*/
|
|
17
|
-
onDragEnd?: () => void;
|
|
18
|
-
/**
|
|
19
|
-
* callback for reordering the rows
|
|
20
|
-
*/
|
|
21
|
-
onRequestMoveRow?: RowDragCellRequestMoveRowHandler;
|
|
22
|
-
/**
|
|
23
|
-
* index of the data-object in input array
|
|
12
|
+
* dataID of the activeElement or the selected element in DOM
|
|
24
13
|
*/
|
|
25
|
-
|
|
14
|
+
activeElementId?: string;
|
|
26
15
|
/**
|
|
27
16
|
* unique-ID of the data-object in input array
|
|
28
17
|
*/
|
|
29
18
|
dataId?: string | number;
|
|
30
19
|
/**
|
|
31
|
-
*
|
|
32
|
-
*/
|
|
33
|
-
activeElementId?: string;
|
|
34
|
-
/**
|
|
35
|
-
* location where the guideline would be displayed
|
|
20
|
+
* index of the data-object in input array
|
|
36
21
|
*/
|
|
37
|
-
|
|
22
|
+
index?: number;
|
|
38
23
|
/**
|
|
39
24
|
* event-handler for keyboard events
|
|
40
25
|
*/
|
|
41
26
|
onKeyDown?: RowDragCellKeyDownHandler;
|
|
27
|
+
/**
|
|
28
|
+
* callback for reordering the rows
|
|
29
|
+
*/
|
|
30
|
+
onRequestMoveRow?: RowDragCellRequestMoveRowHandler;
|
|
42
31
|
/**
|
|
43
32
|
* no of rows a cell expands to. applies when a table is rendered with expandable rows option
|
|
44
33
|
*/
|
|
45
34
|
rowSpan?: number;
|
|
46
35
|
}
|
|
47
|
-
declare
|
|
48
|
-
declare
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
componentDidMount(): void;
|
|
59
|
-
componentWillUnmount(): void;
|
|
60
|
-
private handleMount;
|
|
61
|
-
private handleDragStart;
|
|
62
|
-
private handleDragEnd;
|
|
63
|
-
private handleKeyDown;
|
|
64
|
-
private cleanupDrag;
|
|
65
|
-
render(): JSX.Element;
|
|
36
|
+
declare type RowDragCellProps = ComponentProps<RowDragCellPropsBase, 'td'>;
|
|
37
|
+
declare function RowDragCell({ activeElementId, onRequestMoveRow, index, dataId, onKeyDown, ...otherProps }: RowDragCellProps): JSX.Element;
|
|
38
|
+
declare namespace RowDragCell {
|
|
39
|
+
var propTypes: {
|
|
40
|
+
activeElementId: PropTypes.Requireable<string>;
|
|
41
|
+
dataId: PropTypes.Requireable<React.ReactText>;
|
|
42
|
+
index: PropTypes.Requireable<number>;
|
|
43
|
+
onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
|
|
44
|
+
onRequestMoveRow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
45
|
+
rowSpan: PropTypes.Requireable<number>;
|
|
46
|
+
};
|
|
66
47
|
}
|
|
67
48
|
export default RowDragCell;
|
|
68
|
-
export {
|
|
49
|
+
export { RowDragCellRequestMoveRowHandler };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { Component } from 'react';
|
|
2
|
-
import
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
3
|
import Body from './Body';
|
|
4
4
|
import Caption from './Caption';
|
|
5
5
|
import Cell, { CellClickHandler } from './Cell';
|
|
@@ -133,27 +133,33 @@ interface TablePropsBase {
|
|
|
133
133
|
}
|
|
134
134
|
declare const defaultProps: Required<Pick<TablePropsBase, 'actions' | 'dockOffset' | 'headType' | 'rowExpansion' | 'rowSelection' | 'resizableFillLayout' | 'primaryColumnIndex'>>;
|
|
135
135
|
declare type TableProps = ClassComponentProps<TablePropsBase, typeof defaultProps, 'div'>;
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
136
|
+
declare function TableBase(props: TableProps): JSX.Element;
|
|
137
|
+
declare namespace TableBase {
|
|
138
|
+
var propTypes: {
|
|
139
|
+
actions: PropTypes.Requireable<(PropTypes.ReactElementLike | null | undefined)[]>;
|
|
140
|
+
actionsColumnWidth: PropTypes.Requireable<number>;
|
|
141
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
142
|
+
dockOffset: PropTypes.Requireable<number>;
|
|
143
|
+
dockScrollBar: PropTypes.Requireable<boolean>;
|
|
144
|
+
elementRef: PropTypes.Requireable<object>;
|
|
145
|
+
headType: PropTypes.Requireable<string>;
|
|
146
|
+
innerStyle: PropTypes.Requireable<object>;
|
|
147
|
+
onRequestToggleAllRows: PropTypes.Requireable<(...args: any[]) => any>;
|
|
148
|
+
onScroll: PropTypes.Requireable<(...args: any[]) => any>;
|
|
149
|
+
outerStyle: PropTypes.Requireable<object>;
|
|
150
|
+
primaryColumnIndex: PropTypes.Requireable<number>;
|
|
151
|
+
rowExpansion: PropTypes.Requireable<string>;
|
|
152
|
+
rowSelection: PropTypes.Requireable<string>;
|
|
153
|
+
stripeRows: PropTypes.Requireable<boolean>;
|
|
154
|
+
tableStyle: PropTypes.Requireable<object>;
|
|
155
|
+
onRequestMoveColumn: PropTypes.Requireable<(...args: any[]) => any>;
|
|
156
|
+
onRequestMoveRow: PropTypes.Requireable<(...args: any[]) => any>;
|
|
157
|
+
onRequestResizeColumn: PropTypes.Requireable<(...args: any[]) => any>;
|
|
158
|
+
resizableFillLayout: PropTypes.Requireable<boolean>;
|
|
159
|
+
};
|
|
144
160
|
}
|
|
145
|
-
declare class Table extends Component<TableProps,
|
|
146
|
-
private dockedScrollBar;
|
|
147
|
-
private head;
|
|
148
|
-
private headFocusState?;
|
|
149
|
-
private headTable;
|
|
150
|
-
private headTableEl;
|
|
151
|
-
private scrollSource?;
|
|
152
|
-
private table;
|
|
153
|
-
private tableContainer;
|
|
161
|
+
declare class Table extends Component<TableProps, {}> {
|
|
154
162
|
static propTypes: React.WeakValidationMap<ClassComponentProps<TablePropsBase, Required<Pick<TablePropsBase, "actions" | "headType" | "rowSelection" | "resizableFillLayout" | "primaryColumnIndex" | "dockOffset" | "rowExpansion">>, "div", never>>;
|
|
155
|
-
context: React.ContextType<typeof ScrollContainerContext>;
|
|
156
|
-
static contextType: React.Context<Window | Document | HTMLElement | null | undefined>;
|
|
157
163
|
static defaultProps: Required<Pick<TablePropsBase, "actions" | "headType" | "rowSelection" | "resizableFillLayout" | "primaryColumnIndex" | "dockOffset" | "rowExpansion">>;
|
|
158
164
|
static Caption: typeof Caption;
|
|
159
165
|
static Head: typeof Head;
|
|
@@ -162,65 +168,9 @@ declare class Table extends Component<TableProps, TableState> {
|
|
|
162
168
|
static Body: typeof Body;
|
|
163
169
|
static Row: typeof Row;
|
|
164
170
|
static Cell: typeof Cell;
|
|
165
|
-
/**
|
|
166
|
-
* @private
|
|
167
|
-
* @private
|
|
168
|
-
* Returns an object describing the focus state of the provided `head`.
|
|
169
|
-
* @param head - A reference to a mounted `Head` component.
|
|
170
|
-
* @returns {Object} focusState - An object containing a target (either 'headCell' or
|
|
171
|
-
* 'resizeButton') and an index.
|
|
172
|
-
*/
|
|
173
|
-
private static getHeadFocusState;
|
|
174
|
-
private static getOffset;
|
|
175
|
-
/**
|
|
176
|
-
* @private
|
|
177
|
-
* @private
|
|
178
|
-
* Applies the provided `headFocusState` to the provided `head`.
|
|
179
|
-
* @param head - A reference to a mounted `Head` component.
|
|
180
|
-
* @param {Object} headFocusState
|
|
181
|
-
* @param {String} headFocusState.target - Focus can be applied to a 'headCell' or a
|
|
182
|
-
* 'resizeButton'.
|
|
183
|
-
* @param {Number} headFocusState.index - The index of the element to set focus on.
|
|
184
|
-
*/
|
|
185
|
-
private static applyHeadFocusState;
|
|
186
|
-
constructor(props: Readonly<TableProps>);
|
|
187
|
-
componentDidUpdate(prevProps: Readonly<TableProps>): void;
|
|
188
|
-
/**
|
|
189
|
-
* Add this lifecycle method to improve the performance of this giant component.
|
|
190
|
-
*/
|
|
191
|
-
shouldComponentUpdate(nextProps: Readonly<TableProps>, nextState: Readonly<TableState>): boolean;
|
|
192
|
-
componentDidMount(): void;
|
|
193
|
-
componentWillUnmount(): void;
|
|
194
|
-
private updateDockedHeadState;
|
|
195
|
-
private handleScroll;
|
|
196
|
-
private handleResize;
|
|
197
|
-
private handleContainerScroll;
|
|
198
|
-
private handleDockedScrollBarScroll;
|
|
199
|
-
private handleDragStart;
|
|
200
|
-
private handleDragOver;
|
|
201
|
-
private handleDragEnter;
|
|
202
|
-
private handleDragEnd;
|
|
203
|
-
private handleDrop;
|
|
204
|
-
private handleHeadMount;
|
|
205
|
-
private handleHeadTableMount;
|
|
206
|
-
private handleHeadTableElementMount;
|
|
207
|
-
private handleHeadTableKeyUp;
|
|
208
|
-
private handleAutosizeColumn;
|
|
209
|
-
private createHead;
|
|
210
|
-
private createBody;
|
|
211
|
-
private isInline;
|
|
212
|
-
private headerIsDocked;
|
|
213
|
-
private isFixed;
|
|
214
|
-
private showDockedHeader;
|
|
215
|
-
private showDockedScrollBar;
|
|
216
|
-
private updateDragPositionImpl;
|
|
217
|
-
private updateDragPosition;
|
|
218
|
-
private cleanupDrag;
|
|
219
|
-
private renderHeadTable;
|
|
220
|
-
private renderDockedScrollbar;
|
|
221
|
-
private getTableContainerWidthWithoutBorders;
|
|
222
171
|
render(): JSX.Element;
|
|
223
172
|
}
|
|
224
173
|
export default Table;
|
|
225
174
|
export { Body, Caption, Cell, Head, HeadCell, HeadDropdownCell, Row };
|
|
226
|
-
export type { CellClickHandler, HeadCellSortHandler, HeadDropdownCellPossibleCloseReason, HeadDropdownCellRequestCloseHandler, HeadDropdownCellRequestOpenHandler, RowActionPrimaryClickHandler, RowActionSecondaryClickHandler, RowClickHandler, RowRequestToggleHandler,
|
|
175
|
+
export type { CellClickHandler, HeadCellSortHandler, HeadDropdownCellPossibleCloseReason, HeadDropdownCellRequestCloseHandler, HeadDropdownCellRequestOpenHandler, RowActionPrimaryClickHandler, RowActionSecondaryClickHandler, RowClickHandler, RowRequestToggleHandler, TableBase, // exporting the base component for testing purpose
|
|
176
|
+
TableRequestMoveColumnHandler, TableRequestMoveRowHandler, TableRequestResizeColumnHandler, };
|
|
@@ -182,6 +182,7 @@ declare class TextArea extends Component<TextAreaProps, TextAreaState> {
|
|
|
182
182
|
private getAdornmentWidth;
|
|
183
183
|
private handleResize;
|
|
184
184
|
private handleInputMount;
|
|
185
|
+
private handleShadowMount;
|
|
185
186
|
private handleInputChange;
|
|
186
187
|
private handleInputKeyDown;
|
|
187
188
|
private handleInputSelect;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import '@testing-library/jest-dom';
|