@splunk/react-ui 5.1.0 → 5.2.0

package/types/src/Multiselect/docs/examples/Controlled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Controlled
+ */
 declare function Controlled(): React.JSX.Element;
 export default Controlled;

package/types/src/Multiselect/docs/examples/CustomizeSelected.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Customize selected Options
+ * @description It's possible to customize the appearance of selected Options.
+ */
 declare function CustomizeSelected(): React.JSX.Element;
 export default CustomizeSelected;

package/types/src/Multiselect/docs/examples/Disabled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Disabled
+ */
 declare function Disabled(): React.JSX.Element;
 export default Disabled;

package/types/src/Multiselect/docs/examples/Error.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Error
+ */
 declare function MultiselectError(): React.JSX.Element;
 export default MultiselectError;

package/types/src/Multiselect/docs/examples/Fetching.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Fetching
+ * @description It's possible to populate the Options from a server. Here, that behavior is simulated. This simplified example only matches the start of the label. The matchRange prop may be set manually to reflect the matching algorithm used to filter the results. Otherwise matching text is not shown.
+ */
 declare function Fetching(): React.JSX.Element;
 export default Fetching;

package/types/src/Multiselect/docs/examples/Headings.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Headings
+ */
 declare function Headings(): React.JSX.Element;
 export default Headings;

package/types/src/Multiselect/docs/examples/Icons.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Icons
+ */
 declare function Icons(): React.JSX.Element;
 export default Icons;

package/types/src/Multiselect/docs/examples/LoadMoreOnScrollBottom.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Load more on scroll bottom
+ * @description Similar example as fetching but it's also possible to append more Options from a server when the list is scrolled to the bottom. Here, that behavior is simulated. The onScrollBottom prop is a function that should fetch more results and append them to the current Options. Once all items are loaded, the onScrollBottom prop should be set to null.
+ */
 declare function LoadMoreOnScrollBottom(): React.JSX.Element;
 export default LoadMoreOnScrollBottom;

package/types/src/Multiselect/docs/examples/NewValues.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name New values
+ * @description Optionally, users can be allowed to add arbitrary values.
+ */
 declare function NewValues(): React.JSX.Element;
 export default NewValues;

package/types/src/Multiselect/docs/examples/TabInput.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Tab to confirm new value
+ * @description If a new value is entered and there are no other Options available, pressing the Tab key will confirm the new value.
+ */
 declare function TabInput(): React.JSX.Element;
 export default TabInput;

package/types/src/Multiselect/docs/examples/Uncontrolled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Uncontrolled
+ */
 declare function Uncontrolled(): React.JSX.Element;
 export default Uncontrolled;

package/types/src/Number/docs/examples/Basic.d.ts

@@ -1,5 +1,9 @@
 import React, { Component } from 'react';
 import { NumberChangeHandler } from '@splunk/react-ui/Number';
