carbon-react 105.1.2 → 106.0.1

package/esm/__internal__/utils/helpers/tags/tags.d.ts

@@ -1,9 +1,13 @@
-export default tagComponent;
+interface DataProps {
+    "data-element"?: string;
+    "data-role"?: string;
+    [restKeys: string]: any;
+}
+export interface TagProps extends DataProps {
+    "data-component": string;
+}
 /**
  * Builds props object containing top level data tags
- *
- * @param {String} name of component
- * @param {Object} component props
- * @return {Object} dataTagProps
  */
-declare function tagComponent(component: Object, props: any): Object;
+declare function tagComponent(componentName: string, props: DataProps): TagProps;
+export default tagComponent;

package/esm/__internal__/utils/helpers/tags/tags.js

@@ -1,13 +1,9 @@
 /**
  * Builds props object containing top level data tags
- *
- * @param {String} name of component
- * @param {Object} component props
- * @return {Object} dataTagProps
  */
-function tagComponent(component, props) {
+function tagComponent(componentName, props) {
   const tagProps = {
-    "data-component": component
+    "data-component": componentName
   };
 
   if (props["data-element"]) {

package/esm/__internal__/utils/helpers/useUniqueId/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (id?: string | undefined, name?: string | undefined) => string[];
+export default _default;

package/esm/__internal__/utils/helpers/useUniqueId/index.js

@@ -0,0 +1,7 @@
+import { useRef } from "react";
+import createGuid from "../guid";
+export default ((id, name) => {
+  const createdId = useRef(createGuid());
+  const createdName = useRef(createGuid());
+  return [id || createdId.current, name || createdName.current];
+});

package/esm/__internal__/utils/logger/index.d.ts

@@ -1 +1,5 @@
-export { default } from "./logger";
+declare const Logger: {
+    setEnabledState: (newState: boolean) => void;
+    deprecate: (message: string) => void;
+};
+export default Logger;

package/esm/__internal__/utils/logger/index.js

@@ -1 +1,25 @@
-export { default } from "./logger";
+/* eslint-disable no-console */
+// Globally enable the logger
+let enabled = process.env.NODE_ENV !== "production";
+/*
+ * Logger
+ *
+ * Logger function will only output when enabled. By default this
+ * enabled state is set when your NODE_ENV !== 'production'
+ *
+ * Methods
+ * deprecate - console.warn which prepends the message with [Deprecation]
+ *
+ */
+
+const Logger = {
+  setEnabledState: newState => {
+    enabled = newState;
+  },
+  deprecate: message => {
+    if (enabled) {
+      console.warn(`[Deprecation] ${message}`);
+    }
+  }
+};
+export default Logger;

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/app-wrapper/app-wrapper.component.js

@@ -24,7 +24,6 @@ import React from "react";
 import PropTypes from "prop-types";
 import classNames from "classnames";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
-import { validProps } from "../../__internal__/utils/ether";
 import StyledAppWrapper from "./app-wrapper.style";
 import Logger from "../../__internal__/utils/logger";
 let deprecatedWarnTriggered = false;
@@ -73,9 +72,12 @@ let AppWrapper = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
-      return /*#__PURE__*/React.createElement(StyledAppWrapper, _extends({}, validProps(this), {
+      const {
+        children
+      } = this.props;
+      return /*#__PURE__*/React.createElement(StyledAppWrapper, _extends({}, this.props, {
         className: this.classes()
-      }, tagComponent("app-wrapper", this.props)), this.props.children);
+      }, tagComponent("app-wrapper", this.props)), children);
     }
   }]);
 

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;