@patternfly/react-core 5.0.0-alpha.6 → 5.0.0-alpha.8

package/components/ProgressStepper/index.js

@@ -0,0 +1,3 @@
+export * from './ProgressStepper';
+export * from './ProgressStep';
+//# sourceMappingURL=index.js.map

package/components/ProgressStepper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ProgressStepper/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC"}

package/components/Radio/Radio.d.ts

@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { PickOptional } from '../../helpers/typeUtils';
+import { OUIAProps } from '../../helpers';
+export interface RadioProps extends Omit<React.HTMLProps<HTMLInputElement>, 'disabled' | 'label' | 'onChange' | 'type'>, OUIAProps {
+    /** Additional classes added to the radio. */
+    className?: string;
+    /** Id of the radio. */
+    id: string;
+    /** Flag to show if the radio label is wrapped on small screen. */
+    isLabelWrapped?: boolean;
+    /** Flag to show if the radio label is shown before the radio button. */
+    isLabelBeforeButton?: boolean;
+    /** Flag to show if the radio is checked. */
+    checked?: boolean;
+    /** Flag to show if the radio is checked. */
+    isChecked?: boolean;
+    /** Flag to show if the radio is disabled. */
+    isDisabled?: boolean;
+    /** Flag to show if the radio selection is valid or invalid. */
+    isValid?: boolean;
+    /** Label text of the radio. */
+    label?: React.ReactNode;
+    /** Name for group of radios */
+    name: string;
+    /** A callback for when the radio selection changes. */
+    onChange?: (checked: boolean, event: React.FormEvent<HTMLInputElement>) => void;
+    /** Aria label for the radio. */
+    'aria-label'?: string;
+    /** Description text of the radio. */
+    description?: React.ReactNode;
+    /** Body of the radio. */
+    body?: React.ReactNode;
+    /** Value to overwrite the randomly generated data-ouia-component-id.*/
+    ouiaId?: number | string;
+    /** Set the value of data-ouia-safe. Only set to true when the component is in a static state, i.e. no animations are occurring. At all other times, this value must be false. */
+    ouiaSafe?: boolean;
+}
+export declare class Radio extends React.Component<RadioProps, {
+    ouiaStateId: string;
+}> {
+    static displayName: string;
+    static defaultProps: PickOptional<RadioProps>;
+    constructor(props: RadioProps);
+    handleChange: (event: React.FormEvent<HTMLInputElement>) => void;
+    render(): JSX.Element;
+}
+//# sourceMappingURL=Radio.d.ts.map

package/components/Radio/Radio.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACvD,OAAO,EAAgB,SAAS,EAAoB,MAAM,eAAe,CAAC;AAE1E,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC,EACzF,SAAS;IACX,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,kEAAkE;IAClE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,wEAAwE;IACxE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+DAA+D;IAC/D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,+BAA+B;IAC/B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,+BAA+B;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAChF,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qCAAqC;IACrC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,yBAAyB;IACzB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,iLAAiL;IACjL,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,qBAAa,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,UAAU,EAAE;IAAE,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC;IAC7E,MAAM,CAAC,WAAW,SAAW;IAC7B,MAAM,CAAC,YAAY,EAAE,YAAY,CAAC,UAAU,CAAC,CAK3C;gBAEU,KAAK,EAAE,UAAU;IAW7B,YAAY,UAAW,MAAM,SAAS,CAAC,gBAAgB,CAAC,UAEtD;IAEF,MAAM;CA6EP"}

package/components/Radio/Radio.js

