carbon-react 115.0.2 → 116.0.0

package/esm/components/tile-select/tile-select.component.js

@@ -2,37 +2,31 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import React, { useState, useEffect, useRef } from "react";
 import PropTypes from "prop-types";
-import styledSystemPropTypes from "@styled-system/prop-types";
 import tagComponent from "../../__internal__/utils/helpers/tags/tags";
 import useLocale from "../../hooks/__internal__/useLocale";
 import createGuid from "../../__internal__/utils/helpers/guid";
 import Button from "../button";
 import Box from "../box";
 import Accordion from "./__internal__/accordion";
-import Logger from "../../__internal__/utils/logger";
 import { StyledTileSelectContainer, StyledTileSelect, StyledTileSelectInput, StyledTitleContainer, StyledTitle, StyledSubtitle, StyledAdornment, StyledDescription, StyledDeselectWrapper, StyledFooterWrapper, StyledFocusWrapper, StyledAccordionFooterWrapper } from "./tile-select.style";
 import { filterStyledSystemMarginProps } from "../../style/utils";
-const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
 
-const checkPropTypeIsNode = prop => typeof prop !== "string" && {
-  as: "div"
-};
+const checkPropTypeIsNode = prop => typeof prop !== "string";
 
-let deprecateInputRefWarnTriggered = false;
 const TileSelect = /*#__PURE__*/React.forwardRef(({
   onChange,
   onBlur,
   onFocus,
   value,
   name,
-  checked,
+  checked = false,
   className,
   disabled,
   title,
   subtitle,
   description,
   titleAdornment,
-  type,
+  type = "checkbox",
   id,
   customActionButton,
   actionButtonAdornment,
@@ -42,13 +36,12 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
   accordionContent,
   accordionControl,
   accordionExpanded,
-  inputRef,
   ...rest
 }, ref) => {
   const l = useLocale();
   const [hasFocus, setHasFocus] = useState(false);
 
-  const handleDeselect = () => onChange({
+  const handleDeselect = () => onChange === null || onChange === void 0 ? void 0 : onChange({
     target: { ...(name && {
         name
       }),
@@ -60,11 +53,6 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
     }
   });
 
-  if (!deprecateInputRefWarnTriggered && inputRef) {
-    deprecateInputRefWarnTriggered = true;
-    Logger.deprecate("The `inputRef` prop in `TileSelect` component is deprecated and will soon be removed. Please use `ref` instead.");
-  }
-
   const renderActionButton = () => /*#__PURE__*/React.createElement(StyledDeselectWrapper, {
     hasActionAdornment: !!actionButtonAdornment
   }, customActionButton && customActionButton(handleDeselect), !customActionButton && checked && /*#__PURE__*/React.createElement(Button, {
@@ -93,15 +81,11 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
     onChange: onChange,
     onBlur: ev => {
       setHasFocus(false);
-      /* istanbul ignore else */
-
-      if (onBlur) onBlur(ev);
+      onBlur === null || onBlur === void 0 ? void 0 : onBlur(ev);
     },
     onFocus: ev => {
       setHasFocus(true);
-      /* istanbul ignore else */
-
-      if (onFocus) onFocus(ev);
+      onFocus === null || onFocus === void 0 ? void 0 : onFocus(ev);
     },
     checked: checked,
     name: name,
@@ -110,7 +94,6 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
     disabled: disabled,
     "aria-checked": checked,
     id: id,
-    inputRef: inputRef,
     ref: ref
   }, rest)), /*#__PURE__*/React.createElement(StyledTileSelect, {
     disabled: disabled,
@@ -120,10 +103,16 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
     justifyContent: "space-between",
     flexDirection: "row-reverse"
   }, (customActionButton || checked) && renderActionButton(), /*#__PURE__*/React.createElement(Box, {
-    flexGrow: "1"
-  }, /*#__PURE__*/React.createElement(StyledTitleContainer, null, title && /*#__PURE__*/React.createElement(StyledTitle, checkPropTypeIsNode(title), title), subtitle && /*#__PURE__*/React.createElement(StyledSubtitle, checkPropTypeIsNode(subtitle), subtitle), titleAdornment && /*#__PURE__*/React.createElement(StyledAdornment, {
+    flexGrow: 1
+  }, /*#__PURE__*/React.createElement(StyledTitleContainer, null, title && /*#__PURE__*/React.createElement(StyledTitle, {
+    as: checkPropTypeIsNode(title) ? "div" : undefined
+  }, title), subtitle && /*#__PURE__*/React.createElement(StyledSubtitle, {
+    as: checkPropTypeIsNode(subtitle) ? "div" : undefined
+  }, subtitle), titleAdornment && /*#__PURE__*/React.createElement(StyledAdornment, {
     hasAdditionalInformation: !!additionalInformation
-  }, titleAdornment)), additionalInformation && /*#__PURE__*/React.createElement("div", null, additionalInformation), /*#__PURE__*/React.createElement(StyledDescription, checkPropTypeIsNode(description), description), footer && /*#__PURE__*/React.createElement(StyledFooterWrapper, null, footer), accordionContent && accordionControl && /*#__PURE__*/React.createElement(StyledAccordionFooterWrapper, {
+  }, titleAdornment)), additionalInformation && /*#__PURE__*/React.createElement("div", null, additionalInformation), /*#__PURE__*/React.createElement(StyledDescription, {
+    as: checkPropTypeIsNode(description) ? "div" : undefined
+  }, description), footer && /*#__PURE__*/React.createElement(StyledFooterWrapper, null, footer), accordionContent && accordionControl && /*#__PURE__*/React.createElement(StyledAccordionFooterWrapper, {
     accordionExpanded: accordionExpanded
   }, accordionControl(controlId, contentId))), prefixAdornment && /*#__PURE__*/React.createElement(Box, {
     "data-element": "prefix-adornment",
@@ -135,80 +124,183 @@ const TileSelect = /*#__PURE__*/React.forwardRef(({
     expanded: accordionExpanded
   }, accordionContent)));
 });
-TileSelect.defaultProps = {
-  checked: false,
-  type: "checkbox"
-};
-TileSelect.propTypes = { ...marginPropTypes,
-
-  /** title of the TileSelect */
-  title: PropTypes.node,
-
-  /** adornment to be rendered next to the title */
-  titleAdornment: PropTypes.node,
-
-  /** subtitle of the TileSelect */
-  subtitle: PropTypes.node,
-
-  /** description of the TileSelect */
-  description: PropTypes.node,
-
-  /** disables the TileSelect input */
-  disabled: PropTypes.bool,
-
-  /** the value that is represented by this TileSelect */
-  value: PropTypes.string,
-
-  /** input id */
-  id: PropTypes.string,
-
-  /** input name */
-  name: PropTypes.string,
-
-  /** Callback triggered when user selects or deselects this tile */
-  onChange: PropTypes.func,
-
-  /** Callback triggered when the user blurs this tile */
-  onBlur: PropTypes.func,
-
-  /** Callback triggered when the user focuses this tile */
-  onFocus: PropTypes.func,
-
-  /** determines if this tile is selected or unselected */
-  checked: PropTypes.bool,
-
-  /** Custom class name passed to the root element of TileSelect */
-  className: PropTypes.string,
-
-  /** Type of the TileSelect input */
-  type: PropTypes.oneOf(["radio", "checkbox"]),
-
-  /** Render prop that allows overriding the default action button. `(onClick) => <Button onClick={onClick}>...</Button>` */
-  customActionButton: PropTypes.func,
-
-  /** An additional help info icon rendered next to the action button */
-  actionButtonAdornment: PropTypes.node,
-
-  /** footer of the TileSelect */
-  footer: PropTypes.node,
-
-  /** Component to render in the top left corner of TileSelect */
-  prefixAdornment: PropTypes.node,
-
-  /** Component to render additional information row between title and description */
-  additionalInformation: PropTypes.node,
-
-  /** Components to render in the TileSelect Accordion */
-  accordionContent: PropTypes.node,
-
-  /**
-   * Render prop to support rendering the control to handle the expanded state of the TileSelect Accordion.
-   * `(controlId, contentId) => <Button id={controlId} aria-controls={contentId}>...</Button>`
-   */
-  accordionControl: PropTypes.func,
-
-  /** Flag to control the open state of TileSelect Accordion */
-  accordionExpanded: PropTypes.bool
+TileSelect.propTypes = {
+  "accordionContent": PropTypes.node,
+  "accordionControl": PropTypes.func,
+  "accordionExpanded": PropTypes.bool,
+  "actionButtonAdornment": PropTypes.node,
+  "additionalInformation": PropTypes.node,
+  "checked": PropTypes.bool,
+  "className": PropTypes.string,
+  "customActionButton": PropTypes.func,
+  "description": PropTypes.node,
+  "disabled": PropTypes.bool,
+  "footer": PropTypes.node,
+  "id": PropTypes.string,
+  "m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "margin": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "marginY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "ml": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "mx": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "my": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
+    "__@toStringTag": PropTypes.string.isRequired,
+    "description": PropTypes.string,
+    "toString": PropTypes.func.isRequired,
+    "valueOf": PropTypes.func.isRequired
+  }), PropTypes.string]),
+  "name": PropTypes.string,
+  "onBlur": PropTypes.func,
+  "onChange": PropTypes.func,
+  "onFocus": PropTypes.func,
+  "prefixAdornment": PropTypes.node,
+  "subtitle": PropTypes.node,
+  "title": PropTypes.node,
+  "titleAdornment": PropTypes.node,
+  "type": PropTypes.oneOf(["checkbox", "radio"]),
+  "value": PropTypes.string
 };
 TileSelect.displayName = "TileSelect";
 export default TileSelect;

package/esm/components/tile-select/tile-select.style.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="react" />
+declare const StyledTitle: import("styled-components").StyledComponent<"h3", any, {}, never>;
+declare const StyledSubtitle: import("styled-components").StyledComponent<"h4", any, {}, never>;
+declare const StyledAdornment: import("styled-components").StyledComponent<"div", any, {
+    hasAdditionalInformation: boolean;
+}, never>;
+declare const StyledDescription: import("styled-components").StyledComponent<"p", any, {}, never>;
+declare const StyledTileSelect: import("styled-components").StyledComponent<"div", any, {
+    checked?: boolean | undefined;
+    disabled?: boolean | undefined;
+}, never>;
+declare const StyledFocusWrapper: import("styled-components").StyledComponent<"div", any, {
+    checked?: boolean | undefined;
+    hasFocus: boolean;
+}, never>;
+declare const StyledTileSelectContainer: import("styled-components").StyledComponent<"div", any, {
+    checked?: boolean | undefined;
+    disabled?: boolean | undefined;
+}, never>;
+declare const StyledFooterWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const StyledAccordionFooterWrapper: import("styled-components").StyledComponent<"div", any, {
+    accordionExpanded?: boolean | undefined;
+}, never>;
+declare const StyledTileSelectInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../../__internal__/input").InputProps & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>, any, {}, never>;
+declare const StyledTitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+declare const StyledDeselectWrapper: import("styled-components").StyledComponent<"div", any, {
+    hasActionAdornment: boolean;
+}, never>;
+declare const StyledTileSelectFieldset: import("styled-components").StyledComponent<{
+    ({ children, inline, legend, ...rest }: import("../fieldset").FieldsetProps): JSX.Element;
+    displayName: string;
+}, any, {
+    multiSelect: boolean;
+}, never>;
+declare const StyledGroupDescription: import("styled-components").StyledComponent<"p", any, {}, never>;
+export { StyledTileSelectFieldset, StyledGroupDescription, StyledTileSelectContainer, StyledTileSelect, StyledTileSelectInput, StyledTitleContainer, StyledTitle, StyledSubtitle, StyledAdornment, StyledDescription, StyledDeselectWrapper, StyledFooterWrapper, StyledFocusWrapper, StyledAccordionFooterWrapper, };

package/lib/__internal__/radio-button-mapper/radio-button-mapper.component.d.ts

@@ -15,7 +15,7 @@ export interface RadioButtonMapperProps extends InputEvents {
     /** Specifies the name prop to be applied to each button in the group */
     name: string;
     /** Value of the selected RadioButton */
-    value?: string;
+    value?: string | null;
 }
 export interface MappedChildProps {
     defaultChecked?: boolean;

package/lib/components/tile-select/__internal__/accordion/accordion.component.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { SpaceProps } from "styled-system";
+export interface AccordionProps extends SpaceProps {
+    children: React.ReactNode;
+    expanded?: boolean;
+    contentId?: string;
+    controlId?: string;
+}
+declare const Accordion: ({ children, expanded, contentId, controlId, }: AccordionProps) => JSX.Element;
+export default Accordion;