carbon-react 118.5.1 → 118.6.0

package/esm/__internal__/character-count/character-count.component.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
+import React from "react";
 interface CharacterCountProps {
     value: number;
     limit: number;
     isOverLimit: boolean;
     "data-element"?: string;
 }
-declare const CharacterCount: ({ value, limit, isOverLimit, "data-element": dataElement, }: CharacterCountProps) => JSX.Element;
+declare const CharacterCount: ({ value, limit, isOverLimit, "data-element": dataElement, }: CharacterCountProps) => React.JSX.Element;
 export default CharacterCount;

package/esm/__internal__/character-count/character-count.component.js

@@ -2,30 +2,21 @@ import React from "react";
 import PropTypes from "prop-types";
 import StyledCharacterCount from "./character-count.style";
 import useLocale from "../../hooks/__internal__/useLocale";
-
-const CharacterCount = ({
-  value,
-  limit,
-  isOverLimit,
-  "data-element": dataElement
-}) => {
+const CharacterCount = _ref => {
+  let {
+    value,
+    limit,
+    isOverLimit,
+    "data-element": dataElement
+  } = _ref;
   const limitMinusValue = +limit - +value;
   const valueMinusLimit = +value - +limit;
   const l = useLocale();
-
   const getFormatNumber = (rawValue, locale) => new Intl.NumberFormat(locale).format(rawValue);
-
   return /*#__PURE__*/React.createElement(StyledCharacterCount, {
     "aria-live": "polite",
     isOverLimit: isOverLimit,
     "data-element": dataElement
   }, !isOverLimit ? l.characterCount.charactersLeft(limitMinusValue, getFormatNumber(limitMinusValue, l.locale())) : l.characterCount.tooManyCharacters(valueMinusLimit, getFormatNumber(valueMinusLimit, l.locale())));
 };
-
-CharacterCount.propTypes = {
-  "data-element": PropTypes.string,
-  "isOverLimit": PropTypes.bool.isRequired,
-  "limit": PropTypes.number.isRequired,
-  "value": PropTypes.number.isRequired
-};
 export default CharacterCount;

package/esm/__internal__/character-count/character-count.style.js

@@ -5,15 +5,21 @@ const StyledCharacterCount = styled.div`
   font-size: 12px;
   margin-top: 4px;
   margin-bottom: 4px;
-  color: ${({
-  isOverLimit
-}) => isOverLimit ? "var(--colorsSemanticNegative500)" : "var(--colorsUtilityYin055)"};
+  color: ${_ref => {
+  let {
+    isOverLimit
+  } = _ref;
+  return isOverLimit ? "var(--colorsSemanticNegative500)" : "var(--colorsUtilityYin055)";
+}};
 
-  ${({
-  isOverLimit
-}) => isOverLimit && css`
+  ${_ref2 => {
+  let {
+    isOverLimit
+  } = _ref2;
+  return isOverLimit && css`
       font-weight: 700;
-    `}
+    `;
+}}
 `;
 StyledCharacterCount.defaultProps = {
   theme: baseTheme

package/esm/__internal__/checkable-input/checkable-input.component.js

@@ -1,5 +1,4 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { useRef } from "react";
 import PropTypes from "prop-types";
 import { StyledCheckableInput, StyledCheckableInputWrapper } from "./checkable-input.style";
@@ -8,36 +7,37 @@ import FormField from "../form-field";
 import HiddenCheckableInput from "./hidden-checkable-input.component";
 import guid from "../utils/helpers/guid";
 import useInputAccessibility from "../../hooks/__internal__/useInputAccessibility";
-const CheckableInput = /*#__PURE__*/React.forwardRef(({
-  ariaLabelledBy,
-  autoFocus,
-  checked,
-  children,
-  disabled,
-  error,
-  fieldHelp,
-  fieldHelpInline,
-  info,
-  id: inputId,
-  type,
-  value,
-  inputWidth,
-  label,
-  labelAlign,
-  labelHelp,
-  labelInline = true,
-  labelSpacing = 1,
-  labelWidth,
-  name,
-  onBlur,
-  onChange,
-  onFocus,
-  required,
-  reverse = false,
-  validationOnLabel,
-  warning,
-  ...props
-}, ref) => {
+const CheckableInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    ariaLabelledBy,
+    autoFocus,
+    checked,
+    children,
+    disabled,
+    error,
+    fieldHelp,
+    fieldHelpInline,
+    info,
+    id: inputId,
+    type,
+    value,
+    inputWidth,
+    label,
+    labelAlign,
+    labelHelp,
+    labelInline = true,
+    labelSpacing = 1,
+    labelWidth,
+    name,
+    onBlur,
+    onChange,
+    onFocus,
+    required,
+    reverse = false,
+    validationOnLabel,
+    warning,
+    ...props
+  } = _ref;
   const {
     current: id
   } = useRef(inputId || guid());
@@ -173,14 +173,12 @@ CheckableInput.propTypes = {
   "children": PropTypes.node,
   "className": PropTypes.string,
   "color": PropTypes.string,
+  "content": PropTypes.string,
   "contentEditable": PropTypes.oneOfType([PropTypes.oneOf(["false", "inherit", "true"]), PropTypes.bool]),
   "contextMenu": PropTypes.string,
-  "crossOrigin": PropTypes.string,
-  "css": PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__emotion_styles": PropTypes.any.isRequired
-  }), PropTypes.string, PropTypes.bool]),
+  "crossOrigin": PropTypes.oneOf(["", "anonymous", "use-credentials"]),
   "dangerouslySetInnerHTML": PropTypes.shape({
-    "__html": PropTypes.string.isRequired
+    "__html": PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired
   }),
   "datatype": PropTypes.string,
   "defaultChecked": PropTypes.bool,
@@ -225,6 +223,7 @@ CheckableInput.propTypes = {
   "minLength": PropTypes.number,
   "multiple": PropTypes.bool,
   "name": PropTypes.string,
+  "nonce": PropTypes.string,
   "onAbort": PropTypes.func,
   "onAbortCapture": PropTypes.func,
   "onAnimationEnd": PropTypes.func,
@@ -391,9 +390,11 @@ CheckableInput.propTypes = {
   "property": PropTypes.string,
   "radioGroup": PropTypes.string,
   "readOnly": PropTypes.bool,
+  "rel": PropTypes.string,
   "required": PropTypes.bool,
   "resource": PropTypes.string,
   "results": PropTypes.number,
+  "rev": PropTypes.string,
   "reverse": PropTypes.bool,
   "role": PropTypes.oneOfType([PropTypes.oneOf(["alert", "alertdialog", "application", "article", "banner", "button", "cell", "checkbox", "columnheader", "combobox", "complementary", "contentinfo", "definition", "dialog", "directory", "document", "feed", "figure", "form", "grid", "gridcell", "group", "heading", "img", "link", "list", "listbox", "listitem", "log", "main", "marquee", "math", "menu", "menubar", "menuitem", "menuitemcheckbox", "menuitemradio", "navigation", "none", "note", "option", "presentation", "progressbar", "radio", "radiogroup", "region", "row", "rowgroup", "rowheader", "scrollbar", "search", "searchbox", "separator", "slider", "spinbutton", "status", "switch", "tab", "table", "tablist", "tabpanel", "term", "textbox", "timer", "toolbar", "tooltip", "tree", "treegrid", "treeitem"]), PropTypes.shape({
     "__@iterator": PropTypes.func.isRequired,

package/esm/__internal__/checkable-input/checkable-input.style.js

@@ -10,14 +10,16 @@ const StyledCheckableInput = styled.div`
   position: relative;
 `;
 const StyledCheckableInputWrapper = styled.div`
-  ${({
-  disabled,
-  fieldHelpInline,
-  inputWidth,
-  labelWidth,
-  labelInline,
-  reverse
-}) => css`
+  ${_ref => {
+  let {
+    disabled,
+    fieldHelpInline,
+    inputWidth,
+    labelWidth,
+    labelInline,
+    reverse
+  } = _ref;
+  return css`
     ${FieldLineStyle} {
       display: flex;
     }
@@ -94,6 +96,7 @@ const StyledCheckableInputWrapper = styled.div`
         width: ${labelWidth}% !important;
       }
     `}
-  `}
+  `;
+}}
 `;
 export { StyledCheckableInput, StyledCheckableInputWrapper };

package/esm/__internal__/checkable-input/hidden-checkable-input.component.js

@@ -1,22 +1,22 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { useContext } from "react";
 import PropTypes from "prop-types";
 import HiddenCheckableInputStyle from "./hidden-checkable-input.style";
 import { InputContext, InputGroupContext } from "../input-behaviour";
-const HiddenCheckableInput = /*#__PURE__*/React.forwardRef(({
-  ariaDescribedBy,
-  ariaLabelledBy,
-  name,
-  checked,
-  type,
-  value,
-  onChange,
-  autoFocus,
-  role,
-  validationIconId,
-  ...props
-}, ref) => {
+const HiddenCheckableInput = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    ariaDescribedBy,
+    ariaLabelledBy,
+    name,
+    checked,
+    type,
+    value,
+    onChange,
+    autoFocus,
+    role,
+    validationIconId,
+    ...props
+  } = _ref;
   const {
     onBlur,
     onFocus,
@@ -33,38 +33,31 @@ const HiddenCheckableInput = /*#__PURE__*/React.forwardRef(({
     hasFocus: hasGroupFocus,
     hasMouseOver: hasGroupMouseOver
   } = useContext(InputGroupContext);
-
   const handleFocus = ev => {
     if (props.onFocus) props.onFocus(ev);
     if (onFocus) onFocus();
     if (onFocusGroup) onFocusGroup();
   };
-
   const handleBlur = ev => {
     if (props.onBlur) props.onBlur(ev);
     if (onBlur) onBlur();
     if (onBlurGroup) onBlurGroup();
   };
-
   const handleMouseEnter = ev => {
     if (props.onMouseEnter) props.onMouseEnter(ev);
     if (onMouseEnter) onMouseEnter();
     if (onMouseEnterGroup) onMouseEnterGroup();
   };
-
   const handleMouseLeave = ev => {
     if (props.onMouseLeave) props.onMouseLeave(ev);
     if (onMouseLeave) onMouseLeave();
     if (onMouseLeaveGroup) onMouseLeaveGroup();
   };
-
   const hasValidationPart = (hasFocus || hasGroupFocus || hasMouseOver || hasGroupMouseOver) && validationIconId;
   const descriptionList = ariaDescribedBy ? [ariaDescribedBy] : [];
-
   if (hasValidationPart) {
     descriptionList.push(validationIconId);
   }
-
   const combinedDescription = descriptionList.length ? descriptionList.filter(Boolean).join(" ") : undefined;
   return /*#__PURE__*/React.createElement(HiddenCheckableInputStyle, _extends({
     "aria-describedby": combinedDescription,
@@ -150,14 +143,12 @@ HiddenCheckableInput.propTypes = {
   "children": PropTypes.node,
   "className": PropTypes.string,
   "color": PropTypes.string,
+  "content": PropTypes.string,
   "contentEditable": PropTypes.oneOfType([PropTypes.oneOf(["false", "inherit", "true"]), PropTypes.bool]),
   "contextMenu": PropTypes.string,
-  "crossOrigin": PropTypes.string,
-  "css": PropTypes.oneOfType([PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.shape({
-    "__emotion_styles": PropTypes.any.isRequired
-  }), PropTypes.string, PropTypes.bool]),
+  "crossOrigin": PropTypes.oneOf(["", "anonymous", "use-credentials"]),
   "dangerouslySetInnerHTML": PropTypes.shape({
-    "__html": PropTypes.string.isRequired
+    "__html": PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired
   }),
   "datatype": PropTypes.string,
   "defaultChecked": PropTypes.bool,
@@ -191,6 +182,7 @@ HiddenCheckableInput.propTypes = {
   "minLength": PropTypes.number,
   "multiple": PropTypes.bool,
   "name": PropTypes.string,
+  "nonce": PropTypes.string,
   "onAbort": PropTypes.func,
   "onAbortCapture": PropTypes.func,
   "onAnimationEnd": PropTypes.func,
@@ -357,9 +349,11 @@ HiddenCheckableInput.propTypes = {
   "property": PropTypes.string,
   "radioGroup": PropTypes.string,
   "readOnly": PropTypes.bool,
+  "rel": PropTypes.string,
   "required": PropTypes.bool,
   "resource": PropTypes.string,
   "results": PropTypes.number,
+  "rev": PropTypes.string,
   "role": PropTypes.string,
   "security": PropTypes.string,
   "slot": PropTypes.string,

package/esm/__internal__/field-help/field-help.component.d.ts

@@ -6,5 +6,5 @@ export interface FieldHelpProps extends StyledFieldHelpProps {
     /** The unique id of the FieldHelp component */
     id?: string;
 }
-export declare const FieldHelp: ({ children, labelInline, labelWidth, id, }: FieldHelpProps) => JSX.Element;
+export declare const FieldHelp: ({ children, labelInline, labelWidth, id, }: FieldHelpProps) => React.JSX.Element;
 export default FieldHelp;

package/esm/__internal__/field-help/field-help.component.js

@@ -1,24 +1,18 @@
 import React from "react";
 import PropTypes from "prop-types";
 import StyledFieldHelp from "./field-help.style";
-
-const FieldHelp = ({
-  children,
-  labelInline,
-  labelWidth = 30,
-  id
-}) => /*#__PURE__*/React.createElement(StyledFieldHelp, {
-  "data-element": "help",
-  labelInline: labelInline,
-  labelWidth: labelWidth,
-  id: id
-}, children);
-
-FieldHelp.propTypes = {
-  "children": PropTypes.node,
-  "id": PropTypes.string,
-  "labelInline": PropTypes.bool,
-  "labelWidth": PropTypes.number
+export const FieldHelp = _ref => {
+  let {
+    children,
+    labelInline,
+    labelWidth = 30,
+    id
+  } = _ref;
+  return /*#__PURE__*/React.createElement(StyledFieldHelp, {
+    "data-element": "help",
+    labelInline: labelInline,
+    labelWidth: labelWidth,
+    id: id
+  }, children);
 };
-export { FieldHelp };
 export default FieldHelp;

package/esm/__internal__/field-help/field-help.style.js

@@ -5,12 +5,15 @@ const StyledFieldHelp = styled.span`
   margin-top: 8px;
   white-space: pre-wrap;
 
-  ${({
-  labelInline,
-  labelWidth
-}) => labelInline && css`
+  ${_ref => {
+  let {
+    labelInline,
+    labelWidth
+  } = _ref;
+  return labelInline && css`
       margin-left: ${labelWidth}%;
       padding-left: 0;
-    `}
+    `;
+}}
 `;
 export default StyledFieldHelp;

package/esm/__internal__/fieldset/fieldset.component.d.ts

@@ -23,5 +23,5 @@ export interface FieldsetProps extends MarginProps {
     /** Controls whether group behaviour should be enabled */
     blockGroupBehaviour?: boolean;
 }
-declare const Fieldset: ({ legend, children, inline, legendWidth, legendAlign, legendSpacing, error, warning, info, isRequired, blockGroupBehaviour, ...rest }: FieldsetProps) => JSX.Element;
+declare const Fieldset: ({ legend, children, inline, legendWidth, legendAlign, legendSpacing, error, warning, info, isRequired, blockGroupBehaviour, ...rest }: FieldsetProps) => React.JSX.Element;
 export default Fieldset;