@@ -0,0 +1,57 @@
+import { __rest } from "tslib";
+import * as React from 'react';
+import styles from '@patternfly/react-styles/css/components/Radio/radio';
+import { css } from '@patternfly/react-styles';
+import { getOUIAProps, getDefaultOUIAId } from '../../helpers';
+export class Radio extends React.Component {
+    constructor(props) {
+        super(props);
+        this.handleChange = (event) => {
+            this.props.onChange(event.currentTarget.checked, event);
+        };
+        if (!props.label && !props['aria-label']) {
+            // eslint-disable-next-line no-console
+            console.error('Radio:', 'Radio requires an aria-label to be specified');
+        }
+        this.state = {
+            ouiaStateId: getDefaultOUIAId(Radio.displayName)
+        };
+    }
+    render() {
+        const _a = this.props, { 'aria-label': ariaLabel, checked, className, defaultChecked, isLabelWrapped, isLabelBeforeButton, isChecked, isDisabled, isValid, label, 
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        onChange, description, body, ouiaId, ouiaSafe = true } = _a, props = __rest(_a, ['aria-label', "checked", "className", "defaultChecked", "isLabelWrapped", "isLabelBeforeButton", "isChecked", "isDisabled", "isValid", "label", "onChange", "description", "body", "ouiaId", "ouiaSafe"]);
+        if (!props.id) {
+            // eslint-disable-next-line no-console
+            console.error('Radio:', 'id is required to make input accessible');
+        }
+        const inputRendered = (React.createElement("input", Object.assign({}, props, { className: css(styles.radioInput), type: "radio", onChange: this.handleChange, "aria-invalid": !isValid, disabled: isDisabled, checked: checked || isChecked }, (checked === undefined && { defaultChecked }), (!label && { 'aria-label': ariaLabel }), getOUIAProps(Radio.displayName, ouiaId !== undefined ? ouiaId : this.state.ouiaStateId, ouiaSafe))));
+        let labelRendered = null;
+        if (label && isLabelWrapped) {
+            labelRendered = React.createElement("span", { className: css(styles.radioLabel, isDisabled && styles.modifiers.disabled) }, label);
+        }
+        else if (label) {
+            labelRendered = (React.createElement("label", { className: css(styles.radioLabel, isDisabled && styles.modifiers.disabled), htmlFor: props.id }, label));
+        }
+        const descRender = description ? React.createElement("span", { className: css(styles.radioDescription) }, description) : null;
+        const bodyRender = body ? React.createElement("span", { className: css(styles.radioBody) }, body) : null;
+        const childrenRendered = isLabelBeforeButton ? (React.createElement(React.Fragment, null,
+            labelRendered,
+            inputRendered,
+            descRender,
+            bodyRender)) : (React.createElement(React.Fragment, null,
+            inputRendered,
+            labelRendered,
+            descRender,
+            bodyRender));
+        return isLabelWrapped ? (React.createElement("label", { className: css(styles.radio, className), htmlFor: props.id }, childrenRendered)) : (React.createElement("div", { className: css(styles.radio, !label && styles.modifiers.standalone, className) }, childrenRendered));
+    }
+}
+Radio.displayName = 'Radio';
+Radio.defaultProps = {
+    className: '',
+    isDisabled: false,
+    isValid: true,
+    onChange: () => { }
+};
+//# sourceMappingURL=Radio.js.map

package/components/Radio/Radio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../../../src/components/Radio/Radio.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,qDAAqD,CAAC;AACzE,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,OAAO,EAAE,YAAY,EAAa,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAuC1E,MAAM,OAAO,KAAM,SAAQ,KAAK,CAAC,SAA8C;IAS7E,YAAY,KAAiB;QAC3B,KAAK,CAAC,KAAK,CAAC,CAAC;QAUf,iBAAY,GAAG,CAAC,KAAwC,EAAE,EAAE;YAC1D,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;QAC1D,CAAC,CAAC;QAXA,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,EAAE;YACxC,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,QAAQ,EAAE,8CAA8C,CAAC,CAAC;SACzE;QACD,IAAI,CAAC,KAAK,GAAG;YACX,WAAW,EAAE,gBAAgB,CAAC,KAAK,CAAC,WAAW,CAAC;SACjD,CAAC;IACJ,CAAC;IAMD,MAAM;QACJ,MAAM,KAkBF,IAAI,CAAC,KAAK,EAlBR,EACJ,YAAY,EAAE,SAAS,EACvB,OAAO,EACP,SAAS,EACT,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,OAAO,EACP,KAAK;QACL,6DAA6D;QAC7D,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,MAAM,EACN,QAAQ,GAAG,IAAI,OAEH,EADT,KAAK,cAjBJ,yMAkBL,CAAa,CAAC;QACf,IAAI,CAAC,KAAK,CAAC,EAAE,EAAE;YACb,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,QAAQ,EAAE,yCAAyC,CAAC,CAAC;SACpE;QAED,MAAM,aAAa,GAAG,CACpB,+CACM,KAAK,IACT,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,UAAU,CAAC,EACjC,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,IAAI,CAAC,YAAY,kBACb,CAAC,OAAO,EACtB,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,OAAO,IAAI,SAAS,IACzB,CAAC,OAAO,KAAK,SAAS,IAAI,EAAE,cAAc,EAAE,CAAC,EAC7C,CAAC,CAAC,KAAK,IAAI,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC,EACvC,YAAY,CAAC,KAAK,CAAC,WAAW,EAAE,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,QAAQ,CAAC,EACrG,CACH,CAAC;QAEF,IAAI,aAAa,GAAoB,IAAI,CAAC;QAC1C,IAAI,KAAK,IAAI,cAAc,EAAE;YAC3B,aAAa,GAAG,8BAAM,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,UAAU,EAAE,UAAU,IAAI,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAG,KAAK,CAAQ,CAAC;SAClH;aAAM,IAAI,KAAK,EAAE;YAChB,aAAa,GAAG,CACd,+BAAO,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,UAAU,EAAE,UAAU,IAAI,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,IACjG,KAAK,CACA,CACT,CAAC;SACH;QAED,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,8BAAM,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,gBAAgB,CAAC,IAAG,WAAW,CAAQ,CAAC,CAAC,CAAC,IAAI,CAAC;QAC5G,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,8BAAM,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,SAAS,CAAC,IAAG,IAAI,CAAQ,CAAC,CAAC,CAAC,IAAI,CAAC;QACvF,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAC7C;YACG,aAAa;YACb,aAAa;YACb,UAAU;YACV,UAAU,CACV,CACJ,CAAC,CAAC,CAAC,CACF;YACG,aAAa;YACb,aAAa;YACb,UAAU;YACV,UAAU,CACV,CACJ,CAAC;QAEF,OAAO,cAAc,CAAC,CAAC,CAAC,CACtB,+BAAO,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,IAC9D,gBAAgB,CACX,CACT,CAAC,CAAC,CAAC,CACF,6BAAK,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,MAAM,CAAC,SAAS,CAAC,UAAU,EAAE,SAAS,CAAC,IAAG,gBAAgB,CAAO,CAC9G,CAAC;IACJ,CAAC;;AAnGM,iBAAW,GAAG,OAAO,CAAC;AACtB,kBAAY,GAA6B;IAC9C,SAAS,EAAE,EAAE;IACb,UAAU,EAAE,KAAK;IACjB,OAAO,EAAE,IAAI;IACb,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;CACnB,CAAC"}

