carbon-react 110.0.4 → 110.1.2

package/lib/components/portrait/portrait.style.js

@@ -6,12 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.getColorsForInitials = getColorsForInitials;
 exports.StyledPortraitContainer = exports.StyledIcon = exports.StyledCustomImg = exports.StyledPortraitGravatar = exports.StyledPortraitInitialsImg = exports.StyledPortraitInitials = void 0;
 
-var _react = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledSystem = require("styled-system");
 
 var _base = _interopRequireDefault(require("../../style/themes/base"));
@@ -20,22 +16,18 @@ var _icon = _interopRequireDefault(require("../icon"));
 
 var _portrait = require("./portrait.config");
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function stylingForSize({
   size,
   initials
 }) {
   const params = _portrait.PORTRAIT_SIZE_PARAMS[size];
 
-  if (!params) {
-    return (0, _styledComponents.css)``;
-  }
-
   if (initials) {
     return (0, _styledComponents.css)`
       width: inherit;
@@ -45,8 +37,8 @@ function stylingForSize({
   }
 
   return (0, _styledComponents.css)`
-    width: ${params.dimensions}px;
-    height: ${params.dimensions}px;
+    width: ${params === null || params === void 0 ? void 0 : params.dimensions}px;
+    height: ${params === null || params === void 0 ? void 0 : params.dimensions}px;
   `;
 }
 
@@ -66,11 +58,6 @@ function stylingForIcon({
   darkBackground
 }) {
   const params = _portrait.PORTRAIT_SIZE_PARAMS[size];
-
-  if (!params) {
-    return (0, _styledComponents.css)``;
-  }
-
   let color = "var(--colorsUtilityMajor200)";
   let backgroundColor = "var(--colorsUtilityMajor025)";
 
@@ -84,7 +71,7 @@ function stylingForIcon({
     color: ${color};
 
     ::before {
-      font-size: ${params.iconDimensions}px;
+      font-size: ${params === null || params === void 0 ? void 0 : params.iconDimensions}px;
     }
   `;
 }
@@ -114,21 +101,10 @@ const StyledPortraitInitials = _styledComponents.default.div`
   }
 `;
 exports.StyledPortraitInitials = StyledPortraitInitials;
-StyledPortraitInitials.propTypes = {
-  size: _propTypes.default.oneOf(_portrait.PORTRAIT_SIZES).isRequired,
-  shape: _propTypes.default.oneOf(_portrait.PORTRAIT_SHAPES)
-};
-StyledPortraitInitials.defaultProps = {
-  shape: "square"
-};
 const StyledPortraitInitialsImg = _styledComponents.default.img`
   display: block;
 `;
 exports.StyledPortraitInitialsImg = StyledPortraitInitialsImg;
-StyledPortraitInitialsImg.propTypes = {
-  src: _propTypes.default.string.isRequired,
-  alt: _propTypes.default.string
-};
 const StyledPortraitGravatar = _styledComponents.default.img`
   display: inline-block;
   vertical-align: middle;
@@ -136,30 +112,15 @@ const StyledPortraitGravatar = _styledComponents.default.img`
   ${stylingForShape}
 `;
 exports.StyledPortraitGravatar = StyledPortraitGravatar;
-StyledPortraitGravatar.propTypes = {
-  shape: _propTypes.default.oneOf(_portrait.PORTRAIT_SHAPES),
-  size: _propTypes.default.oneOf(_portrait.PORTRAIT_SIZES).isRequired,
-  src: _propTypes.default.string.isRequired,
-  alt: _propTypes.default.string
-};
 const StyledCustomImg = _styledComponents.default.img`
   display: block;
   ${stylingForSize}
   ${stylingForShape}
-`;
+`; // && is used here to increase the specificity
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 exports.StyledCustomImg = StyledCustomImg;
-StyledCustomImg.propTypes = {
-  src: _propTypes.default.string.isRequired,
-  alt: _propTypes.default.string,
-  shape: _propTypes.default.oneOf(_portrait.PORTRAIT_SHAPES),
-  size: _propTypes.default.oneOf(_portrait.PORTRAIT_SIZES).isRequired
-}; // && is used here to increase the specificity
-
-const StyledIcon = (0, _styledComponents.default)(({
-  size,
-  darkBackground,
-  ...rest
-}) => /*#__PURE__*/_react.default.createElement(_icon.default, rest))`
+const StyledIcon = (0, _styledComponents.default)(_icon.default)`
   && {
     box-sizing: border-box;
     line-height: 14px;
@@ -172,17 +133,6 @@ const StyledIcon = (0, _styledComponents.default)(({
   }
 `;
 exports.StyledIcon = StyledIcon;
-StyledIcon.propTypes = {
-  darkBackground: _propTypes.default.bool,
-  size: _propTypes.default.oneOf(_portrait.PORTRAIT_SIZES),
-  shape: _propTypes.default.oneOf(_portrait.PORTRAIT_SHAPES),
-  type: _propTypes.default.string.isRequired
-};
-StyledIcon.defaultProps = {
-  darkBackground: false,
-  size: "M",
-  shape: "square"
-};
 const StyledPortraitContainer = _styledComponents.default.div`
   display: inline-block;
   ${({

package/lib/components/profile/profile.style.d.ts

@@ -1,4 +1,4 @@
-import Portrait from "../portrait";
+/// <reference types="react" />
 import { ProfileSize } from "./profile.config";
 interface ProfileSizeProps {
     size?: ProfileSize;
@@ -12,5 +12,5 @@ declare const ProfileNameStyle: import("styled-components").StyledComponent<"spa
 declare const ProfileEmailStyle: import("styled-components").StyledComponent<"span", any, ProfileSizeProps, never>;
 declare const ProfileStyle: import("styled-components").StyledComponent<"div", any, ProfileHasSrcProps, never>;
 declare const ProfileDetailsStyle: import("styled-components").StyledComponent<"div", any, ProfileDetailsStyleProps, never>;
-declare const ProfileAvatarStyle: import("styled-components").StyledComponent<typeof Portrait, any, {}, never>;
+declare const ProfileAvatarStyle: import("styled-components").StyledComponent<({ alt, darkBackground, gravatar, iconType, initials, shape, size, src, onClick, tooltipMessage, tooltipId, tooltipIsVisible, tooltipPosition, tooltipType, tooltipSize, tooltipBgColor, tooltipFontColor, ...rest }: import("../portrait").PortraitProps) => JSX.Element, any, {}, never>;
 export { ProfileStyle, ProfileNameStyle, ProfileDetailsStyle, ProfileAvatarStyle, ProfileEmailStyle, };

package/lib/components/show-edit-pod/show-edit-pod.style.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _formStyle = require("../form/form.style.js");
 
@@ -15,10 +15,6 @@ var _pod = _interopRequireDefault(require("../pod"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 const StyledPod = (0, _styledComponents.default)(_pod.default)`
   ${_formStyle.StyledFormFooter} {
     margin-top: 24px;
@@ -26,13 +22,6 @@ const StyledPod = (0, _styledComponents.default)(_pod.default)`
 
   ${_podStyle.StyledContent} {
     padding: 16px;
-    ${({
-  softDelete
-}) => softDelete && (0, _styledComponents.css)`
-        [data-element="content-title"] {
-          color: var(--colorsUtilityYin030);
-        }
-      `}
   }
 
   .common-input__prefix {

package/lib/components/sidebar/sidebar.component.js

@@ -9,6 +9,8 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _propTypes2 = _interopRequireDefault(require("@styled-system/prop-types"));
+
 var _modal = _interopRequireDefault(require("../modal"));
 
 var _sidebar = _interopRequireDefault(require("./sidebar.style"));
@@ -23,12 +25,12 @@ var _sidebarHeader = _interopRequireDefault(require("./__internal__/sidebar-head
 
 var _box = _interopRequireDefault(require("../box"));
 
-var _sidebar2 = require("./sidebar.config");
-
 var _guid = _interopRequireDefault(require("../../__internal__/utils/helpers/guid"));
 
 var _useLocale = _interopRequireDefault(require("../../hooks/__internal__/useLocale"));
 
+var _utils = require("../../style/utils");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
@@ -37,6 +39,8 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 
 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); }
 
+const paddingPropTypes = (0, _utils.filterStyledSystemPaddingProps)(_propTypes2.default.space);
+
 const SidebarContext = /*#__PURE__*/_react.default.createContext({});
 
 exports.SidebarContext = SidebarContext;
@@ -46,11 +50,11 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
   "aria-label": ariaLabel,
   "aria-labelledby": ariaLabelledBy,
   open,
-  disableEscKey,
-  enableBackgroundUI,
+  disableEscKey = false,
+  enableBackgroundUI = false,
   header,
-  position,
-  size,
+  position = "right",
+  size = "medium",
   children,
   onCancel,
   role = "dialog",
@@ -94,14 +98,16 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
     role: role
   }, header && /*#__PURE__*/_react.default.createElement(_sidebarHeader.default, {
     id: titleId
-  }, header), closeIcon(), /*#__PURE__*/_react.default.createElement(_box.default, {
+  }, header), closeIcon(), /*#__PURE__*/_react.default.createElement(_box.default, _extends({
     "data-element": "sidebar-content",
-    p: 4,
-    pt: "27px",
+    pt: "var(--spacing300)",
+    pb: "var(--spacing400)",
+    px: "var(--spacing400)"
+  }, (0, _utils.filterStyledSystemPaddingProps)(rest), {
     scrollVariant: "light",
     overflow: "auto",
     flex: "1"
-  }, /*#__PURE__*/_react.default.createElement(SidebarContext.Provider, {
+  }), /*#__PURE__*/_react.default.createElement(SidebarContext.Provider, {
     value: {
       isInSidebar: true
     }
@@ -121,6 +127,9 @@ const Sidebar = /*#__PURE__*/_react.default.forwardRef(({
 });
 
 Sidebar.propTypes = {
+  /** Styled system padding props to apply to Sidebar content */
+  ...paddingPropTypes,
+
   /** Prop to specify the aria-describedby property of the component */
   "aria-describedby": _propTypes.default.string,
 
@@ -146,10 +155,10 @@ Sidebar.propTypes = {
   enableBackgroundUI: _propTypes.default.bool,
 
   /** Sets the position of sidebar, either left or right. */
-  position: _propTypes.default.oneOf(_sidebar2.SIDEBAR_ALIGNMENTS),
+  position: _propTypes.default.oneOf(["left", "right"]),
 
   /** Sets the size of the sidebar when open. */
-  size: _propTypes.default.oneOf(_sidebar2.SIDEBAR_SIZES),
+  size: _propTypes.default.oneOf(["extra-small", "small", "medium-small", "medium", "medium-large", "large", "extra-large"]),
 
   /** Node that will be used as sidebar header. */
   header: _propTypes.default.node,
@@ -162,10 +171,5 @@ Sidebar.propTypes = {
     current: _propTypes.default.any
   }))
 };
-Sidebar.defaultProps = {
-  position: "right",
-  size: "medium",
-  enableBackgroundUI: false
-};
 var _default = Sidebar;
 exports.default = _default;

package/lib/components/sidebar/sidebar.d.ts

@@ -1,9 +1,10 @@
 import * as React from "react";
+import { PaddingProps } from "styled-system";
 
 export interface SidebarContextProps {
   isInSidebar: boolean;
 }
-export interface SidebarProps {
+export interface SidebarProps extends PaddingProps {
   /** Prop to specify the aria-describedby property of the component */
   "aria-describedby"?: string;
   /**

package/lib/components/sidebar/sidebar.style.js

@@ -19,7 +19,7 @@ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const SidebarStyle = _styledComponents.default.div`
+const StyledSidebar = _styledComponents.default.div`
   // prevents outline being added in safari
   :focus {
     outline: none;
@@ -59,8 +59,8 @@ const SidebarStyle = _styledComponents.default.div`
     `}
   `}
 `;
-SidebarStyle.defaultProps = {
+StyledSidebar.defaultProps = {
   theme: _base.default
 };
-var _default = SidebarStyle;
+var _default = StyledSidebar;
 exports.default = _default;

package/lib/style/fonts.css

@@ -9,28 +9,35 @@
   font-family: "Sage UI";
   font-style: normal;
   font-weight: 400;
-  src: url("~@sage/design-tokens/assets/fonts/sageui-regular.woff2") format("woff2"),
-       url("~@sage/design-tokens/assets/fonts/sageui-regular.woff") format("woff"),
-       url("~@sage/design-tokens/assets/fonts/sageui-regular.ttf") format("truetype"),
-       url("~@sage/design-tokens/assets/fonts/sageui-regular.otf") format("opentype");
+  src: url("~@sage/design-tokens/assets/fonts/sageui-regular.woff2")
+      format("woff2"),
+    url("~@sage/design-tokens/assets/fonts/sageui-regular.woff") format("woff"),
+    url("~@sage/design-tokens/assets/fonts/sageui-regular.ttf")
+      format("truetype"),
+    url("~@sage/design-tokens/assets/fonts/sageui-regular.otf")
+      format("opentype");
 }
 
 @font-face {
   font-family: "Sage UI";
   font-style: normal;
   font-weight: 700;
-  src: url("~@sage/design-tokens/assets/fonts/sageui-medium.woff2") format("woff2"),
-       url("~@sage/design-tokens/assets/fonts/sageui-medium.woff") format("woff"),
-       url("~@sage/design-tokens/assets/fonts/sageui-medium.ttf") format("truetype"),
-       url("~@sage/design-tokens/assets/fonts/sageui-medium.otf") format("opentype");
+  src: url("~@sage/design-tokens/assets/fonts/sageui-medium.woff2")
+      format("woff2"),
+    url("~@sage/design-tokens/assets/fonts/sageui-medium.woff") format("woff"),
+    url("~@sage/design-tokens/assets/fonts/sageui-medium.ttf")
+      format("truetype"),
+    url("~@sage/design-tokens/assets/fonts/sageui-medium.otf")
+      format("opentype");
 }
 
 @font-face {
   font-family: "Sage UI";
   font-style: normal;
   font-weight: 900;
-  src: url("~@sage/design-tokens/assets/fonts/sageui-bold.woff2") format("woff2"),
-       url("~@sage/design-tokens/assets/fonts/sageui-bold.woff") format("woff"),
-       url("~@sage/design-tokens/assets/fonts/sageui-bold.ttf") format("truetype"),
-       url("~@sage/design-tokens/assets/fonts/sageui-bold.otf") format("opentype");
+  src: url("~@sage/design-tokens/assets/fonts/sageui-bold.woff2")
+      format("woff2"),
+    url("~@sage/design-tokens/assets/fonts/sageui-bold.woff") format("woff"),
+    url("~@sage/design-tokens/assets/fonts/sageui-bold.ttf") format("truetype"),
+    url("~@sage/design-tokens/assets/fonts/sageui-bold.otf") format("opentype");
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "110.0.4",
+  "version": "110.1.2",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {
@@ -20,7 +20,7 @@
     "test-update": "jest --config=./jest.config.json --updateSnapshot",
     "test:cypress": "npx cypress open --e2e",
     "cypress:react": "npx cypress open --component",
-    "format": "prettier --write './src'",
+    "format": "prettier --write './src/**/*.{js,jsx,ts,tsx}'",
     "lint": "eslint ./src",
     "build": "node ./scripts/build.js",
     "copy-files": "node ./scripts/copy-files.js",
@@ -89,6 +89,7 @@
     "@storybook/theming": "^6.4.18",
     "@testing-library/jest-dom": "^5.16.2",
     "@testing-library/react": "^12.1.3",
+    "@types/crypto-js": "^4.1.1",
     "@types/enzyme": "^3.10.3",
     "@types/invariant": "^2.2.35",
     "@types/jest": "^26.0.19",
@@ -110,7 +111,6 @@
     "babel-jest": "^26.6.3",
     "babel-plugin-dev-expression": "^0.2.3",
     "browserslist": "^4.16.6",
-    "chalk": "^4.1.1",
     "chromatic": "^6.0.5",
     "commitizen": "^4.2.5",
     "conventional-changelog-conventionalcommits": "^4.5.0",
@@ -176,6 +176,7 @@
     "@styled-system/prop-types": "^5.1.5",
     "@tippyjs/react": "^4.2.5",
     "@types/styled-system": "^5.1.11",
+    "chalk": "^4.1.1",
     "ci-info": "^3.3.2",
     "classnames": "~2.2.6",
     "crypto-js": "~3.3.0",

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

@@ -1 +0,0 @@
-export type ButtonToggleIconSizes = "small" | "large";

package/esm/components/button-toggle/button-toggle.d.ts

@@ -1,45 +0,0 @@
-import * as React from "react";
-import { ButtonToggleIconSizes } from "./button-toggle-types";
-
-export interface ButtonToggleProps {
-  /** Prop to specify the aria-label of the component */
-  "aria-label"?: string;
-  /** Prop to specify the aria-labelledby property of the component */
-  "aria-labelledby"?: string;
-  /** buttonIcon to render. */
-  buttonIcon?: string;
-  /** Sets the size of the buttonIcon (eg. large) */
-  buttonIconSize?: ButtonToggleIconSizes;
-  /** 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;
-  /** ButtonToggle size */
-  size?: "small" | "medium" | "large";
-  /** Set the checked value of the radio button */
-  checked?: boolean;
-  /** A required prop. This is the button text. */
-  children: React.ReactNode;
-  /** Set the default value of the Group if component is meant to be used as uncontrolled. */
-  defaultChecked?: boolean;
-  /** Disable all user interaction. */
-  disabled?: boolean;
-  /** Remove spacing from between buttons. */
-  grouped?: boolean;
-  /** Name used on the hidden radio button. */
-  name?: string;
-  /** Callback triggered by blur event on the input. */
-  onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
-  /** Callback triggered by change event on the input. */
-  onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
-  /** Callback triggered by focus event on the input. */
-  onFocus?: (ev: React.FocusEvent<HTMLInputElement>) => void;
-  /** Value for the input */
-  value?: string;
-}
-
-declare function ButtonToggle(props: ButtonToggleProps): JSX.Element;
-
-export default ButtonToggle;

package/esm/components/loader/loader.d.ts

@@ -1,16 +0,0 @@
-import { MarginProps } from "styled-system";
-
-export interface LoaderProps extends MarginProps {
-  /** Specify an aria-label for the Loader component */
-  "aria-label"?: string;
-  /** Size of the loader. */
-  size?: "small" | "medium" | "large";
-  /** Applies white color. */
-  isInsideButton?: boolean;
-  /** Applies slate color. Available only when isInsideButton is true. */
-  isActive?: boolean;
-}
-
-declare function Loader(props: LoaderProps): JSX.Element;
-
-export default Loader;

package/esm/components/loader-bar/loader-bar.d.ts

@@ -1,10 +0,0 @@
-import { MarginProps } from "styled-system";
-
-export interface LoaderBarProps extends MarginProps {
-  /** Size of the loaderBar. */
-  size?: "small" | "medium" | "large";
-}
-
-declare function LoaderBar(props: LoaderBarProps): JSX.Element;
-
-export default LoaderBar;

package/esm/components/portrait/portrait-gravatar.d.ts

@@ -1,18 +0,0 @@
-import { PortraitSizes, PortraitShapes } from "./portrait";
-
-export interface PortraitGravatarProps {
-  /** The user's email address for the Gravatar. */
-  gravatarEmail: string;
-  /** The size of the Gravatar. */
-  size: PortraitSizes;
-  /** The shape of the Gravatar. */
-  shape?: PortraitShapes;
-  /** The `alt` HTML string. */
-  alt?: string;
-  /** A callback to execute if the Gravatar image fails to load. */
-  errorCallback?: () => void;
-}
-
-declare function PortraitGravatar(props: PortraitGravatarProps): JSX.Element;
-
-export default PortraitGravatar;

package/esm/components/portrait/portrait-initials.d.ts

@@ -1,18 +0,0 @@
-import { PortraitSizes, PortraitShapes } from "./portrait";
-
-export interface PortraitInitialsProps {
-  /** The user's initials to render. */
-  initials: string;
-  /** The size of the initials image. */
-  size: PortraitSizes;
-  /** Use a dark background. */
-  darkBackground?: boolean;
-  /** The shape of the Portrait. */
-  shape?: PortraitShapes;
-  /** The `alt` HTML string. */
-  alt?: string;
-}
-
-declare function PortraitInitials(props: PortraitInitialsProps): JSX.Element;
-
-export default PortraitInitials;

package/esm/components/portrait/portrait.d.ts

@@ -1,54 +0,0 @@
-import * as React from "react";
-
-export type PortraitShapes = "circle" | "square";
-
-export type PortraitSizes = "XS" | "S" | "M" | "ML" | "L" | "XL" | "XXL";
-
-export interface PortraitBaseProps {
-  /** The size of the Portrait. */
-  size?: PortraitSizes;
-  /** The `alt` HTML string. */
-  alt?: string;
-  /** The shape of the Portrait. */
-  shape?: PortraitShapes;
-  /** The initials to render in the Portrait. */
-  initials?: string;
-  /** Use a dark background. */
-  darkBackground?: boolean;
-  /** Prop for `onClick` events. */
-  onClick?: (ev: React.MouseEvent<HTMLElement>) => void;
-  /** The message to be displayed within the tooltip */
-  tooltipMessage?: React.ReactNode;
-  /** The id attribute to use for the tooltip */
-  tooltipId?: string;
-  /** Whether to to show the Tooltip */
-  tooltipIsVisible?: boolean;
-  /** Sets position of the tooltip */
-  tooltipPosition?: "top" | "bottom" | "left" | "right";
-  /** Defines the message type */
-  tooltipType?: string;
-  /** Defines the size of the tooltip content */
-  tooltipSize?: "medium" | "large";
-  /** Override background color of the Tooltip, provide any color from palette or any valid css color value. */
-  tooltipBgColor?: string;
-  /** Override font color of the Tooltip, provide any color from palette or any valid css color value. */
-  tooltipFontColor?: string;
-}
-
-export interface PortraitWithGravatar extends PortraitBaseProps {
-  /** An email address registered with Gravatar. */
-  gravatar?: string;
-  src?: never;
-}
-
-export interface PortraitWithSrc extends PortraitBaseProps {
-  /** A custom image URL. */
-  src?: string;
-  gravatar?: never;
-}
-
-export type PortraitProps = PortraitWithGravatar | PortraitWithSrc;
-
-declare function Portrait(props: PortraitProps): JSX.Element;
-
-export default Portrait;

package/lib/components/button-toggle/button-toggle-types.d.ts

@@ -1 +0,0 @@
-export type ButtonToggleIconSizes = "small" | "large";

package/lib/components/button-toggle/button-toggle.d.ts

@@ -1,45 +0,0 @@
-import * as React from "react";
-import { ButtonToggleIconSizes } from "./button-toggle-types";
-
-export interface ButtonToggleProps {
-  /** Prop to specify the aria-label of the component */
-  "aria-label"?: string;
-  /** Prop to specify the aria-labelledby property of the component */
-  "aria-labelledby"?: string;
-  /** buttonIcon to render. */
-  buttonIcon?: string;
-  /** Sets the size of the buttonIcon (eg. large) */
-  buttonIconSize?: ButtonToggleIconSizes;
-  /** 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;
-  /** ButtonToggle size */
-  size?: "small" | "medium" | "large";
-  /** Set the checked value of the radio button */
-  checked?: boolean;
-  /** A required prop. This is the button text. */
-  children: React.ReactNode;
-  /** Set the default value of the Group if component is meant to be used as uncontrolled. */
-  defaultChecked?: boolean;
-  /** Disable all user interaction. */
-  disabled?: boolean;
-  /** Remove spacing from between buttons. */
-  grouped?: boolean;
-  /** Name used on the hidden radio button. */
-  name?: string;
-  /** Callback triggered by blur event on the input. */
-  onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
-  /** Callback triggered by change event on the input. */
-  onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
-  /** Callback triggered by focus event on the input. */
-  onFocus?: (ev: React.FocusEvent<HTMLInputElement>) => void;
-  /** Value for the input */
-  value?: string;
-}
-
-declare function ButtonToggle(props: ButtonToggleProps): JSX.Element;
-
-export default ButtonToggle;

package/lib/components/loader/loader.d.ts

@@ -1,16 +0,0 @@
-import { MarginProps } from "styled-system";
-
-export interface LoaderProps extends MarginProps {
-  /** Specify an aria-label for the Loader component */
-  "aria-label"?: string;
-  /** Size of the loader. */
-  size?: "small" | "medium" | "large";
-  /** Applies white color. */
-  isInsideButton?: boolean;
-  /** Applies slate color. Available only when isInsideButton is true. */
-  isActive?: boolean;
-}
-
-declare function Loader(props: LoaderProps): JSX.Element;
-
-export default Loader;