carbon-react 105.1.0 → 105.2.0

package/esm/__internal__/tooltip-provider/index.d.ts

@@ -1,26 +1,21 @@
-import * as React from "react";
-
-export interface ToolbarContextProps {
-  tooltipPosition: "top" | "bottom" | "left" | "right";
+import React from "react";
+interface TooltipProviderProps {
+    /** The position to display the tooltip */
+    tooltipPosition?: "top" | "bottom" | "left" | "right";
+    /** Control whether the tooltip is visible */
+    children: React.ReactNode;
+    /** Aria label for rendered help component */
+    helpAriaLabel?: string;
+    focusable?: boolean;
+    tooltipVisible?: boolean;
+    disabled?: boolean;
+    target?: Element;
 }
-
-export interface TooltipProviderProps {
-  /** The position to display the tooltip */
-  tooltipPosition?: "top" | "bottom" | "left" | "right";
-  /** Control whether the tooltip is visible */
-  children: React.ReactNode;
-  /** Aria label for rendered help component */
-  helpAriaLabel?: string;
-  focusable?: boolean;
-  tooltipVisible?: boolean;
-  disabled?: boolean;
-  target?: Element;
+interface ToolbarContextProps extends Omit<TooltipProviderProps, "children"> {
+    tooltipId?: {
+        current: string;
+    };
 }
-
-declare const ToolbarContext: React.Context<ToolbarContextProps>;
-
-declare function TooltipProvider(props: TooltipProviderProps): JSX.Element;
-
-export { ToolbarContext };
-
-export default TooltipProvider;
+export declare const TooltipContext: React.Context<ToolbarContextProps>;
+export declare const TooltipProvider: ({ children, tooltipPosition, helpAriaLabel, focusable, tooltipVisible, disabled, target, }: TooltipProviderProps) => JSX.Element;
+export {};

package/esm/__internal__/tooltip-provider/index.js

@@ -1,5 +1,4 @@
 import React, { useRef } from "react";
-import PropTypes from "prop-types";
 import guid from "../utils/helpers/guid/guid";
 export const TooltipContext = /*#__PURE__*/React.createContext({});
 export const TooltipProvider = ({
@@ -23,13 +22,4 @@ export const TooltipProvider = ({
       target
     }
   }, children);
-};
-TooltipProvider.propTypes = {
-  children: PropTypes.node.isRequired,
-  tooltipPosition: PropTypes.oneOf(["top", "bottom", "left", "right"]),
-  helpAriaLabel: PropTypes.string,
-  focusable: PropTypes.bool,
-  tooltipVisible: PropTypes.bool,
-  disabled: PropTypes.bool,
-  target: PropTypes.instanceOf(Element)
 };

package/esm/__spec_helper__/mock-match-media.d.ts

@@ -1,4 +1,6 @@
 declare function setup(): void;
-declare function mockMatchMedia(matches?: boolean): jest.Mock;
+declare function mockMatchMedia(
+  matches?: boolean
+): { removeListener: jest.Mock };
 
 export { setup, mockMatchMedia };

package/esm/components/app-wrapper/app-wrapper.component.d.ts

@@ -11,6 +11,10 @@ declare class AppWrapper extends React.Component<any, any, any> {
      * @return {String}
      */
     classes(): string;
+    /**
+     * @method render
+     */
+    render(): JSX.Element;
 }
 declare namespace AppWrapper {
     namespace propTypes {

package/esm/components/badge/badge.style.d.ts

@@ -1,6 +1,8 @@
 export const StyledBadgeWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export const StyledButton: import("styled-components").StyledComponent<typeof Button, any, {}, never>;
+export const StyledButton: import("styled-components").StyledComponent<{
+    ({ size, subtext, as, children, forwardRef, "aria-label": ariaLabel, disabled, destructive, buttonType: buttonTypeProp, iconType, iconPosition, href, m, px, noWrap, target, rel, iconTooltipMessage, iconTooltipPosition, fullWidth, ...rest }: import("../button").ButtonProps): JSX.Element;
+    displayName: string;
+}, any, {}, never>;
 export const StyledCrossIcon: import("styled-components").StyledComponent<typeof Icon, any, {}, never>;
 export const StyledCounter: import("styled-components").StyledComponent<"div", any, {}, never>;
-import Button from "../button";
 import Icon from "../icon";

package/esm/components/button/button-types.style.d.ts

@@ -1,5 +1,4 @@
-export function makeColors(color: any): string;
-declare function _default(isDisabled: any, destructive: any): {
+declare const _default: (isDisabled?: boolean | undefined, destructive?: boolean | undefined) => {
     primary: string;
     secondary: string;
     tertiary: string;

package/esm/components/button/button-types.style.js

@@ -1,5 +1,6 @@
 import StyledIcon from "../icon/icon.style";
-export function makeColors(color) {
+
+function makeColors(color) {
   return `
   color: ${color};
   ${StyledIcon} {
@@ -7,6 +8,7 @@ export function makeColors(color) {
   }
   `;
 }
+
 export default ((isDisabled, destructive) => ({
   primary: `
     background: var(--colorsActionMajor500);

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

@@ -1,37 +1,68 @@
-export default Button;
-export const ButtonWithForwardRef: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-declare function Button({ size, subtext, as, children, forwardRef, "aria-label": ariaLabel, disabled, buttonType: buttonTypeProp, iconType, iconPosition, href, m, px, noWrap, target, rel, iconTooltipMessage, iconTooltipPosition, ...rest }: {
-    [x: string]: any;
-    size: any;
-    subtext: any;
-    as: any;
-    children: any;
-    forwardRef: any;
-    "aria-label": any;
-    disabled: any;
-    buttonType: any;
-    iconType: any;
-    iconPosition: any;
-    href: any;
-    m?: number | undefined;
-    px: any;
-    noWrap: any;
-    target: any;
-    rel: any;
-    iconTooltipMessage: any;
-    iconTooltipPosition: any;
-}): JSX.Element;
-declare namespace Button {
-    const propTypes: any;
-    namespace defaultProps {
-        const buttonType: string;
-        const size: string;
-        const fullWidth: boolean;
-        const disabled: boolean;
-        const destructive: boolean;
-        const iconPosition: string;
-        const subtext: string;
-    }
-    const displayName: string;
-}
 import React from "react";
+import { SpaceProps } from "styled-system";
+import { IconType, TooltipPositions } from "../icon";
+export declare type ButtonTypes = "primary" | "secondary" | "tertiary" | "dashed" | "darkBackground";
+export declare type SizeOptions = "small" | "medium" | "large";
+export declare type ButtonIconPosition = "before" | "after";
+export interface ButtonProps extends SpaceProps {
+    /** Prop to specify the aria-label text.
+     *  Only to be used in Button when only an icon is rendered.
+     * This is required to comply with WCAG 4.1.2 - Buttons must have discernible text
+     */
+    "aria-label"?: string;
+    /** [Legacy] Button types for legacy theme: "primary" | "secondary" */
+    as?: ButtonTypes;
+    /** Color variants for new business themes: "primary" | "secondary" | "tertiary" | "darkBackground" */
+    buttonType?: ButtonTypes;
+    /** The text the button displays */
+    children?: React.ReactNode;
+    /** Name attribute */
+    name?: string;
+    /** Apply disabled state to the button */
+    disabled?: boolean;
+    /** Apply destructive style to the button */
+    destructive?: boolean;
+    /** Ref to be forwarded */
+    forwardRef?: React.RefCallback<HTMLButtonElement> | React.MutableRefObject<HTMLButtonElement | null> | null;
+    /** Apply fullWidth style to the button */
+    fullWidth?: boolean;
+    /** Used to transform button into anchor */
+    href?: string;
+    /** Defines an Icon position related to the children: "before" | "after" */
+    iconPosition?: ButtonIconPosition;
+    /** Provides a tooltip message when the icon is hovered. */
+    iconTooltipMessage?: string;
+    /** Provides positioning when the tooltip is displayed. */
+    iconTooltipPosition?: TooltipPositions;
+    /** Defines an Icon type within the button */
+    iconType?: IconType;
+    /** If provided, the text inside a button will not wrap */
+    noWrap?: boolean;
+    /** Specify a callback triggered on blur */
+    onBlur?: (ev: React.FocusEvent<HTMLButtonElement>) => void;
+    /** Specify a callback triggered on change */
+    onChange?: (ev: React.ChangeEvent<HTMLButtonElement>) => void;
+    /** Specify a callback triggered on focus */
+    onFocus?: (ev: React.FocusEvent<HTMLButtonElement>) => void;
+    /** Specify a callback triggered on keyDown */
+    onKeyDown?: (ev: React.KeyboardEvent<HTMLButtonElement>) => void;
+    /** onClick handler */
+    onClick?: (event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => void;
+    /** Assigns a size to the button: "small" | "medium" | "large" */
+    size?: SizeOptions;
+    /** Second text child, renders under main text, only when size is "large" */
+    subtext?: string;
+    /** HTML button type property */
+    type?: string;
+    /** HTML target attribute */
+    target?: string;
+    /** HTML rel attribute */
+    rel?: string;
+}
+declare const Button: {
+    ({ size, subtext, as, children, forwardRef, "aria-label": ariaLabel, disabled, destructive, buttonType: buttonTypeProp, iconType, iconPosition, href, m, px, noWrap, target, rel, iconTooltipMessage, iconTooltipPosition, fullWidth, ...rest }: ButtonProps): JSX.Element;
+    displayName: string;
+};
+declare const ButtonWithForwardRef: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { ButtonWithForwardRef };
+export default Button;