package/components/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Radio';
+//# sourceMappingURL=index.d.ts.map

package/components/Radio/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Radio/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/components/Radio/index.js

@@ -0,0 +1,2 @@
+export * from './Radio';
+//# sourceMappingURL=index.js.map

package/components/Radio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Radio/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}

package/components/SearchInput/AdvancedSearchMenu.d.ts

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { SearchInputSearchAttribute } from './SearchInput';
+export interface AdvancedSearchMenuProps extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange'> {
+    /** Delimiter in the query string for pairing attributes with search values.
+     * Required whenever attributes are passed as props.
+     */
+    advancedSearchDelimiter?: string;
+    /** Array of attribute values used for dynamically generated advanced search. */
+    attributes?: string[] | SearchInputSearchAttribute[];
+    /** Additional classes added to the advanced search menu. */
+    className?: string;
+    formAdditionalItems?: React.ReactNode;
+    /** Function which builds an attribute-value map by parsing the value in the search input. */
+    getAttrValueMap?: () => {
+        [key: string]: string;
+    };
+    /** Attribute label for strings unassociated with one of the provided listed attributes. */
+    hasWordsAttrLabel?: React.ReactNode;
+    /** Flag for toggling the open/close state of the advanced search menu. */
+    isSearchMenuOpen?: boolean;
+    /** A callback for when the input value changes. */
+    onChange?: (event: React.FormEvent<HTMLInputElement>, value: string) => void;
+    /** A callback for when the user clicks the clear button. */
+    onClear?: (event: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /** A callback for when the search button is clicked. */
+    onSearch?: (event: React.SyntheticEvent<HTMLButtonElement>, value: string, attrValueMap: {
+        [key: string]: string;
+    }) => void;
+    /** A callback for when the open advanced search button is clicked. */
+    onToggleAdvancedMenu?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /** Ref of the input element within the search input. */
+    parentInputRef?: React.RefObject<any>;
+    /** Ref of the div wrapping the whole search input. */
+    parentRef?: React.RefObject<any>;
+    /** Label for the button which resets the advanced search form and clears the search input. */
+    resetButtonLabel?: string;
+    /** Label for the button which calls the onSearch event handler. */
+    submitSearchButtonLabel?: string;
+    /** Value of the search input. */
+    value?: string;
+}
+export declare const AdvancedSearchMenu: React.FunctionComponent<AdvancedSearchMenuProps>;
+//# sourceMappingURL=AdvancedSearchMenu.d.ts.map

package/components/SearchInput/AdvancedSearchMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdvancedSearchMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/SearchInput/AdvancedSearchMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAI3D,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAChG;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,gFAAgF;IAChF,UAAU,CAAC,EAAE,MAAM,EAAE,GAAG,0BAA0B,EAAE,CAAC;IACrD,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC,6FAA6F;IAC7F,eAAe,CAAC,EAAE,MAAM;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAClD,2FAA2F;IAC3F,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACpC,0EAA0E;IAC1E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mDAAmD;IACnD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7E,4DAA4D;IAC5D,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACnE,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAC9C,KAAK,EAAE,MAAM,EACb,YAAY,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,KACpC,IAAI,CAAC;IACV,sEAAsE;IACtE,oBAAoB,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC5E,wDAAwD;IACxD,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACtC,sDAAsD;IACtD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACjC,8FAA8F;IAC9F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,mEAAmE;IACnE,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CAmL/E,CAAC"}

package/components/SearchInput/AdvancedSearchMenu.js

