carbon-react 118.1.0 → 118.1.1

package/esm/__internal__/filter-object-properties/filter-object-properties.d.ts

@@ -1 +1 @@
-export default function filterObjectProperties(originalObject: any, keyList: any): {};
+export default function filterObjectProperties<T extends object>(originalObject: T, keyList: string[]): Partial<T>;

package/esm/components/pager/pager.component.js

@@ -101,12 +101,12 @@ const Pager = ({
       onPrevious(e);
     }
   }, [page, onPrevious]);
-  const handleOnPagination = useCallback(e => {
-    setValue(e.target.value);
-    setCurrentPageSize(+e.target.value);
-    onPagination(1, +e.target.value, "page-select");
+  const handleOnPagination = useCallback(selectedValue => {
+    setValue(selectedValue);
+    setCurrentPageSize(+selectedValue);
+    onPagination(1, +selectedValue, "page-select");
   }, [onPagination]);
-  const handleKeyDown = useCallback(e => Events.isEnterKey(e) && handleOnPagination(e), [handleOnPagination]);
+  const handleKeyDown = useCallback(e => Events.isEnterKey(e) && handleOnPagination(e.target.value), [handleOnPagination]);
 
   const sizeSelector = () => {
     return /*#__PURE__*/React.createElement(StyledSelectContainer, null, /*#__PURE__*/React.createElement(Select, {

package/esm/components/pill/pill.component.d.ts

@@ -14,11 +14,13 @@ export interface PillProps extends StyledPillProps {
     /** Callback function for when the pill is clicked. */
     onClick?: (ev: React.MouseEvent<HTMLSpanElement>) => void;
     /** Callback function for when the remove icon is clicked. */
-    onDelete?: (ev: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement>) => void;
+    onDelete?: (ev?: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement>) => void;
     /** Sets the type of pill in use. */
     pillRole?: "tag" | "status";
     /** Sets custom aria-label attribute on the remove button */
     ariaLabelOfRemoveButton?: string;
+    /** @private @ignore title attribute passed down to underlying element */
+    title?: string;
 }
 export declare const Pill: ({ wrapText, borderColor, colorVariant, children, fill, maxWidth, onClick, onDelete, pillRole, size, ariaLabelOfRemoveButton, ...rest }: PillProps) => JSX.Element;
 export default Pill;

package/esm/components/pill/pill.component.js

@@ -247,6 +247,7 @@ Pill.propTypes = {
       "smallOverlay": PropTypes.number.isRequired
     })
   }),
+  "title": PropTypes.string,
   "wrapText": PropTypes.bool
 };
 export { Pill };

package/esm/components/select/__internal__/select-list-context.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+declare type SelectListContextProps = {
+    currentOptionsListIndex?: number;
+    multiselectValues?: (string | Record<string, unknown>)[];
+};
+declare const SelectListContext: React.Context<SelectListContextProps>;
+export default SelectListContext;

package/esm/components/select/__internal__/select-text/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./select-text.component";
+export type { SelectTextProps } from "./select-text.component";

package/esm/components/select/__internal__/select-text/index.js

@@ -0,0 +1 @@
+export { default } from "./select-text.component";

package/esm/components/select/__internal__/select-text/select-text.component.d.ts

@@ -0,0 +1,33 @@
+import React from "react";
+export interface SelectTextProps {
+    /** If true the Component will be disabled */
+    disabled?: boolean;
+    /** Value to be displayed */
+    formattedValue?: string;
+    /** Label id passed from Select component  */
+    labelId?: string;
+    /** If true, the list is displayed */
+    isOpen?: boolean;
+    /** Callback function for when the Select Textbox loses it's focus. */
+    onBlur?: (ev: React.FocusEvent<HTMLElement>) => void;
+    /** Callback function for when the component is clicked. */
+    onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** Callback function for when the Select Textbox is focused. */
+    onFocus?: (ev: React.FocusEvent<HTMLElement>) => void;
+    /** Callback function for when the key is pressed when focused on Select Text. */
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLElement>) => void;
+    /** Callback function for when the left mouse key is pressed when focused on Select Text. */
+    onMouseDown?: (ev: React.MouseEvent<HTMLElement>) => void;
+    /** Placeholder string to be displayed when formattedValue is empty */
+    placeholder?: string;
+    /** If true the Component will be read-only */
+    readOnly?: boolean;
+    /** If true the component has no border and a transparent background */
+    transparent?: boolean;
+    /** Id of the Select Text element */
+    textId?: string;
+    /** Component size */
+    size?: "small" | "medium" | "large";
+}
+declare const SelectText: ({ disabled, formattedValue, onClick, onKeyDown, onMouseDown, placeholder, readOnly, textId, transparent, size, }: SelectTextProps) => JSX.Element;
+export default SelectText;

package/esm/components/select/__internal__/select-text/select-text.component.js

@@ -15,57 +15,37 @@ const SelectText = ({
   size = "medium"
 }) => {
   const hasPlaceholder = !disabled && !readOnly && !formattedValue;
-
-  function handleClick(event) {
-    onClick(event);
-  }
-
   return /*#__PURE__*/React.createElement(StyledSelectText, {
     "aria-hidden": true,
     "data-element": "select-text",
     disabled: disabled,
     hasPlaceholder: hasPlaceholder,
     id: textId,
-    onClick: handleClick,
+    onClick: onClick,
     onKeyDown: onKeyDown,
     onMouseDown: onMouseDown,
     readOnly: readOnly,
     role: "button",
-    tabIndex: "-1",
+    tabIndex: -1,
     transparent: transparent,
     size: size
   }, hasPlaceholder ? placeholder : formattedValue);
 };
 
 SelectText.propTypes = {
-  /** If true the Component will be disabled */
-  disabled: PropTypes.bool,
-
-  /** Value to be displayed */
-  formattedValue: PropTypes.string,
-
-  /** Callback function for when the component is clicked. */
-  onClick: PropTypes.func,
-
-  /** Callback function for when the key is pressed when focused on Select Text. */
-  onKeyDown: PropTypes.func,
-
-  /** Callback function for when the left mouse key is pressed when focused on Select Text. */
-  onMouseDown: PropTypes.func,
-
-  /** Placeholder string to be displayed when formattedValue is empty */
-  placeholder: PropTypes.string,
-
-  /** If true the Component will be read-only */
-  readOnly: PropTypes.bool,
-
-  /** If true the component has no border and a transparent background */
-  transparent: PropTypes.bool,
-
-  /** Id of the Select Text element */
-  textId: PropTypes.string,
-
-  /** Component size */
-  size: PropTypes.string
+  "disabled": PropTypes.bool,
+  "formattedValue": PropTypes.string,
+  "isOpen": PropTypes.bool,
+  "labelId": PropTypes.string,
+  "onBlur": PropTypes.func,
+  "onClick": PropTypes.func,
+  "onFocus": PropTypes.func,
+  "onKeyDown": PropTypes.func,
+  "onMouseDown": PropTypes.func,
+  "placeholder": PropTypes.string,
+  "readOnly": PropTypes.bool,
+  "size": PropTypes.oneOf(["large", "medium", "small"]),
+  "textId": PropTypes.string,
+  "transparent": PropTypes.bool
 };
 export default SelectText;

package/esm/components/select/__internal__/select-text/select-text.style.d.ts

@@ -1,2 +1,7 @@
+import { SelectTextProps } from ".";
+interface StyledSelectTextProps extends Pick<SelectTextProps, "disabled" | "readOnly" | "transparent"> {
+    hasPlaceholder: boolean;
+    size: NonNullable<SelectTextProps["size"]>;
+}
+declare const StyledSelectText: import("styled-components").StyledComponent<"span", any, StyledSelectTextProps, never>;
 export default StyledSelectText;
-declare const StyledSelectText: import("styled-components").StyledComponent<"span", any, {}, never>;

package/esm/components/select/filterable-select/filterable-select.component.d.ts

@@ -0,0 +1,65 @@
+import React from "react";
+import { Side } from "@floating-ui/dom";
+import { ButtonProps } from "../../button";
+import { FormInputPropTypes } from "../select-textbox";
+export interface FilterableSelectProps extends Omit<FormInputPropTypes, "defaultValue" | "value"> {
+    /** Prop to specify the aria-label attribute of the component input */
+    "aria-label"?: string;
+    /** Prop to specify the aria-labeledby property of the component input */
+    "aria-labelledby"?: string;
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-component"?: string;
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-element"?: string;
+    /** Identifier used for testing purposes, applied to the root element of the component. */
+    "data-role"?: string;
+    /** Child components (such as Option or OptionRow) for the SelectList */
+    children: React.ReactNode;
+    /** The default selected value(s), when the component is operating in uncontrolled mode */
+    defaultValue?: string | Record<string, unknown>;
+    /** Boolean to toggle where SelectList is rendered in relation to the Select Input */
+    disablePortal?: boolean;
+    /** If true the loader animation is displayed in the option list */
+    isLoading?: boolean;
+    /** True for default text button or a Button Component to be rendered */
+    listActionButton?: boolean | React.ReactElement<ButtonProps>;
+    /** When true component will work in multi column mode.
+     * Children should consist of OptionRow components in this mode
+     */
+    multiColumn?: boolean;
+    /** A custom message to be displayed when any option does not match the filter text */
+    noResultsMessage?: string;
+    /** A custom callback for when the input text changes */
+    onFilterChange?: (filterText: string) => void;
+    /** A custom callback for when the dropdown menu opens */
+    onOpen?: () => void;
+    /** A callback for when the Action Button is triggered */
+    onListAction?: () => void;
+    /** A callback that is triggered when a user scrolls to the bottom of the list */
+    onListScrollBottom?: () => void;
+    /** If true the Component opens on focus */
+    openOnFocus?: boolean;
+    /** SelectList table header, should consist of multiple th elements.
+     * Works only in multiColumn mode
+     */
+    tableHeader?: React.ReactNode;
+    /** The selected value(s), when the component is operating in controlled mode */
+    value?: string | Record<string, unknown>;
+    /** Overrides the default tooltip position */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** Maximum list height - defaults to 180 */
+    listMaxHeight?: number;
+    /** Placement of the select list in relation to the input element */
+    listPlacement?: Side;
+    /** Use the opposite list placement if the set placement does not fit */
+    flipEnabled?: boolean;
+    /** Set this prop to enable a virtualised list of options. If it is not used then all options will be in the
+     * DOM at all times, which may cause performance problems on very large lists */
+    enableVirtualScroll?: boolean;
+    /** The number of options to render into the DOM at once, either side of the currently-visible ones.
+     * Higher values make for smoother scrolling but may impact performance.
+     * Only used if the `enableVirtualScroll` prop is set. */
+    virtualScrollOverscan?: number;
+}
+export declare const FilterableSelect: React.ForwardRefExoticComponent<FilterableSelectProps & React.RefAttributes<unknown>>;
+export default FilterableSelect;