@splunk/react-ui 4.3.0 → 4.5.0

package/types/src/StepBar/Step.d.ts

@@ -10,14 +10,6 @@ interface StepPropsBase {
     /** Displays active step with alert icon.
      * @includeTheme prisma */
     error?: boolean;
-    /** @private. */
-    isFirst?: boolean;
-    /** @private. */
-    idCounter?: string;
-    /** @private. */
-    isLast?: boolean;
-    /** @private. Is the tab active. */
-    status?: 'prev' | 'active' | 'next' | 'error';
     /**
      * A unique `id` for this step and used by the `StepBar` to keep track of the open `Step`.
      * Defaults to a zero-based index matching the component's position in `StepBar`.
@@ -26,16 +18,12 @@ interface StepPropsBase {
 }
 declare type StepProps = ComponentProps<StepPropsBase, 'li'>;
 declare function Step({ children, elementRef, error, // eslint-disable-line @typescript-eslint/no-unused-vars
-idCounter, isFirst, isLast, status, stepId, ...otherProps }: StepProps): JSX.Element;
+stepId, ...otherProps }: StepProps): JSX.Element;
 declare namespace Step {
     var propTypes: {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         elementRef: PropTypes.Requireable<object>;
         error: PropTypes.Requireable<boolean>;
-        idCounter: PropTypes.Requireable<string>;
-        isFirst: PropTypes.Requireable<boolean>;
-        isLast: PropTypes.Requireable<boolean>;
-        status: PropTypes.Requireable<string>;
         stepId: PropTypes.Requireable<any>;
     };
 }

package/types/src/StepBar/StepBarContext.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export interface StepBarContext {
+    activeStepId: number;
+    idCounter?: string;
+    lastChildIndex?: number;
+}
+export declare const StepBarContext: import("react").Context<StepBarContext>;
+export default StepBarContext;

package/types/src/TabBar/Tab.d.ts

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import { ClassComponentProps } from '../utils/types';
+import TabBarContext from './TabBarContext';
 declare type TabClickHandler = (event: React.MouseEvent<HTMLButtonElement>, data: {
     tabId?: string;
     tabKey?: number;
@@ -15,8 +16,6 @@ interface TabPropsBase {
      * The ariaControls prop is the element `id` of the content displayed when the tab is selected.
      */
     ariaControls?: string;
-    /** @private. Setting this prop to 'context' creates an appearance without an underline. */
-    appearance?: 'navigation' | 'context';
     /** Inserts number in tab label. */
     count?: number;
     /** Prevents user from clicking the tab. */
@@ -27,8 +26,6 @@ interface TabPropsBase {
     elementRef?: React.Ref<HTMLButtonElement>;
     /** See Icon documentation for more information. */
     icon?: React.ReactNode;
-    /** @private. Size of icon. */
-    iconSize?: 'inline' | 'small' | 'large';
     /**
      * Placed on the clickable element. For accessibility, the related content must
      * have an `aria-labelledby` attribute that matches this `id`. The `id` must be unique
@@ -37,12 +34,6 @@ interface TabPropsBase {
     id?: string;
     /** The text shown in the button. */
     label?: React.ReactNode;
-    /** @private. The layout of tabs */
-    layout?: 'horizontal' | 'vertical';
-    /** @private. Callback function when activated */
-    onClick?: TabClickHandler;
-    /** @private. Callback function when focused */
-    onFocus?: TabFocusHandler;
     ref?: React.Ref<Tab>;
     /** A unique `id` for this tab and used by the `TabBar` to keep track of the open tab. */
     tabId?: string;
@@ -56,7 +47,7 @@ interface TabPropsBase {
      */
     tooltip?: React.ReactNode;
 }
-declare const defaultProps: Required<Pick<TabPropsBase, 'active' | 'disabled' | 'iconSize' | 'layout'>>;
+declare const defaultProps: Required<Pick<TabPropsBase, 'active'>>;
 declare type TabProps = ClassComponentProps<TabPropsBase, typeof defaultProps, 'div'>;
 interface TabState {
     anchor: HTMLButtonElement | null;
@@ -64,8 +55,9 @@ interface TabState {
 }
 declare class Tab extends Component<TabProps, TabState> {
     private popoverId;
-    static propTypes: React.WeakValidationMap<ClassComponentProps<TabPropsBase, Required<Pick<TabPropsBase, "disabled" | "layout" | "active" | "iconSize">>, "div", never>>;
-    static defaultProps: Required<Pick<TabPropsBase, "disabled" | "layout" | "active" | "iconSize">>;
+    static propTypes: React.WeakValidationMap<ClassComponentProps<TabPropsBase, Required<Pick<TabPropsBase, "active">>, "div", never>>;
+    static defaultProps: Required<Pick<TabPropsBase, "active">>;
+    static contextType: React.Context<TabBarContext>;
     constructor(props: Readonly<TabProps>);
     private handleMount;
     private handleTooltipOpen;

package/types/src/TabBar/TabBarContext.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { TabClickHandler, TabFocusHandler } from './Tab';
+export interface TabBarContext {
+    active?: string;
+    appearance?: string;
+    disabled?: boolean;
+    iconSize?: 'inline' | 'small' | 'large';
+    layout?: 'horizontal' | 'vertical';
+    onClick?: TabClickHandler;
+    onFocus?: TabFocusHandler;
+    width?: number | null;
+}
+export declare const TabBarContext: import("react").Context<TabBarContext>;
+export default TabBarContext;

package/types/src/Table/Body.d.ts

@@ -16,7 +16,7 @@ interface BodyPropsBase {
     /** @private. Generally passed by Table rather than added directly. */
     movableColumns?: boolean;
     /** @private. Generally passed by Table rather than added directly. */
-    rowExpansion?: 'single' | 'multi' | 'none';
+    rowExpansion?: 'single' | 'multi' | 'none' | 'controlled';
     /** @private. Generally passed by Table rather than added directly. */
     onRequestMoveRow?: BodyRequestMoveRowHandler;
     /** @private. Generally passed by Table rather than added directly. */

package/types/src/Table/Head.d.ts

@@ -21,7 +21,7 @@ interface HeadPropsBase {
     /** @private. */
     actionsColumnWidth?: number;
     /**
-     * Must be `Table.HeadCell`s or `Table.HeadDropdownCells`.
+     * Must be `Table.HeadCell`s or `Table.HeadDropdownCell`s.
      */
     children?: React.ReactNode;
     /** @private. */
@@ -48,6 +48,8 @@ interface HeadPropsBase {
     onRequestToggleAllRows?: () => void;
     /** @private. */
     rowSelection?: 'all' | 'some' | 'none';
+    /** @private */
+    resizableFillLayout?: boolean;
 }
 declare const defaultProps: Required<Pick<HeadPropsBase, 'actions'>>;
 declare type HeadProps = ClassComponentProps<HeadPropsBase, typeof defaultProps, 'thead'>;

package/types/src/Table/HeadCell.d.ts

@@ -82,7 +82,7 @@ interface HeadCellPropsBase {
     /**
      * The width of the column in pixels.
      */
-    width?: number;
+    width?: number | 'auto';
     /** @private. */
     variant?: 'toggleAll' | 'info' | 'actions';
 }

package/types/src/Table/HeadInner.d.ts

@@ -20,10 +20,10 @@ interface HeadInnerPropsBase {
     resizable?: boolean;
     sortDir?: string;
     truncate?: boolean;
-    width?: number;
+    width?: number | 'auto';
 }
 declare type HeadInnerProps = ComponentProps<HeadInnerPropsBase, 'span'>;
-declare function HeadInner({ index, columnId, id, width, onDragEnd, onAutosizeColumn, align, label, hasActionsHead, isMenu, onDragStart, onRequestResize, resizable, sortDir, truncate, ...otherProps }: HeadInnerProps): JSX.Element;
+declare function HeadInner({ index, columnId, id, width: widthProp, onDragEnd, onAutosizeColumn, align, label, hasActionsHead, isMenu, onDragStart, onRequestResize, resizable, sortDir, truncate, ...otherProps }: HeadInnerProps): JSX.Element;
 declare namespace HeadInner {
     var propTypes: {
         align: PropTypes.Requireable<string>;
@@ -40,7 +40,7 @@ declare namespace HeadInner {
         resizable: PropTypes.Requireable<boolean>;
         sortDir: PropTypes.Requireable<string>;
         truncate: PropTypes.Requireable<boolean>;
-        width: PropTypes.Requireable<number>;
+        width: PropTypes.Requireable<React.ReactText>;
     };
 }
 export default HeadInner;

package/types/src/Table/Row.d.ts

@@ -45,7 +45,9 @@ interface RowPropsBase {
     elementRef?: React.Ref<HTMLTableRowElement>;
     /** @private. */
     expandable?: boolean;
-    /** @private. */
+    /**
+     * Allows row expansion to be controlled programmatically if the `rowExpansion` prop is set to `controlled` in `Table`.
+     */
     expanded?: boolean;
     /**
      * An optional row that is displayed when this row is expanded, or an array of rows.
@@ -61,7 +63,9 @@ interface RowPropsBase {
     onClick?: RowClickHandler;
     /** @private. Generally passed by `Table` rather than added directly. */
     onDragStart?: RowDragStartHandler;
-    /** @private. */
+    /**
+     * An event handler that triggers when the row expansion element is selected.
+     */
     onExpansion?: RowExpansionHandler;
     /** @private. This is passed through and works as expected. */
     onKeyDown?: React.KeyboardEventHandler<HTMLTableRowElement>;
@@ -87,12 +91,15 @@ declare class Row extends Component<RowProps, {}> {
     static splunkUiType: string;
     static propTypes: React.WeakValidationMap<ClassComponentProps<RowPropsBase, Required<Pick<RowPropsBase, "stripe">>, "tr", never>>;
     static defaultProps: Required<Pick<RowPropsBase, "stripe">>;
+    private elementRef;
     private handleClick;
     private handleKeyDown;
     private handleToggle;
+    private handleExpansion;
     private renderActionPrimary;
     private renderActionsSecondary;
+    private handleMount;
     render(): JSX.Element;
 }
 export default Row;
-export { RowActionPrimaryClickHandler, RowActionSecondaryClickHandler, RowClickHandler, RowDragStartHandler, RowRequestMoveRowHandler, RowRequestToggleHandler, };
+export { RowActionPrimaryClickHandler, RowActionSecondaryClickHandler, RowClickHandler, RowDragStartHandler, RowRequestMoveRowHandler, RowRequestToggleHandler, RowExpansionHandler, };

package/types/src/Table/Table.d.ts

@@ -89,9 +89,10 @@ interface TablePropsBase {
      * * `single`: Only one row can be expanded at a time. If another expansion button is
      * clicked, the currently expanded row closes and the new one opens.
      * * `multi`: Allows mulitple rows to be expanded at the same time.
+     * * `controlled`: Allows the expanded state to be externally managed by `expanded` prop of `Row`.
      * * `none`: The default with no row expansion.
      */
-    rowExpansion?: 'single' | 'multi' | 'none';
+    rowExpansion?: 'single' | 'multi' | 'controlled' | 'none';
     /**
      * When an `onRequestToggleAllRows` handler is defined, this prop determines the appearance
      * of the toggle all rows button.
@@ -122,8 +123,12 @@ interface TablePropsBase {
      * options object with `columnId`, `index`, and `width`.
      */
     onRequestResizeColumn?: TableRequestResizeColumnHandler;
+    /**
+     * Table will fill parent container. Resizable columns can have a `width` of `auto` only with this prop enabled.
+     */
+    resizableFillLayout?: boolean;
 }
-declare const defaultProps: Required<Pick<TablePropsBase, 'actions' | 'dockOffset' | 'headType' | 'rowExpansion' | 'rowSelection'>>;
+declare const defaultProps: Required<Pick<TablePropsBase, 'actions' | 'dockOffset' | 'headType' | 'rowExpansion' | 'rowSelection' | 'resizableFillLayout'>>;
 declare type TableProps = ClassComponentProps<TablePropsBase, typeof defaultProps, 'div'>;
 interface TableState {
     cellWidths?: number[];
@@ -143,9 +148,9 @@ declare class Table extends Component<TableProps, TableState> {
     private scrollSource?;
     private table;
     private tableContainer;
-    static propTypes: React.WeakValidationMap<ClassComponentProps<TablePropsBase, Required<Pick<TablePropsBase, "actions" | "rowSelection" | "headType" | "dockOffset" | "rowExpansion">>, "div", never>>;
-    static contextType: React.Context<Element | "window" | null | undefined>;
-    static defaultProps: Required<Pick<TablePropsBase, "actions" | "rowSelection" | "headType" | "dockOffset" | "rowExpansion">>;
+    static propTypes: React.WeakValidationMap<ClassComponentProps<TablePropsBase, Required<Pick<TablePropsBase, "actions" | "rowSelection" | "resizableFillLayout" | "headType" | "dockOffset" | "rowExpansion">>, "div", never>>;
+    static contextType: React.Context<Window | Document | HTMLElement | null | undefined>;
+    static defaultProps: Required<Pick<TablePropsBase, "actions" | "rowSelection" | "resizableFillLayout" | "headType" | "dockOffset" | "rowExpansion">>;
     static Caption: typeof Caption;
     static Head: typeof Head;
     static HeadCell: typeof HeadCell;