@@ -0,0 +1,115 @@
+import * as React from 'react';
+import { Button } from '../Button';
+import { ActionGroup, Form, FormGroup } from '../Form';
+import { TextInput } from '../TextInput';
+import { GenerateId, KeyTypes } from '../../helpers';
+import { Panel, PanelMain, PanelMainBody } from '../Panel';
+import { css } from '@patternfly/react-styles';
+export const AdvancedSearchMenu = ({ className, parentRef, parentInputRef, value = '', attributes = [], formAdditionalItems, hasWordsAttrLabel = 'Has words', advancedSearchDelimiter, getAttrValueMap, onChange, onSearch, onClear, resetButtonLabel = 'Reset', submitSearchButtonLabel = 'Search', isSearchMenuOpen, onToggleAdvancedMenu }) => {
+    const firstAttrRef = React.useRef(null);
+    const [putFocusBackOnInput, setPutFocusBackOnInput] = React.useState(false);
+    React.useEffect(() => {
+        if (attributes.length > 0 && !advancedSearchDelimiter) {
+            // eslint-disable-next-line no-console
+            console.error('AdvancedSearchMenu: An advancedSearchDelimiter prop is required when advanced search attributes are provided using the attributes prop');
+        }
+    });
+    React.useEffect(() => {
+        if (isSearchMenuOpen && firstAttrRef && firstAttrRef.current) {
+            firstAttrRef.current.focus();
+            setPutFocusBackOnInput(true);
+        }
+        else if (!isSearchMenuOpen && putFocusBackOnInput && parentInputRef && parentInputRef.current) {
+            parentInputRef.current.focus();
+        }
+    }, [isSearchMenuOpen]);
+    React.useEffect(() => {
+        document.addEventListener('mousedown', onDocClick);
+        document.addEventListener('touchstart', onDocClick);
+        document.addEventListener('keydown', onEscPress);
+        return function cleanup() {
+            document.removeEventListener('mousedown', onDocClick);
+            document.removeEventListener('touchstart', onDocClick);
+            document.removeEventListener('keydown', onEscPress);
+        };
+    });
+    const onDocClick = (event) => {
+        const clickedWithinSearchInput = parentRef && parentRef.current.contains(event.target);
+        if (isSearchMenuOpen && !clickedWithinSearchInput) {
+            onToggleAdvancedMenu(event);
+        }
+    };
+    const onEscPress = (event) => {
+        if (isSearchMenuOpen &&
+            event.key === KeyTypes.Escape &&
+            parentRef &&
+            parentRef.current.contains(event.target)) {
+            onToggleAdvancedMenu(event);
+            if (parentInputRef) {
+                parentInputRef.current.focus();
+            }
+        }
+    };
+    const onSearchHandler = (event) => {
+        event.preventDefault();
+        if (onSearch) {
+            onSearch(event, value, getAttrValueMap());
+        }
+        if (isSearchMenuOpen) {
+            onToggleAdvancedMenu(event);
+        }
+    };
+    const handleValueChange = (attribute, newValue, event) => {
+        const newMap = getAttrValueMap();
+        newMap[attribute] = newValue;
+        let updatedValue = '';
+        Object.entries(newMap).forEach(([k, v]) => {
+            if (v.trim() !== '') {
+                /* Wrap the value in quotes if it contains spaces */
+                const quoteWrappedValue = v.includes(' ') ? `'${v.replace(/(^'|'$)/g, '')}'` : v;
+                if (k !== 'haswords') {
+                    updatedValue = `${updatedValue} ${k}${advancedSearchDelimiter}${quoteWrappedValue}`;
+                }
+                else {
+                    updatedValue = `${updatedValue} ${quoteWrappedValue}`;
+                }
+            }
+        });
+        if (onChange) {
+            onChange(event, updatedValue.replace(/^\s+/g, ''));
+        }
+    };
+    const getValue = (attribute) => {
+        const map = getAttrValueMap();
+        return map.hasOwnProperty(attribute) ? map[attribute] : '';
+    };
+    const buildFormGroups = () => {
+        const formGroups = [];
+        attributes.forEach((attribute, index) => {
+            const display = typeof attribute === 'string' ? attribute : attribute.display;
+            const queryAttr = typeof attribute === 'string' ? attribute : attribute.attr;
+            if (index === 0) {
+                formGroups.push(React.createElement(FormGroup, { label: display, fieldId: `${queryAttr}_${index}`, key: `${attribute}_${index}` },
+                    React.createElement(TextInput, { ref: firstAttrRef, type: "text", id: `${queryAttr}_${index}`, value: getValue(queryAttr), onChange: (value, evt) => handleValueChange(queryAttr, value, evt) })));
+            }
+            else {
+                formGroups.push(React.createElement(FormGroup, { label: display, fieldId: `${queryAttr}_${index}`, key: `${attribute}_${index}` },
+                    React.createElement(TextInput, { type: "text", id: `${queryAttr}_${index}`, value: getValue(queryAttr), onChange: (value, evt) => handleValueChange(queryAttr, value, evt) })));
+            }
+        });
+        formGroups.push(React.createElement(GenerateId, { key: 'hasWords' }, randomId => (React.createElement(FormGroup, { label: hasWordsAttrLabel, fieldId: randomId },
+            React.createElement(TextInput, { type: "text", id: randomId, value: getValue('haswords'), onChange: (value, evt) => handleValueChange('haswords', value, evt) })))));
+        return formGroups;
+    };
+    return isSearchMenuOpen ? (React.createElement(Panel, { variant: "raised", className: css(className) },
+        React.createElement(PanelMain, null,
+            React.createElement(PanelMainBody, null,
+                React.createElement(Form, null,
+                    buildFormGroups(),
+                    formAdditionalItems ? formAdditionalItems : null,
+                    React.createElement(ActionGroup, null,
+                        React.createElement(Button, { variant: "primary", type: "submit", onClick: onSearchHandler, isDisabled: !value }, submitSearchButtonLabel),
+                        !!onClear && (React.createElement(Button, { variant: "link", type: "reset", onClick: onClear }, resetButtonLabel)))))))) : null;
+};
+AdvancedSearchMenu.displayName = 'SearchInput';
+//# sourceMappingURL=AdvancedSearchMenu.js.map