+/**
+ * @name Controlled
+ * @description Number requires a value prop and an onChange callback to update the value prop for most use cases. Set value to null.
+ */
 declare class Basic extends Component<object, {
     value?: number;
 }> {

package/types/src/Number/docs/examples/Disabled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Disabled
+ */
 declare function Disabled(): React.JSX.Element;
 export default Disabled;

package/types/src/Number/docs/examples/Error.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Error
+ */
 declare function NumberError(): React.JSX.Element;
 export default NumberError;

package/types/src/Number/docs/examples/Limits.d.ts

@@ -1,5 +1,9 @@
 import React, { Component } from 'react';
 import { NumberChangeHandler } from '@splunk/react-ui/Number';
+/**
+ * @name Limits
+ * @description Number accepts min, max, step, and roundTo props.
+ */
 declare class Limits extends Component<object, {
     value?: number;
 }> {

package/types/src/Number/docs/examples/Locale.d.ts

@@ -1,5 +1,9 @@
 import React, { Component } from 'react';
 import { NumberChangeHandler } from '@splunk/react-ui/Number';
+/**
+ * @name Locale
+ * @description A locale can be included which may change the decimal separator to a comma.
+ */
 declare class Locale extends Component<object, {
     value?: number;
 }> {

package/types/src/Number/docs/examples/Uncontrolled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Uncontrolled
+ * @description Alternately, Number can be uncontrolled and optionally provided a defaultValue. The onChange callback still fires. The value prop cannot be set or updated externally.
+ */
 declare function Uncontrolled(): React.JSX.Element;
 export default Uncontrolled;

package/types/src/Paginator/docs/examples/Basic.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Basic
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/Paginator/docs/examples/Compact.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Compact
+ * @description A Paginator control with buttons only.
+ */
 declare function Compact(): React.JSX.Element;
 export default Compact;

package/types/src/Paginator/docs/examples/CompactCustomLabel.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Compact with custom label
+ */
 declare function CompactCustomLabel(): React.JSX.Element;
 export default CompactCustomLabel;

package/types/src/Paginator/docs/examples/CompactWithLabel.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Compact with label
+ */
 declare function CompactWithLabel(): React.JSX.Element;
 export default CompactWithLabel;

package/types/src/Paginator/docs/examples/CustomPages.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Custom pages
+ * @description Customize Paginator's pages and Prev/Next buttons with generatePageProps.
+ */
 declare function CustomPages(): React.JSX.Element;
 export default CustomPages;

package/types/src/Paginator/docs/examples/Labelled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Labelled
+ * @description When possible, a Paginator should use aria-labelledby or aria-label to provide an accessible label describing the content that is being paginated.
+ */
 declare function Labelled(): React.JSX.Element;
 export default Labelled;

package/types/src/Paginator/docs/examples/PageControl.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Page control
+ * @description A Paginator control that allows any page to be selected.
+ */
 declare function PageControl(): React.JSX.Element;
 export default PageControl;

package/types/src/Paragraph/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Basic
+ * @description Paragraph provides default fonts, line heights, and spacing. Margins can be removed when necessary.
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/Popover/PopoverProvider.d.ts

@@ -1,6 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 interface PopoverContextProps {
+    /**
+     * @private
+     *
+     * If set, Popover will not call `stopPropagation` on click events.
+     */
+    allowPropagation?: boolean;
     children?: React.ReactNode;
     /**
      * Whether or not to hide the arrow pointing to the `Popover` anchor.
@@ -14,8 +20,10 @@ declare const PopoverContext: React.Context<PopoverContextProps>;
  * Provides a method for controlling certain `Popover` props in components that use `Popover`.
  */
 declare const PopoverProvider: {
-    ({ children, hideArrow }: PopoverContextProps): React.JSX.Element;
+    ({ allowPropagation, children, hideArrow }: PopoverContextProps): React.JSX.Element;
     propTypes: {
+        /** @private */
+        allowPropagation: PropTypes.Requireable<boolean>;
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         hideArrow: PropTypes.Requireable<boolean>;
     };

package/types/src/Popover/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Basic
+ * @description Click the button to view the Popover.
+ */
 declare function Example(): React.JSX.Element;
 export default Example;

package/types/src/Progress/docs/examples/Basic.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Basic
+ */
 declare function Example(): React.JSX.Element;
 export default Example;

package/types/src/Progress/docs/examples/Type.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Type
+ */
 declare function Type(): React.JSX.Element;
 export default Type;

package/types/src/Prose/docs/examples/Basic.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Basic Example
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/Prose/docs/examples/Customize.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Customize
+ * @description Content elements can be styled while still retaining the prose styling
+ */
 declare function Customize(): React.JSX.Element;
 export default Customize;

package/types/src/RadioBar/docs/examples/AdornmentAriaExamples.d.ts

@@ -1,3 +1,8 @@
 import React from 'react';
+/**
+ * @name Adornments using aria-* attributes
+ * @description startAdornment and endAdornment will be part of the Options' label by default.
+ * Change the semantics of adornments where they are not labels using the `aria-*` attributes: aria-labelledby, aria-describedby, aria-hidden.
+ */
 declare function AdornmentAriaExamples(): React.JSX.Element;
 export default AdornmentAriaExamples;

package/types/src/RadioBar/docs/examples/Basic.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Controlled
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/RadioBar/docs/examples/Disabled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Disabled
+ * @description Either the entire RadioBar or individual Options can be disabled using the disabled prop. When set on the RadioBar, this overrides any individual Option disabled states.
+ */
 declare function Disabled(): React.JSX.Element;
 export default Disabled;

package/types/src/RadioBar/docs/examples/Error.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Error
+ */
 declare function RadioBarError(): React.JSX.Element;
 export default RadioBarError;

package/types/src/RadioBar/docs/examples/MenuBar.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Menu bar
+ * @description Radio Bar can be used outside of a form context to behave like a menu bar by setting role="menubar"
+ */
 declare function MenuBar(): React.JSX.Element;
 export default MenuBar;

package/types/src/RadioBar/docs/examples/Uncontrolled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Uncontrolled
+ */
 declare function Uncontrolled(): React.JSX.Element;
 export default Uncontrolled;

package/types/src/RadioList/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Controlled
+ * @description Radio List requires a value prop and an onChange callback to update the value prop for most use cases.
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/RadioList/docs/examples/Disabled.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Disabled
+ */
 declare function Disabled(): React.JSX.Element;
 export default Disabled;

package/types/src/RadioList/docs/examples/Error.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Error
+ */
 declare function RadioListError(): React.JSX.Element;
 export default RadioListError;

package/types/src/RadioList/docs/examples/Row.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Row layout
+ */
 declare function Row(): React.JSX.Element;
 export default Row;

package/types/src/RadioList/docs/examples/Uncontrolled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Uncontrolled
+ * @description Alternately, Radio List can be uncontrolled and optionally provided a defaultValue. The onChange callback still fires. The value prop cannot be set or updated externally.
+ */
 declare function Uncontrolled(): React.JSX.Element;
 export default Uncontrolled;

package/types/src/Resize/docs/examples/Appearance.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Appearance
+ * @description Resize handles can be placed on any edge or corner. Note that margin cannot be overridden when using the "border" appearance.
+ */
 declare function Appearance(): React.JSX.Element;
 export default Appearance;

package/types/src/Resize/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Basic
+ * @description The onRequestResize handler must handle any desired constraints on size.
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/Resize/docs/examples/Percentage.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Percentage
+ * @description Sizes don't need to be defined in pixels or with height and width styles. Here, flex-basis is calculated as a percentage.
+ */
 declare function Percentage(): React.JSX.Element;
 export default Percentage;

package/types/src/Resize/docs/examples/SizingInner.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Sizing inner
+ * @description In this example, styles are placed on the inner content.
+ */
 declare function SizingInner(): React.JSX.Element;
 export default SizingInner;

package/types/src/Resize/docs/examples/SizingOuter.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Sizing outer
+ * @description Resize does not dictate how it is sized. In this example, styles are placed on an outer container.
+ */
 declare function SizingOuter(): React.JSX.Element;
 export default SizingOuter;

package/types/src/ScreenReaderContent/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Basic
+ * @description Click 'Show Code' to view the hidden Screen Reader Content.
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/ScreenReaderContent/docs/examples/SkipLink.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Skip-link
+ * @description For initially hidden interactive content, such as skip-links, use the skipLink mixin.
+ */
 declare function SkipLink(): React.JSX.Element;
 export default SkipLink;

package/types/src/Scroll/docs/examples/Controlled.d.ts

@@ -1,4 +1,8 @@
 import React, { Component } from 'react';
+/**
+ * @name Controlled
+ * @description The controlled method must be used to set the Scroll position.
+ */
 declare class Basic extends Component<object, {
     top?: number;
 }> {

package/types/src/Scroll/docs/examples/Uncontrolled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Uncontrolled with scroll propagation
+ * @description The uncontrolled approach is useful for stopping propagation of the Scroll. Here, scrolling with the mouse wheel over the container does not scroll the window.
+ */
 declare function Uncontrolled(): React.JSX.Element;
 export default Uncontrolled;

package/types/src/ScrollContainerContext/docs/examples/Provider.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Provider
+ * @description A Dropdown inside a custom Scroll Container. The Dropdown (when open) scrolls with the custom container, not the window.
+ */
 declare function Provider(): React.JSX.Element;
 export default Provider;

package/types/src/Search/docs/examples/Controlled.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Controlled
+ * @description The Search component can be used as both uncontrolled default variant and as a controlled variant. In this example we show the controlled variant.
+ */
 declare const Controlled: () => React.JSX.Element;
 export default Controlled;

package/types/src/Search/docs/examples/Loading.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Asynchronously loaded options
+ * @description The Search component's quick Options can be loaded asynchronously. In this example we show the input paired with asycnchrously loaded and filtered Options.
+ */
 declare function Loading(): React.JSX.Element;
 export default Loading;

package/types/src/Search/docs/examples/Options.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Quick options
+ * @description The Search component can be populated with quick Options. In this example the user can select a quick Option or search via the input, but the Options are not filtered.
+ */
 declare const Options: () => React.JSX.Element;
 export default Options;

package/types/src/Search/docs/examples/OptionsLinks.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Options as links
+ * @description The option on a list of results of search can be a link redirecting to a product page
+ */
 declare const OptionsLinks: () => React.JSX.Element;
 export default OptionsLinks;

package/types/src/Select/SelectAllOption.d.ts

@@ -1,17 +1,12 @@
 import React from 'react';
+import OptionBase from './OptionBase';
 import { ComponentProps } from '../utils/types';
-interface SelectAllOptionPropsBase {
-    active?: boolean;
-    changedToggle?: boolean;
-    elementRef?: React.Ref<HTMLAnchorElement | HTMLButtonElement>;
-    id?: string;
-    onClick: (e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLInputElement>) => void;
-    selectAllLabel: string;
-    selected?: boolean | 'some';
+interface SelectAllOptionPropsBase extends Omit<React.ComponentProps<typeof OptionBase>, 'value'> {
     totalCount?: number;
+    value?: string;
 }
-type SelectAllOptionProps = ComponentProps<SelectAllOptionPropsBase, 'div'>;
-declare function SelectAllOption({ active, elementRef, id, onClick, selectAllLabel, totalCount, changedToggle, selected, }: SelectAllOptionProps): React.JSX.Element;
+type SelectAllOptionProps = ComponentProps<SelectAllOptionPropsBase, 'button'>;
+declare function SelectAllOption({ active, elementRef, id, label, onClick, selected, totalCount, value, ...otherProps }: SelectAllOptionProps): React.JSX.Element;
 declare namespace SelectAllOption {
     var propTypes: React.WeakValidationMap<SelectAllOptionPropsBase>;
 }

package/types/src/Select/SelectBase.d.ts

@@ -164,7 +164,7 @@ interface SelectBasePropsBase {
     /**
      * Determines how to display Select all/Clear all.
      */
-    selectAllAppearance?: 'buttongroup' | 'checkbox';
+    selectAllAppearance?: 'buttongroup' | 'checkbox' | 'none';
     showSelectedValuesFirst?: 'nextOpen' | 'immediately' | 'never';
     /**
      * Places this string after the selected label.

package/types/src/Select/docs/examples/Appearance.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Appearance
+ * @description The appearance prop changes the toggle to any button appearance, or a link for use in sentences.
+ */
 declare function Appearance(): React.JSX.Element;
 export default Appearance;

package/types/src/Select/docs/examples/Basic.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Controlled
+ * @description Select requires a value prop and an onChange callback to update the value prop for most use cases.
+ */
 declare function Basic(): React.JSX.Element;
 export default Basic;

package/types/src/Select/docs/examples/Children.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Children
+ * @description children replace label when provided. label is still used for matching to the filter.
+ */
 declare function Children(): React.JSX.Element;
 export default Children;

package/types/src/Select/docs/examples/Descriptions.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Descriptions
+ * @description Descriptions can be placed below or to the right of the label.
+ */
 declare function Descriptions(): React.JSX.Element;
 export default Descriptions;

package/types/src/Select/docs/examples/Error.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Error
+ */
 declare function SelectError(): React.JSX.Element;
 export default SelectError;

package/types/src/Select/docs/examples/Fetching.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Fetching
+ * @description It's possible to populate the Options from a server. Here, that behavior is simulated. This simplified example only matches the start of the label. The matchRange prop may be set manually to reflect the matching algorithm used to filter the results. Otherwise matching text is not shown.
+ */
 declare function Fetching(): React.JSX.Element;
 export default Fetching;

package/types/src/Select/docs/examples/Filter.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Filter select items
+ * @description An additional filter box can be enabled.
+ */
 declare function Filter(): React.JSX.Element;
 export default Filter;

package/types/src/Select/docs/examples/Headings.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Headings and dividers
+ */
 declare function Headings(): React.JSX.Element;
 export default Headings;

package/types/src/Select/docs/examples/Icons.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
+/**
+ * @name Icons
+ */
 declare function Icons(): React.JSX.Element;
 export default Icons;

package/types/src/Select/docs/examples/LoadMoreOnScrollBottom.d.ts

@@ -1,3 +1,7 @@
 import React from 'react';
+/**
+ * @name Load more on scroll bottom
+ * @description This example is similar to the example for fetching. You can append more Options from a server when the list is scrolled to the bottom. Here, that behavior is simulated. The onScrollBottom prop is a function that should fetches more results and appends them to the current Options. Once all items are loaded, the onScrollBottom prop should be set to null.
+ */
 declare function LoadMoreOnScrollBottom(): React.JSX.Element;
 export default LoadMoreOnScrollBottom;