package/components/SearchInput/AdvancedSearchMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdvancedSearchMenu.js","sourceRoot":"","sources":["../../../../src/components/SearchInput/AdvancedSearchMenu.tsx"],"names":[],"mappings":"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"}

package/components/SearchInput/SearchInput.d.ts

@@ -0,0 +1,101 @@
+import * as React from 'react';
+/** Properties for adding search attributes to an advanced search input. These properties must
+ * be passed in as an object within an array to the search input component's attribute properrty.
+ */
+export interface SearchInputSearchAttribute {
+    /** The search attribute's value to be provided in the search input's query string.
+     * It should have no spaces and be unique for every attribute.
+     */
+    attr: string;
+    /** The search attribute's display name. It is used to label the field in the advanced
+     * search menu.
+     */
+    display: React.ReactNode;
+}
+/** Properties for creating an expandable search input. These properties should be passed into
+ * the search input component's expandableInput property.
+ */
+export interface SearchInputExpandable {
+    /** Flag to indicate if the search input is expanded. */
+    isExpanded: boolean;
+    /** Callback function to toggle the expandable search input. */
+    onToggleExpand: (event: React.SyntheticEvent<HTMLButtonElement>, isExpanded: boolean) => void;
+    /** An accessible label for the expandable search input toggle. */
+    toggleAriaLabel: string;
+}
+/** The main search input component. */
+export interface SearchInputProps extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange' | 'results' | 'ref'> {
+    /** Delimiter in the query string for pairing attributes with search values.
+     * Required whenever attributes are passed as props.
+     */
+    advancedSearchDelimiter?: string;
+    /** The container to append the menu to.
+     * If your menu is being cut off you can append it to an element higher up the DOM tree.
+     * Some examples:
+     * appendTo={() => document.body}
+     * appendTo={document.getElementById('target')}
+     */
+    appendTo?: HTMLElement | (() => HTMLElement) | 'inline';
+    /** An accessible label for the search input. */
+    'aria-label'?: string;
+    /** Array of attribute values used for dynamically generated advanced search. */
+    attributes?: string[] | SearchInputSearchAttribute[];
+    /** Additional classes added to the search input. */
+    className?: string;
+    /** Object that makes the search input expandable/collapsible. */
+    expandableInput?: SearchInputExpandable;
+    formAdditionalItems?: React.ReactNode;
+    /** Attribute label for strings unassociated with one of the provided listed attributes. */
+    hasWordsAttrLabel?: React.ReactNode;
+    /** A suggestion for autocompleting. */
+    hint?: string;
+    /** Type of the input */
+    type?: 'text' | 'date' | 'datetime-local' | 'email' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'time' | 'url';
+    /** @hide A reference object to attach to the input box. */
+    innerRef?: React.RefObject<any>;
+    /** A flag for controlling the open state of a custom advanced search implementation. */
+    isAdvancedSearchOpen?: boolean;
+    /** Flag indicating if search input is disabled. */
+    isDisabled?: boolean;
+    /** Flag indicating if the next navigation button is disabled. */
+    isNextNavigationButtonDisabled?: boolean;
+    /** Flag indicating if the previous navigation button is disabled. */
+    isPreviousNavigationButtonDisabled?: boolean;
+    /** Accessible label for the button to navigate to next result. */
+    nextNavigationButtonAriaLabel?: string;
+    /** A callback for when the input value changes. */
+    onChange?: (event: React.FormEvent<HTMLInputElement>, value: string) => void;
+    /** A callback for when the user clicks the clear button. */
+    onClear?: (event: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /** A callback for when the user clicks to navigate to next result. */
+    onNextClick?: (event: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /** A callback for when the user clicks to navigate to previous result. */
+    onPreviousClick?: (event: React.SyntheticEvent<HTMLButtonElement>) => void;
+    /** A callback for when the search button is clicked. */
+    onSearch?: (event: React.SyntheticEvent<HTMLButtonElement>, value: string, attrValueMap: {
+        [key: string]: string;
+    }) => void;
+    /** A callback for when the open advanced search button is clicked. */
+    onToggleAdvancedSearch?: (event: React.SyntheticEvent<HTMLButtonElement>, isOpen?: boolean) => void;
+    /** Accessible label for the button which opens the advanced search form menu. */
+    openMenuButtonAriaLabel?: string;
+    /** Placeholder text of the search input. */
+    placeholder?: string;
+    /** Accessible label for the button to navigate to previous result. */
+    previousNavigationButtonAriaLabel?: string;
+    /** z-index of the advanced search form when appendTo is not inline. */
+    zIndex?: number;
+    /** Label for the button which resets the advanced search form and clears the search input. */
+    resetButtonLabel?: string;
+    /** The number of search results returned. Either a total number of results,
+     * or a string representing the current result over the total number of results. i.e. "1 / 5". */
+    resultsCount?: number | string;
+    /** Label for the button which calls the onSearch event handler. */
+    submitSearchButtonLabel?: string;
+    /** Value of the search input. */
+    value?: string;
+    /** Name attribue for the search input */
+    name?: string;
+}
+export declare const SearchInput: React.ForwardRefExoticComponent<SearchInputProps & React.RefAttributes<HTMLInputElement>>;
+//# sourceMappingURL=SearchInput.d.ts.map

package/components/SearchInput/SearchInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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"}

package/components/SearchInput/SearchInput.js

@@ -0,0 +1,188 @@
+import { __rest } from "tslib";
+import * as React from 'react';
+import { css } from '@patternfly/react-styles';
+import { Button, ButtonVariant } from '../Button';
+import { Badge } from '../Badge';
+import AngleDownIcon from '@patternfly/react-icons/dist/esm/icons/angle-down-icon';
+import AngleUpIcon from '@patternfly/react-icons/dist/esm/icons/angle-up-icon';
+import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
+import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
+import CaretDownIcon from '@patternfly/react-icons/dist/esm/icons/caret-down-icon';
+import ArrowRightIcon from '@patternfly/react-icons/dist/esm/icons/arrow-right-icon';
+import { AdvancedSearchMenu } from './AdvancedSearchMenu';
+import { TextInputGroup, TextInputGroupMain, TextInputGroupUtilities } from '../TextInputGroup';
+import { InputGroup } from '../InputGroup';
+import { Popper } from '../../helpers';
+const SearchInputBase = (_a) => {
+    var { className, value = '', attributes = [], formAdditionalItems, hasWordsAttrLabel = 'Has words', advancedSearchDelimiter, placeholder, hint, onChange, onSearch, onClear, onToggleAdvancedSearch, isAdvancedSearchOpen, resultsCount, onNextClick, onPreviousClick, innerRef, expandableInput, 'aria-label': ariaLabel = 'Search input', resetButtonLabel = 'Reset', openMenuButtonAriaLabel = 'Open advanced search', previousNavigationButtonAriaLabel = 'Previous', isPreviousNavigationButtonDisabled = false, isNextNavigationButtonDisabled = false, nextNavigationButtonAriaLabel = 'Next', submitSearchButtonLabel = 'Search', isDisabled = false, appendTo, zIndex = 9999, type = 'text', name } = _a, props = __rest(_a, ["className", "value", "attributes", "formAdditionalItems", "hasWordsAttrLabel", "advancedSearchDelimiter", "placeholder", "hint", "onChange", "onSearch", "onClear", "onToggleAdvancedSearch", "isAdvancedSearchOpen", "resultsCount", "onNextClick", "onPreviousClick", "innerRef", "expandableInput", 'aria-label', "resetButtonLabel", "openMenuButtonAriaLabel", "previousNavigationButtonAriaLabel", "isPreviousNavigationButtonDisabled", "isNextNavigationButtonDisabled", "nextNavigationButtonAriaLabel", "submitSearchButtonLabel", "isDisabled", "appendTo", "zIndex", "type", "name"]);
+    const [isSearchMenuOpen, setIsSearchMenuOpen] = React.useState(false);
+    const [searchValue, setSearchValue] = React.useState(value);
+    const searchInputRef = React.useRef(null);
+    const ref = React.useRef(null);
+    const searchInputInputRef = innerRef || ref;
+    const searchInputExpandableToggleRef = React.useRef(null);
+    const [focusAfterExpandChange, setFocusAfterExpandChange] = React.useState(false);
+    const { isExpanded, onToggleExpand, toggleAriaLabel } = expandableInput || {};
+    React.useEffect(() => {
+        var _a, _b;
+        // this effect and the focusAfterExpandChange variable are needed to focus the input/toggle as needed when the
+        // expansion toggle is fired without focusing on mount
+        if (!focusAfterExpandChange) {
+            return;
+        }
+        else if (isExpanded) {
+            (_a = searchInputInputRef === null || searchInputInputRef === void 0 ? void 0 : searchInputInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+        else {
+            (_b = searchInputExpandableToggleRef === null || searchInputExpandableToggleRef === void 0 ? void 0 : searchInputExpandableToggleRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+        setFocusAfterExpandChange(false);
+    }, [focusAfterExpandChange, isExpanded, searchInputInputRef, searchInputExpandableToggleRef]);
+    React.useEffect(() => {
+        setSearchValue(value);
+    }, [value]);
+    React.useEffect(() => {
+        if (attributes.length > 0 && !advancedSearchDelimiter) {
+            // eslint-disable-next-line no-console
+            console.error('An advancedSearchDelimiter prop is required when advanced search attributes are provided using the attributes prop');
+        }
+    });
+    React.useEffect(() => {
+        setIsSearchMenuOpen(isAdvancedSearchOpen);
+    }, [isAdvancedSearchOpen]);
+    const onChangeHandler = (event, value) => {
+        if (onChange) {
+            onChange(event, value);
+        }
+        setSearchValue(value);
+    };
+    const onToggle = (e) => {
+        const isOpen = !isSearchMenuOpen;
+        setIsSearchMenuOpen(isOpen);
+        if (onToggleAdvancedSearch) {
+            onToggleAdvancedSearch(e, isOpen);
+        }
+    };
+    const onSearchHandler = (event) => {
+        event.preventDefault();
+        if (onSearch) {
+            onSearch(event, value, getAttrValueMap());
+        }
+        setIsSearchMenuOpen(false);
+    };
+    const splitStringExceptInQuotes = (str) => {
+        let quoteType;
+        return str.match(/\\?.|^$/g).reduce((p, c) => {
+            if (c === "'" || c === '"') {
+                if (!quoteType) {
+                    quoteType = c;
+                }
+                if (c === quoteType) {
+                    p.quote = !p.quote;
+                }
+            }
+            else if (!p.quote && c === ' ') {
+                p.a.push('');
+            }
+            else {
+                p.a[p.a.length - 1] += c.replace(/\\(.)/, '$1');
+            }
+            return p;
+        }, { a: [''] }).a;
+    };
+    const getAttrValueMap = () => {
+        const attrValue = {};
+        const pairs = splitStringExceptInQuotes(searchValue);
+        pairs.map((pair) => {
+            const splitPair = pair.split(advancedSearchDelimiter);
+            if (splitPair.length === 2) {
+                attrValue[splitPair[0]] = splitPair[1].replace(/(^'|'$)/g, '');
+            }
+            else if (splitPair.length === 1) {
+                attrValue.haswords = attrValue.hasOwnProperty('haswords')
+                    ? `${attrValue.haswords} ${splitPair[0]}`
+                    : splitPair[0];
+            }
+        });
+        return attrValue;
+    };
+    const onEnter = (event) => {
+        if (event.key === 'Enter') {
+            onSearchHandler(event);
+        }
+    };
+    const onClearInput = (e) => {
+        if (onClear) {
+            onClear(e);
+        }
+        if (searchInputInputRef && searchInputInputRef.current) {
+            searchInputInputRef.current.focus();
+        }
+    };
+    const onExpandHandler = (event) => {
+        setSearchValue('');
+        onToggleExpand(event, isExpanded);
+        setFocusAfterExpandChange(true);
+    };
+    const renderUtilities = value && (resultsCount || (!!onNextClick && !!onPreviousClick) || (!!onClear && !expandableInput));
+    const buildTextInputGroup = (_a = {}) => {
+        var searchInputProps = __rest(_a, []);
+        return (React.createElement(TextInputGroup, Object.assign({ isDisabled: isDisabled }, searchInputProps),
+            React.createElement(TextInputGroupMain, { hint: hint, icon: React.createElement(SearchIcon, null), innerRef: searchInputInputRef, value: searchValue, placeholder: placeholder, "aria-label": ariaLabel, onKeyDown: onEnter, onChange: onChangeHandler, type: type, name: name }),
+            renderUtilities && (React.createElement(TextInputGroupUtilities, null,
+                resultsCount && React.createElement(Badge, { isRead: true }, resultsCount),
+                !!onNextClick && !!onPreviousClick && (React.createElement("div", { className: "pf-c-text-input-group__group" },
+                    React.createElement(Button, { variant: ButtonVariant.plain, "aria-label": previousNavigationButtonAriaLabel, isDisabled: isDisabled || isPreviousNavigationButtonDisabled, onClick: onPreviousClick },
+                        React.createElement(AngleUpIcon, null)),
+                    React.createElement(Button, { variant: ButtonVariant.plain, "aria-label": nextNavigationButtonAriaLabel, isDisabled: isDisabled || isNextNavigationButtonDisabled, onClick: onNextClick },
+                        React.createElement(AngleDownIcon, null)))),
+                !!onClear && !expandableInput && (React.createElement(Button, { variant: ButtonVariant.plain, isDisabled: isDisabled, "aria-label": resetButtonLabel, onClick: onClearInput },
+                    React.createElement(TimesIcon, null)))))));
+    };
+    const expandableToggle = (React.createElement(Button, { variant: ButtonVariant.plain, "aria-label": toggleAriaLabel, "aria-expanded": isExpanded, icon: isExpanded ? React.createElement(TimesIcon, null) : React.createElement(SearchIcon, null), onClick: onExpandHandler, ref: searchInputExpandableToggleRef }));
+    const buildExpandableSearchInput = (_a = {}) => {
+        var searchInputProps = __rest(_a, []);
+        return (React.createElement(InputGroup, Object.assign({}, searchInputProps),
+            buildTextInputGroup(),
+            expandableToggle));
+    };
+    const buildSearchTextInputGroup = (_a = {}) => {
+        var searchInputProps = __rest(_a, []);
+        if (expandableInput) {
+            return buildExpandableSearchInput(Object.assign({}, searchInputProps));
+        }
+        return buildTextInputGroup(Object.assign({}, searchInputProps));
+    };
+    const buildSearchTextInputGroupWithExtraButtons = (_a = {}) => {
+        var searchInputProps = __rest(_a, []);
+        return (React.createElement(InputGroup, Object.assign({}, searchInputProps),
+            buildTextInputGroup(),
+            (attributes.length > 0 || onToggleAdvancedSearch) && (React.createElement(Button, { className: isSearchMenuOpen && 'pf-m-expanded', variant: ButtonVariant.control, "aria-label": openMenuButtonAriaLabel, onClick: onToggle, isDisabled: isDisabled, "aria-expanded": isSearchMenuOpen },
+                React.createElement(CaretDownIcon, null))),
+            !!onSearch && (React.createElement(Button, { type: "submit", variant: ButtonVariant.control, "aria-label": submitSearchButtonLabel, onClick: onSearchHandler, isDisabled: isDisabled },
+                React.createElement(ArrowRightIcon, null))),
+            expandableInput && expandableToggle));
+    };
+    const searchInputProps = Object.assign(Object.assign({}, props), { className: className && css(className), innerRef: searchInputRef });
+    if (!!expandableInput && !isExpanded) {
+        return React.createElement(InputGroup, Object.assign({}, searchInputProps), expandableToggle);
+    }
+    if (!!onSearch || attributes.length > 0 || !!onToggleAdvancedSearch) {
+        if (attributes.length > 0) {
+            const AdvancedSearch = (React.createElement("div", null,
+                React.createElement(AdvancedSearchMenu, { value: value, parentRef: searchInputRef, parentInputRef: searchInputInputRef, onSearch: onSearch, onClear: onClear, onChange: onChange, onToggleAdvancedMenu: onToggle, resetButtonLabel: resetButtonLabel, submitSearchButtonLabel: submitSearchButtonLabel, attributes: attributes, formAdditionalItems: formAdditionalItems, hasWordsAttrLabel: hasWordsAttrLabel, advancedSearchDelimiter: advancedSearchDelimiter, getAttrValueMap: getAttrValueMap, isSearchMenuOpen: isSearchMenuOpen })));
+            const AdvancedSearchWithPopper = (React.createElement("div", Object.assign({ className: css(className), ref: searchInputRef }, props),
+                React.createElement(Popper, { trigger: buildSearchTextInputGroupWithExtraButtons(), popper: AdvancedSearch, isVisible: isSearchMenuOpen, enableFlip: true, appendTo: () => appendTo || searchInputRef.current, zIndex: zIndex })));
+            const AdvancedSearchInline = (React.createElement("div", Object.assign({ className: css(className), ref: searchInputRef }, props),
+                buildSearchTextInputGroupWithExtraButtons(),
+                AdvancedSearch));
+            return appendTo !== 'inline' ? AdvancedSearchWithPopper : AdvancedSearchInline;
+        }
+        return buildSearchTextInputGroupWithExtraButtons(Object.assign({}, searchInputProps));
+    }
+    return buildSearchTextInputGroup(searchInputProps);
+};
+SearchInputBase.displayName = 'SearchInputBase';
+export const SearchInput = React.forwardRef((props, ref) => (React.createElement(SearchInputBase, Object.assign({}, props, { innerRef: ref }))));
+SearchInput.displayName = 'SearchInput';
+//# sourceMappingURL=SearchInput.js.map