@orfium/ictinus 4.33.0 → 4.34.0

package/dist/components/Avatar/Avatar.d.ts

@@ -1,24 +1,6 @@
 import React from 'react';
 import { DivProps } from '../../utils/common';
-import { AcceptedIconNames } from '../Icon/types';
-export declare type Props = {
-    /** the src of the image to show **/
-    src?: string;
-    /** The icon name to pick from our library of icons
-     *  @default 'user'
-     * */
-    iconName?: AcceptedIconNames;
-    /** The size of the avatar
-     *  @default 'md'
-     * */
-    size?: AvatarSizes;
-    /** the color of the button based on our colors eg. red-500
-     *  @default 'darkGrey-500'
-     * */
-    color?: string;
-    /** The class name of the avatar component if its styled **/
-    className?: string;
-};
-export declare type AvatarSizes = 'xs' | 'sm' | 'md' | 'lg';
+import { Props, AvatarSizes } from './Avatar.types';
 declare const Avatar: React.ForwardRefExoticComponent<Pick<Props & DivProps, "children" | "onChange" | "onBlur" | "onClick" | "type" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "download" | "encType" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "span" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "useMap" | "width" | "wmode" | "wrap" | "key" | keyof Props> & React.RefAttributes<HTMLDivElement>>;
 export default Avatar;
+export { Props, AvatarSizes };

package/dist/components/Avatar/Avatar.js

@@ -13,25 +13,16 @@ var _Icon = _interopRequireDefault(require("../Icon"));
 
 var _Avatar = require("./Avatar.style");
 
-var _react2 = require("@emotion/react");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var _Avatar2 = require("./Avatar.types");
 
-var iconSizeBasedOnAvatar = function iconSizeBasedOnAvatar(size) {
-  switch (size) {
-    case 'md':
-      return 16;
+exports.Props = _Avatar2.Props;
+exports.AvatarSizes = _Avatar2.AvatarSizes;
 
-    case 'sm':
-      return 12;
+var _utils = require("./utils");
 
-    case 'xs':
-      return 10;
+var _react2 = require("@emotion/react");
 
-    default:
-      return 28;
-  }
-};
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var Avatar = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
   var _ref$src = _ref.src,
@@ -59,10 +50,11 @@ var Avatar = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
   }), !src && !children && iconName && (0, _react2.jsx)(_Icon["default"], {
     color: theme.utils.getAAColorFromSwatches(calculatedColor.color, calculatedColor.shade),
     name: iconName,
-    size: iconSizeBasedOnAvatar(size)
+    size: (0, _utils.iconSizeBasedOnAvatar)(size)
   }), !src && children);
 });
 
 Avatar.displayName = 'Avatar';
-var _default = Avatar;
+var _default = Avatar; //TODO: Remove on v5 and change import where necessary
+
 exports["default"] = _default;

package/dist/components/Avatar/Avatar.types.d.ts

@@ -0,0 +1,20 @@
+import { AcceptedIconNames } from '../Icon/types';
+export declare type Props = {
+    /** the src of the image to show **/
+    src?: string;
+    /** The icon name to pick from our library of icons
+     *  @default 'user'
+     * */
+    iconName?: AcceptedIconNames;
+    /** The size of the avatar
+     *  @default 'md'
+     * */
+    size?: AvatarSizes;
+    /** the color of the button based on our colors eg. red-500
+     *  @default 'darkGrey-500'
+     * */
+    color?: string;
+    /** The class name of the avatar component if its styled **/
+    className?: string;
+};
+export declare type AvatarSizes = 'xs' | 'sm' | 'md' | 'lg';

package/dist/components/Avatar/Avatar.types.js

@@ -0,0 +1,3 @@
+"use strict";
+
+exports.__esModule = true;

package/dist/components/Avatar/AvatarStack/AvatarStack.d.ts

@@ -1,17 +1,7 @@
 import React from 'react';
 import { DivProps } from 'utils/common';
-import { TestId } from 'utils/types';
-import { AvatarSizes } from '../Avatar';
-export declare type Props = {
-    /** the maximum number of avatars to be displayed **/
-    maxAvatars?: number;
-    /** The size of the extra avatar, if any **/
-    size?: AvatarSizes;
-    /** the color of the extra avatar based on our colors eg. red-500 **/
-    color?: string;
-};
-declare type TestProps = {
-    dataTestId?: TestId;
-};
+import { TestProps } from 'utils/types';
+import { Props } from './AvatarStack.types';
 declare const AvatarStack: React.ForwardRefExoticComponent<Pick<Props & TestProps & DivProps, "children" | "onChange" | "onBlur" | "onClick" | "type" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "download" | "encType" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "useMap" | "width" | "wmode" | "wrap" | "key" | "dataTestId" | keyof Props> & React.RefAttributes<HTMLDivElement>>;
 export default AvatarStack;
+export { Props };

package/dist/components/Avatar/AvatarStack/AvatarStack.js

@@ -11,6 +11,12 @@ var _Avatar = _interopRequireDefault(require("../Avatar"));
 
 var _AvatarStack = require("./AvatarStack.style");
 
+var _AvatarStack2 = require("./AvatarStack.types");
+
+exports.Props = _AvatarStack2.Props;
+
+var _utils = require("./utils");
+
 var _react2 = require("@emotion/react");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -29,10 +35,9 @@ var AvatarStack = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref)
       _ref$dataTestId = _ref.dataTestId,
       dataTestId = _ref$dataTestId === void 0 ? '' : _ref$dataTestId,
       childrenProp = _ref.children;
-
-  if (maxAvatars < 1) {
-    throw new Error('maxAvatars prop must be greater than 0');
-  }
+  (0, _helpers.errorHandler)(_utils.errors, {
+    maxAvatars: maxAvatars
+  });
 
   var children = _react["default"].Children.toArray(childrenProp);
 
@@ -66,5 +71,6 @@ var AvatarStack = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref)
 });
 
 AvatarStack.displayName = 'AvatarStack';
-var _default = AvatarStack;
+var _default = AvatarStack; //TODO: Remove on v5 and change import where necessary
+
 exports["default"] = _default;

package/dist/components/Avatar/AvatarStack/AvatarStack.types.d.ts

@@ -0,0 +1,9 @@
+import { AvatarSizes } from '../Avatar';
+export declare type Props = {
+    /** the maximum number of avatars to be displayed **/
+    maxAvatars?: number;
+    /** The size of the extra avatar, if any **/
+    size?: AvatarSizes;
+    /** the color of the extra avatar based on our colors eg. red-500 **/
+    color?: string;
+};

package/dist/components/Avatar/AvatarStack/AvatarStack.types.js

@@ -0,0 +1,3 @@
+"use strict";
+
+exports.__esModule = true;

package/dist/components/Avatar/AvatarStack/utils.d.ts

@@ -0,0 +1,6 @@
+import { PropsValidationError } from '../../../utils/errors';
+import { Props } from './AvatarStack.types';
+export declare const errors: {
+    condition: ({ maxAvatars }: Props) => boolean;
+    error: PropsValidationError;
+}[];

package/dist/components/Avatar/AvatarStack/utils.js

@@ -0,0 +1,16 @@
+"use strict";
+
+exports.__esModule = true;
+exports.errors = void 0;
+
+var _errors = require("../../../utils/errors");
+
+var errors = [{
+  condition: function condition(_ref) {
+    var _ref$maxAvatars = _ref.maxAvatars,
+        maxAvatars = _ref$maxAvatars === void 0 ? 4 : _ref$maxAvatars;
+    return Boolean(maxAvatars < 1);
+  },
+  error: new _errors.PropsValidationError('maxAvatars prop must be greater than 0')
+}];
+exports.errors = errors;

package/dist/components/Avatar/utils.d.ts

@@ -0,0 +1,2 @@
+import { AvatarSizes } from './Avatar.types';
+export declare const iconSizeBasedOnAvatar: (size: AvatarSizes) => 16 | 10 | 12 | 28;

package/dist/components/Avatar/utils.js

@@ -0,0 +1,22 @@
+"use strict";
+
+exports.__esModule = true;
+exports.iconSizeBasedOnAvatar = void 0;
+
+var iconSizeBasedOnAvatar = function iconSizeBasedOnAvatar(size) {
+  switch (size) {
+    case 'md':
+      return 16;
+
+    case 'sm':
+      return 12;
+
+    case 'xs':
+      return 10;
+
+    default:
+      return 28;
+  }
+};
+
+exports.iconSizeBasedOnAvatar = iconSizeBasedOnAvatar;

package/dist/components/Button/utils.d.ts

@@ -5,7 +5,7 @@ import { ColorShapeFromComponent } from '../../utils/themeFunctions';
  * if color it retrieves the color directly from the palette
  * if type it gets the specific type color from the palette
  */
-export declare const defineBackgroundColor: (theme: Theme, color: ColorShapeFromComponent | undefined, type?: "primary" | "secondary" | "success" | "error" | "warning" | "info" | "light" | "link" | undefined, iconExists?: boolean | undefined, childrenExists?: boolean | undefined) => string;
+export declare const defineBackgroundColor: (theme: Theme, color: ColorShapeFromComponent | undefined, type?: "primary" | "secondary" | "light" | "success" | "error" | "warning" | "info" | "link" | undefined, iconExists?: boolean | undefined, childrenExists?: boolean | undefined) => string;
 /**
  * return the correct color to show based on the state that is passed
  * The state must be 'hover' or 'active' for now

package/dist/components/ButtonBase/utils.d.ts

@@ -6,7 +6,7 @@ import { Props } from './ButtonBase';
  * if color it retrieves the color directly from the palette
  * if type it gets the specific type color from the palette
  */
-export declare const defineBackgroundColor: (theme: Theme, color: ColorShapeFromComponent | undefined, type?: "primary" | "secondary" | "success" | "error" | "warning" | "info" | "light" | "link" | undefined, childrenExists?: boolean | undefined) => string;
+export declare const defineBackgroundColor: (theme: Theme, color: ColorShapeFromComponent | undefined, type?: "primary" | "secondary" | "light" | "success" | "error" | "warning" | "info" | "link" | undefined, childrenExists?: boolean | undefined) => string;
 /**
  * This function defines what color to show based on type or color passed
  * if type is link uses the link color

package/dist/components/Chip/Chip.d.ts

@@ -1,36 +1,3 @@
-import { ClickEvent } from 'hooks/useLoading';
 import React from 'react';
-import { flatColors } from 'theme/palette';
-import { TestId } from 'utils/types';
-import { DivProps } from '../../utils/common';
-export declare type Props = {
-    /**
-     * Determines whether the chip should be read-only or interactive.
-     * @default read-only
-     */
-    styleType?: 'read-only' | 'interactive';
-    /** Defines the fill color of the component, if filled. */
-    fill?: typeof flatColors[number];
-    /** An optional thumbnail to show to the left. */
-    thumbnail?: {
-        src?: string;
-        name?: string;
-    };
-    /** Boolean defining if the chip is selected. */
-    isSelected?: boolean;
-    /** Boolean defining if the check icon is shown. */
-    isChecked?: boolean;
-    /** Defines the number value of the badge */
-    badgeNumber?: number;
-    /** Callback function for onClick. */
-    onClick?: (event: ClickEvent) => void;
-    /** A callback that is being triggered when type is interactive and you press the X icon. */
-    onClear?: () => void;
-    /** Boolean defining if the chip is disabled. Interactive only. */
-    disabled?: boolean;
-};
-declare type TestProps = {
-    dataTestId?: TestId;
-};
-declare const Chip: React.ForwardRefExoticComponent<Pick<Props & TestProps & DivProps, "children" | "onChange" | "color" | "onBlur" | "type" | "autoFocus" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "download" | "encType" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "open" | "optimum" | "pattern" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "useMap" | "width" | "wmode" | "wrap" | "key" | "dataTestId" | keyof Props> & React.RefAttributes<HTMLButtonElement>>;
+declare const Chip: React.ForwardRefExoticComponent<import("./Chip.types").Props & import("../../utils/types").TestProps & Partial<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "css" | "onBlur" | "onClick" | "type">> & React.RefAttributes<HTMLButtonElement>>;
 export default Chip;

package/dist/components/Chip/Chip.js

@@ -13,38 +13,44 @@ var _Chip = require("./Chip.style");
 
 var _Badge = _interopRequireDefault(require("./components/Badge"));
 
+var _utils = require("./utils");
+
 var _Avatar = _interopRequireDefault(require("../Avatar"));
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
 var _react2 = require("@emotion/react");
 
+var _excluded = ["styleType", "disabled", "dataTestId"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var Chip = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
   var _ref$styleType = _ref.styleType,
-      styleType = _ref$styleType === void 0 ? 'read-only' : _ref$styleType,
-      fill = _ref.fill,
-      thumbnail = _ref.thumbnail,
-      isSelected = _ref.isSelected,
-      isChecked = _ref.isChecked,
+      styleType = _ref$styleType === void 0 ? _utils.defaultProps.styleType : _ref$styleType,
       _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      badgeNumber = _ref.badgeNumber,
-      onClick = _ref.onClick,
-      onClear = _ref.onClear,
+      disabled = _ref$disabled === void 0 ? _utils.defaultProps.disabled : _ref$disabled,
       _ref$dataTestId = _ref.dataTestId,
-      dataTestId = _ref$dataTestId === void 0 ? '' : _ref$dataTestId,
-      children = _ref.children;
-
-  if (styleType === 'read-only' && (isSelected || isChecked || badgeNumber || disabled)) {
-    throw new Error('The properties isSelected, isChecked, badgeNumber and disabled are only for Interactive style type Chips.');
-  }
-
-  if (styleType === 'interactive' && thumbnail) {
-    throw new Error('The property thumbnail is only for Read-Only style type Chips.');
-  }
-
+      dataTestId = _ref$dataTestId === void 0 ? _utils.defaultProps.dataTestId : _ref$dataTestId,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var onClick = rest.onClick,
+      isChecked = rest.isChecked,
+      thumbnail = rest.thumbnail,
+      fill = rest.fill,
+      isSelected = rest.isSelected,
+      onClear = rest.onClear,
+      children = rest.children,
+      badgeNumber = rest.badgeNumber;
+  (0, _helpers.errorHandler)(_utils.errors, {
+    styleType: styleType,
+    isSelected: isSelected,
+    isChecked: isChecked,
+    badgeNumber: badgeNumber,
+    disabled: disabled
+  });
   return (0, _react2.jsx)("button", {
     ref: ref,
     "data-testid": (0, _helpers.generateTestDataId)('chip', dataTestId),
@@ -55,8 +61,7 @@ var Chip = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
       fill: fill,
       isSelected: isSelected,
       onClear: onClear,
-      onClick: onClick,
-      disabled: disabled
+      onClick: onClick
     })
   }, isChecked && (0, _react2.jsx)(_Icon["default"], {
     size: 14,

package/dist/components/Chip/Chip.style.d.ts

@@ -1,5 +1,5 @@
 import { SerializedStyles } from '@emotion/react';
 import { Theme } from '../../theme';
-import { Props } from './Chip';
-export declare const chipStyle: ({ styleType, fill, isSelected, onClear, onClick, }: Props) => (theme: Theme) => SerializedStyles;
+import { Props } from './Chip.types';
+export declare const chipStyle: ({ styleType, fill, isSelected, onClear, onClick, }: Pick<Props, 'styleType' | 'fill' | 'isSelected' | 'onClear' | 'onClick'>) => (theme: Theme) => SerializedStyles;
 export declare const closeIconWrapperStyle: (disabled?: boolean | undefined) => () => SerializedStyles;

package/dist/components/Chip/Chip.style.js

@@ -38,7 +38,7 @@ var chipStyle = function chipStyle(_ref) {
         theme: theme,
         color: fill,
         shade: 50
-      }).backgroundColor + ";\n    }\n\n    \n      :disabled {\n        opacity: " + (0, _states.getDisabled)().opacity + ";\n        cursor: " + (0, _states.getDisabled)().cursor + ";\n      }\n    ", ">:not(:last-child){margin-right:", theme.spacing.xsm, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:chipStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQlkiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQ2hpcC9DaGlwLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZmxleENlbnRlclZlcnRpY2FsIH0gZnJvbSAndGhlbWUvZnVuY3Rpb25zJztcbmltcG9ydCB7IHJlbSB9IGZyb20gJ3RoZW1lL3V0aWxzJztcblxuaW1wb3J0IHsgVGhlbWUgfSBmcm9tICcuLi8uLi90aGVtZSc7XG5pbXBvcnQgeyBnZXREaXNhYmxlZCwgZ2V0Rm9jdXMsIGdldEhvdmVyLCBnZXRQcmVzc2VkIH0gZnJvbSAnLi4vLi4vdGhlbWUvc3RhdGVzJztcbmltcG9ydCB7IFByb3BzIH0gZnJvbSAnLi9DaGlwJztcblxuZXhwb3J0IGNvbnN0IGNoaXBTdHlsZSA9ICh7XG4gIHN0eWxlVHlwZSxcbiAgZmlsbCA9ICdncmV5U2NhbGUnLFxuICBpc1NlbGVjdGVkLFxuICBvbkNsZWFyLFxuICBvbkNsaWNrLFxufTogUHJvcHMpID0+ICh0aGVtZTogVGhlbWUpOiBTZXJpYWxpemVkU3R5bGVzID0+IHtcbiAgY29uc3QgaXNJbnRlcmFjdGl2ZSA9IHN0eWxlVHlwZSA9PT0gJ2ludGVyYWN0aXZlJztcbiAgY29uc3QgY3VzdG9tRmlsbGVkID0gc3R5bGVUeXBlID09PSAncmVhZC1vbmx5JyB8fCBvbkNsZWFyIHx8IGlzU2VsZWN0ZWQ7XG5cbiAgcmV0dXJuIGNzc2BcbiAgICAke2ZsZXhDZW50ZXJWZXJ0aWNhbH07XG4gICAgaGVpZ2h0OiAke3RoZW1lLnNwYWNpbmcubGd9O1xuICAgIGJvcmRlci1yYWRpdXM6ICR7dGhlbWUuc3BhY2luZy5sZ307XG4gICAgZm9udC1zaXplOiAke3RoZW1lLnR5cG9ncmFwaHkuZm9udFNpemVzWycxMiddfTtcbiAgICBmb250LXdlaWdodDogJHt0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMubWVkaXVtfTtcbiAgICBsaW5lLWhlaWdodDogbm9ybWFsO1xuICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgcGFkZGluZzogJHt0aGVtZS5zcGFjaW5nLnhzbX0gJHt0aGVtZS5zcGFjaW5nLnNtfTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke2N1c3RvbUZpbGxlZCA/IHRoZW1lLnV0aWxzLmdldENvbG9yKGZpbGwsIDUwKSA6IHRoZW1lLnBhbGV0dGUud2hpdGV9O1xuICAgIGNvbG9yOiAke3RoZW1lLnV0aWxzLmdldEFBQ29sb3JGcm9tU3dhdGNoZXMoZmlsbCwgNTApfTtcbiAgICBib3JkZXI6ICR7cmVtKDEpfSBzb2xpZFxuICAgICAgJHtjdXN0b21GaWxsZWQgPyB0aGVtZS51dGlscy5nZXRDb2xvcihmaWxsLCA1NTApIDogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2xpZ2h0R3JleScsIDIwMCl9O1xuICAgIGN1cnNvcjogJHtvbkNsaWNrID8gJ3BvaW50ZXInIDogJ2F1dG8nfTtcbiAgICB3aWR0aDogZml0LWNvbnRlbnQ7XG4gICAgdHJhbnNpdGlvbjogYmFja2dyb3VuZC1jb2xvciAxNTBtcyBsaW5lYXI7XG5cbiAgICAmOmhvdmVyOm5vdCg6ZGlzYWJsZWQpIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7Y3VzdG9tRmlsbGVkXG4gICAgICAgID8gZ2V0SG92ZXIoeyB0aGVtZSwgY29sb3I6IGZpbGwsIHNoYWRlOiA1MCB9KS5iYWNrZ3JvdW5kQ29sb3JcbiAgICAgICAgOiBnZXRIb3Zlcih7IHRoZW1lIH0pLmJhY2tncm91bmRDb2xvcn07XG4gICAgfVxuXG4gICAgJjpmb2N1cy12aXNpYmxlOm5vdCg6ZGlzYWJsZWQpIHtcbiAgICAgIG91dGxpbmU6ICR7IWlzSW50ZXJhY3RpdmUgPyAnbm9uZScgOiBnZXRGb2N1cyh7IHRoZW1lLCBib3JkZXJXaWR0aDogMSB9KS5zdHlsZU91dGxpbmV9O1xuICAgIH1cblxuICAgICR7aXNJbnRlcmFjdGl2ZSAmJlxuICAgICAgYFxuICAgICY6YWN0aXZlOm5vdCg6ZGlzYWJsZWQpIHtcbiAgICAgIGJhY2tncm91bmQ6ICR7XG4gICAgICAgIGdldFByZXNzZWQoe1xuICAgICAgICAgIHRoZW1lLFxuICAgICAgICAgIGNvbG9yOiBmaWxsLFxuICAgICAgICAgIHNoYWRlOiA1MCxcbiAgICAgICAgfSkuYmFja2dyb3VuZENvbG9yXG4gICAgICB9O1xuICAgIH1cblxuICAgIFxuICAgICAgOmRpc2FibGVkIHtcbiAgICAgICAgb3BhY2l0eTogJHtnZXREaXNhYmxlZCgpLm9wYWNpdHl9O1xuICAgICAgICBjdXJzb3I6ICR7Z2V0RGlzYWJsZWQoKS5jdXJzb3J9O1xuICAgICAgfVxuICAgIGB9XG5cbiAgICA+IDpub3QoOmxhc3QtY2hpbGQpIHtcbiAgICAgIG1hcmdpbi1yaWdodDogJHt0aGVtZS5zcGFjaW5nLnhzbX07XG4gICAgfVxuICBgO1xufTtcblxuZXhwb3J0IGNvbnN0IGNsb3NlSWNvbldyYXBwZXJTdHlsZSA9IChkaXNhYmxlZD86IGJvb2xlYW4pID0+ICgpOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgY3Vyc29yOiAke2Rpc2FibGVkID8gZ2V0RGlzYWJsZWQoKS5jdXJzb3IgOiAncG9pbnRlcid9O1xuYDtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:chipStyle;")
+      }).backgroundColor + ";\n    }\n\n    \n      :disabled {\n        opacity: " + (0, _states.getDisabled)().opacity + ";\n        cursor: " + (0, _states.getDisabled)().cursor + ";\n      }\n    ", ">:not(:last-child){margin-right:", theme.spacing.xsm, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:chipStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQlkiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQ2hpcC9DaGlwLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgZmxleENlbnRlclZlcnRpY2FsIH0gZnJvbSAndGhlbWUvZnVuY3Rpb25zJztcbmltcG9ydCB7IHJlbSB9IGZyb20gJ3RoZW1lL3V0aWxzJztcblxuaW1wb3J0IHsgVGhlbWUgfSBmcm9tICcuLi8uLi90aGVtZSc7XG5pbXBvcnQgeyBnZXREaXNhYmxlZCwgZ2V0Rm9jdXMsIGdldEhvdmVyLCBnZXRQcmVzc2VkIH0gZnJvbSAnLi4vLi4vdGhlbWUvc3RhdGVzJztcbmltcG9ydCB7IFByb3BzIH0gZnJvbSAnLi9DaGlwLnR5cGVzJztcblxuZXhwb3J0IGNvbnN0IGNoaXBTdHlsZSA9ICh7XG4gIHN0eWxlVHlwZSxcbiAgZmlsbCA9ICdncmV5U2NhbGUnLFxuICBpc1NlbGVjdGVkLFxuICBvbkNsZWFyLFxuICBvbkNsaWNrLFxufTogUGljazxQcm9wcywgJ3N0eWxlVHlwZScgfCAnZmlsbCcgfCAnaXNTZWxlY3RlZCcgfCAnb25DbGVhcicgfCAnb25DbGljayc+KSA9PiAoXG4gIHRoZW1lOiBUaGVtZVxuKTogU2VyaWFsaXplZFN0eWxlcyA9PiB7XG4gIGNvbnN0IGlzSW50ZXJhY3RpdmUgPSBzdHlsZVR5cGUgPT09ICdpbnRlcmFjdGl2ZSc7XG4gIGNvbnN0IGN1c3RvbUZpbGxlZCA9IHN0eWxlVHlwZSA9PT0gJ3JlYWQtb25seScgfHwgb25DbGVhciB8fCBpc1NlbGVjdGVkO1xuXG4gIHJldHVybiBjc3NgXG4gICAgJHtmbGV4Q2VudGVyVmVydGljYWx9O1xuICAgIGhlaWdodDogJHt0aGVtZS5zcGFjaW5nLmxnfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3RoZW1lLnNwYWNpbmcubGd9O1xuICAgIGZvbnQtc2l6ZTogJHt0aGVtZS50eXBvZ3JhcGh5LmZvbnRTaXplc1snMTInXX07XG4gICAgZm9udC13ZWlnaHQ6ICR7dGhlbWUudHlwb2dyYXBoeS53ZWlnaHRzLm1lZGl1bX07XG4gICAgbGluZS1oZWlnaHQ6IG5vcm1hbDtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIHBhZGRpbmc6ICR7dGhlbWUuc3BhY2luZy54c219ICR7dGhlbWUuc3BhY2luZy5zbX07XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtjdXN0b21GaWxsZWQgPyB0aGVtZS51dGlscy5nZXRDb2xvcihmaWxsLCA1MCkgOiB0aGVtZS5wYWxldHRlLndoaXRlfTtcbiAgICBjb2xvcjogJHt0aGVtZS51dGlscy5nZXRBQUNvbG9yRnJvbVN3YXRjaGVzKGZpbGwsIDUwKX07XG4gICAgYm9yZGVyOiAke3JlbSgxKX0gc29saWRcbiAgICAgICR7Y3VzdG9tRmlsbGVkID8gdGhlbWUudXRpbHMuZ2V0Q29sb3IoZmlsbCwgNTUwKSA6IHRoZW1lLnV0aWxzLmdldENvbG9yKCdsaWdodEdyZXknLCAyMDApfTtcbiAgICBjdXJzb3I6ICR7b25DbGljayA/ICdwb2ludGVyJyA6ICdhdXRvJ307XG4gICAgd2lkdGg6IGZpdC1jb250ZW50O1xuICAgIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgMTUwbXMgbGluZWFyO1xuXG4gICAgJjpob3Zlcjpub3QoOmRpc2FibGVkKSB7XG4gICAgICBiYWNrZ3JvdW5kOiAke2N1c3RvbUZpbGxlZFxuICAgICAgICA/IGdldEhvdmVyKHsgdGhlbWUsIGNvbG9yOiBmaWxsLCBzaGFkZTogNTAgfSkuYmFja2dyb3VuZENvbG9yXG4gICAgICAgIDogZ2V0SG92ZXIoeyB0aGVtZSB9KS5iYWNrZ3JvdW5kQ29sb3J9O1xuICAgIH1cblxuICAgICY6Zm9jdXMtdmlzaWJsZTpub3QoOmRpc2FibGVkKSB7XG4gICAgICBvdXRsaW5lOiAkeyFpc0ludGVyYWN0aXZlID8gJ25vbmUnIDogZ2V0Rm9jdXMoeyB0aGVtZSwgYm9yZGVyV2lkdGg6IDEgfSkuc3R5bGVPdXRsaW5lfTtcbiAgICB9XG5cbiAgICAke2lzSW50ZXJhY3RpdmUgJiZcbiAgICAgIGBcbiAgICAmOmFjdGl2ZTpub3QoOmRpc2FibGVkKSB7XG4gICAgICBiYWNrZ3JvdW5kOiAke1xuICAgICAgICBnZXRQcmVzc2VkKHtcbiAgICAgICAgICB0aGVtZSxcbiAgICAgICAgICBjb2xvcjogZmlsbCxcbiAgICAgICAgICBzaGFkZTogNTAsXG4gICAgICAgIH0pLmJhY2tncm91bmRDb2xvclxuICAgICAgfTtcbiAgICB9XG5cbiAgICBcbiAgICAgIDpkaXNhYmxlZCB7XG4gICAgICAgIG9wYWNpdHk6ICR7Z2V0RGlzYWJsZWQoKS5vcGFjaXR5fTtcbiAgICAgICAgY3Vyc29yOiAke2dldERpc2FibGVkKCkuY3Vyc29yfTtcbiAgICAgIH1cbiAgICBgfVxuXG4gICAgPiA6bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgICBtYXJnaW4tcmlnaHQ6ICR7dGhlbWUuc3BhY2luZy54c219O1xuICAgIH1cbiAgYDtcbn07XG5cbmV4cG9ydCBjb25zdCBjbG9zZUljb25XcmFwcGVyU3R5bGUgPSAoZGlzYWJsZWQ/OiBib29sZWFuKSA9PiAoKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIGN1cnNvcjogJHtkaXNhYmxlZCA/IGdldERpc2FibGVkKCkuY3Vyc29yIDogJ3BvaW50ZXInfTtcbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:chipStyle;")
     );
   };
 };
@@ -51,7 +51,7 @@ var closeIconWrapperStyle = function closeIconWrapperStyle(disabled) {
       /*#__PURE__*/
 
       /*#__PURE__*/
-      (0, _react.css)("cursor:", disabled ? (0, _states.getDisabled)().cursor : 'pointer', ";" + (process.env.NODE_ENV === "production" ? "" : ";label:closeIconWrapperStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzRXdGIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGZsZXhDZW50ZXJWZXJ0aWNhbCB9IGZyb20gJ3RoZW1lL2Z1bmN0aW9ucyc7XG5pbXBvcnQgeyByZW0gfSBmcm9tICd0aGVtZS91dGlscyc7XG5cbmltcG9ydCB7IFRoZW1lIH0gZnJvbSAnLi4vLi4vdGhlbWUnO1xuaW1wb3J0IHsgZ2V0RGlzYWJsZWQsIGdldEZvY3VzLCBnZXRIb3ZlciwgZ2V0UHJlc3NlZCB9IGZyb20gJy4uLy4uL3RoZW1lL3N0YXRlcyc7XG5pbXBvcnQgeyBQcm9wcyB9IGZyb20gJy4vQ2hpcCc7XG5cbmV4cG9ydCBjb25zdCBjaGlwU3R5bGUgPSAoe1xuICBzdHlsZVR5cGUsXG4gIGZpbGwgPSAnZ3JleVNjYWxlJyxcbiAgaXNTZWxlY3RlZCxcbiAgb25DbGVhcixcbiAgb25DbGljayxcbn06IFByb3BzKSA9PiAodGhlbWU6IFRoZW1lKTogU2VyaWFsaXplZFN0eWxlcyA9PiB7XG4gIGNvbnN0IGlzSW50ZXJhY3RpdmUgPSBzdHlsZVR5cGUgPT09ICdpbnRlcmFjdGl2ZSc7XG4gIGNvbnN0IGN1c3RvbUZpbGxlZCA9IHN0eWxlVHlwZSA9PT0gJ3JlYWQtb25seScgfHwgb25DbGVhciB8fCBpc1NlbGVjdGVkO1xuXG4gIHJldHVybiBjc3NgXG4gICAgJHtmbGV4Q2VudGVyVmVydGljYWx9O1xuICAgIGhlaWdodDogJHt0aGVtZS5zcGFjaW5nLmxnfTtcbiAgICBib3JkZXItcmFkaXVzOiAke3RoZW1lLnNwYWNpbmcubGd9O1xuICAgIGZvbnQtc2l6ZTogJHt0aGVtZS50eXBvZ3JhcGh5LmZvbnRTaXplc1snMTInXX07XG4gICAgZm9udC13ZWlnaHQ6ICR7dGhlbWUudHlwb2dyYXBoeS53ZWlnaHRzLm1lZGl1bX07XG4gICAgbGluZS1oZWlnaHQ6IG5vcm1hbDtcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIHBhZGRpbmc6ICR7dGhlbWUuc3BhY2luZy54c219ICR7dGhlbWUuc3BhY2luZy5zbX07XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHtjdXN0b21GaWxsZWQgPyB0aGVtZS51dGlscy5nZXRDb2xvcihmaWxsLCA1MCkgOiB0aGVtZS5wYWxldHRlLndoaXRlfTtcbiAgICBjb2xvcjogJHt0aGVtZS51dGlscy5nZXRBQUNvbG9yRnJvbVN3YXRjaGVzKGZpbGwsIDUwKX07XG4gICAgYm9yZGVyOiAke3JlbSgxKX0gc29saWRcbiAgICAgICR7Y3VzdG9tRmlsbGVkID8gdGhlbWUudXRpbHMuZ2V0Q29sb3IoZmlsbCwgNTUwKSA6IHRoZW1lLnV0aWxzLmdldENvbG9yKCdsaWdodEdyZXknLCAyMDApfTtcbiAgICBjdXJzb3I6ICR7b25DbGljayA/ICdwb2ludGVyJyA6ICdhdXRvJ307XG4gICAgd2lkdGg6IGZpdC1jb250ZW50O1xuICAgIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgMTUwbXMgbGluZWFyO1xuXG4gICAgJjpob3Zlcjpub3QoOmRpc2FibGVkKSB7XG4gICAgICBiYWNrZ3JvdW5kOiAke2N1c3RvbUZpbGxlZFxuICAgICAgICA/IGdldEhvdmVyKHsgdGhlbWUsIGNvbG9yOiBmaWxsLCBzaGFkZTogNTAgfSkuYmFja2dyb3VuZENvbG9yXG4gICAgICAgIDogZ2V0SG92ZXIoeyB0aGVtZSB9KS5iYWNrZ3JvdW5kQ29sb3J9O1xuICAgIH1cblxuICAgICY6Zm9jdXMtdmlzaWJsZTpub3QoOmRpc2FibGVkKSB7XG4gICAgICBvdXRsaW5lOiAkeyFpc0ludGVyYWN0aXZlID8gJ25vbmUnIDogZ2V0Rm9jdXMoeyB0aGVtZSwgYm9yZGVyV2lkdGg6IDEgfSkuc3R5bGVPdXRsaW5lfTtcbiAgICB9XG5cbiAgICAke2lzSW50ZXJhY3RpdmUgJiZcbiAgICAgIGBcbiAgICAmOmFjdGl2ZTpub3QoOmRpc2FibGVkKSB7XG4gICAgICBiYWNrZ3JvdW5kOiAke1xuICAgICAgICBnZXRQcmVzc2VkKHtcbiAgICAgICAgICB0aGVtZSxcbiAgICAgICAgICBjb2xvcjogZmlsbCxcbiAgICAgICAgICBzaGFkZTogNTAsXG4gICAgICAgIH0pLmJhY2tncm91bmRDb2xvclxuICAgICAgfTtcbiAgICB9XG5cbiAgICBcbiAgICAgIDpkaXNhYmxlZCB7XG4gICAgICAgIG9wYWNpdHk6ICR7Z2V0RGlzYWJsZWQoKS5vcGFjaXR5fTtcbiAgICAgICAgY3Vyc29yOiAke2dldERpc2FibGVkKCkuY3Vyc29yfTtcbiAgICAgIH1cbiAgICBgfVxuXG4gICAgPiA6bm90KDpsYXN0LWNoaWxkKSB7XG4gICAgICBtYXJnaW4tcmlnaHQ6ICR7dGhlbWUuc3BhY2luZy54c219O1xuICAgIH1cbiAgYDtcbn07XG5cbmV4cG9ydCBjb25zdCBjbG9zZUljb25XcmFwcGVyU3R5bGUgPSAoZGlzYWJsZWQ/OiBib29sZWFuKSA9PiAoKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gIGN1cnNvcjogJHtkaXNhYmxlZCA/IGdldERpc2FibGVkKCkuY3Vyc29yIDogJ3BvaW50ZXInfTtcbmA7XG4iXX0= */", process.env.NODE_ENV === "production" ? "" : ";label:closeIconWrapperStyle;")
+      (0, _react.css)("cursor:", disabled ? (0, _states.getDisabled)().cursor : 'pointer', ";" + (process.env.NODE_ENV === "production" ? "" : ";label:closeIconWrapperStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3RXdGIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvQ2hpcC5zdHlsZS50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgU2VyaWFsaXplZFN0eWxlcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGZsZXhDZW50ZXJWZXJ0aWNhbCB9IGZyb20gJ3RoZW1lL2Z1bmN0aW9ucyc7XG5pbXBvcnQgeyByZW0gfSBmcm9tICd0aGVtZS91dGlscyc7XG5cbmltcG9ydCB7IFRoZW1lIH0gZnJvbSAnLi4vLi4vdGhlbWUnO1xuaW1wb3J0IHsgZ2V0RGlzYWJsZWQsIGdldEZvY3VzLCBnZXRIb3ZlciwgZ2V0UHJlc3NlZCB9IGZyb20gJy4uLy4uL3RoZW1lL3N0YXRlcyc7XG5pbXBvcnQgeyBQcm9wcyB9IGZyb20gJy4vQ2hpcC50eXBlcyc7XG5cbmV4cG9ydCBjb25zdCBjaGlwU3R5bGUgPSAoe1xuICBzdHlsZVR5cGUsXG4gIGZpbGwgPSAnZ3JleVNjYWxlJyxcbiAgaXNTZWxlY3RlZCxcbiAgb25DbGVhcixcbiAgb25DbGljayxcbn06IFBpY2s8UHJvcHMsICdzdHlsZVR5cGUnIHwgJ2ZpbGwnIHwgJ2lzU2VsZWN0ZWQnIHwgJ29uQ2xlYXInIHwgJ29uQ2xpY2snPikgPT4gKFxuICB0aGVtZTogVGhlbWVcbik6IFNlcmlhbGl6ZWRTdHlsZXMgPT4ge1xuICBjb25zdCBpc0ludGVyYWN0aXZlID0gc3R5bGVUeXBlID09PSAnaW50ZXJhY3RpdmUnO1xuICBjb25zdCBjdXN0b21GaWxsZWQgPSBzdHlsZVR5cGUgPT09ICdyZWFkLW9ubHknIHx8IG9uQ2xlYXIgfHwgaXNTZWxlY3RlZDtcblxuICByZXR1cm4gY3NzYFxuICAgICR7ZmxleENlbnRlclZlcnRpY2FsfTtcbiAgICBoZWlnaHQ6ICR7dGhlbWUuc3BhY2luZy5sZ307XG4gICAgYm9yZGVyLXJhZGl1czogJHt0aGVtZS5zcGFjaW5nLmxnfTtcbiAgICBmb250LXNpemU6ICR7dGhlbWUudHlwb2dyYXBoeS5mb250U2l6ZXNbJzEyJ119O1xuICAgIGZvbnQtd2VpZ2h0OiAke3RoZW1lLnR5cG9ncmFwaHkud2VpZ2h0cy5tZWRpdW19O1xuICAgIGxpbmUtaGVpZ2h0OiBub3JtYWw7XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICBwYWRkaW5nOiAke3RoZW1lLnNwYWNpbmcueHNtfSAke3RoZW1lLnNwYWNpbmcuc219O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7Y3VzdG9tRmlsbGVkID8gdGhlbWUudXRpbHMuZ2V0Q29sb3IoZmlsbCwgNTApIDogdGhlbWUucGFsZXR0ZS53aGl0ZX07XG4gICAgY29sb3I6ICR7dGhlbWUudXRpbHMuZ2V0QUFDb2xvckZyb21Td2F0Y2hlcyhmaWxsLCA1MCl9O1xuICAgIGJvcmRlcjogJHtyZW0oMSl9IHNvbGlkXG4gICAgICAke2N1c3RvbUZpbGxlZCA/IHRoZW1lLnV0aWxzLmdldENvbG9yKGZpbGwsIDU1MCkgOiB0aGVtZS51dGlscy5nZXRDb2xvcignbGlnaHRHcmV5JywgMjAwKX07XG4gICAgY3Vyc29yOiAke29uQ2xpY2sgPyAncG9pbnRlcicgOiAnYXV0byd9O1xuICAgIHdpZHRoOiBmaXQtY29udGVudDtcbiAgICB0cmFuc2l0aW9uOiBiYWNrZ3JvdW5kLWNvbG9yIDE1MG1zIGxpbmVhcjtcblxuICAgICY6aG92ZXI6bm90KDpkaXNhYmxlZCkge1xuICAgICAgYmFja2dyb3VuZDogJHtjdXN0b21GaWxsZWRcbiAgICAgICAgPyBnZXRIb3Zlcih7IHRoZW1lLCBjb2xvcjogZmlsbCwgc2hhZGU6IDUwIH0pLmJhY2tncm91bmRDb2xvclxuICAgICAgICA6IGdldEhvdmVyKHsgdGhlbWUgfSkuYmFja2dyb3VuZENvbG9yfTtcbiAgICB9XG5cbiAgICAmOmZvY3VzLXZpc2libGU6bm90KDpkaXNhYmxlZCkge1xuICAgICAgb3V0bGluZTogJHshaXNJbnRlcmFjdGl2ZSA/ICdub25lJyA6IGdldEZvY3VzKHsgdGhlbWUsIGJvcmRlcldpZHRoOiAxIH0pLnN0eWxlT3V0bGluZX07XG4gICAgfVxuXG4gICAgJHtpc0ludGVyYWN0aXZlICYmXG4gICAgICBgXG4gICAgJjphY3RpdmU6bm90KDpkaXNhYmxlZCkge1xuICAgICAgYmFja2dyb3VuZDogJHtcbiAgICAgICAgZ2V0UHJlc3NlZCh7XG4gICAgICAgICAgdGhlbWUsXG4gICAgICAgICAgY29sb3I6IGZpbGwsXG4gICAgICAgICAgc2hhZGU6IDUwLFxuICAgICAgICB9KS5iYWNrZ3JvdW5kQ29sb3JcbiAgICAgIH07XG4gICAgfVxuXG4gICAgXG4gICAgICA6ZGlzYWJsZWQge1xuICAgICAgICBvcGFjaXR5OiAke2dldERpc2FibGVkKCkub3BhY2l0eX07XG4gICAgICAgIGN1cnNvcjogJHtnZXREaXNhYmxlZCgpLmN1cnNvcn07XG4gICAgICB9XG4gICAgYH1cblxuICAgID4gOm5vdCg6bGFzdC1jaGlsZCkge1xuICAgICAgbWFyZ2luLXJpZ2h0OiAke3RoZW1lLnNwYWNpbmcueHNtfTtcbiAgICB9XG4gIGA7XG59O1xuXG5leHBvcnQgY29uc3QgY2xvc2VJY29uV3JhcHBlclN0eWxlID0gKGRpc2FibGVkPzogYm9vbGVhbikgPT4gKCk6IFNlcmlhbGl6ZWRTdHlsZXMgPT4gY3NzYFxuICBjdXJzb3I6ICR7ZGlzYWJsZWQgPyBnZXREaXNhYmxlZCgpLmN1cnNvciA6ICdwb2ludGVyJ307XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:closeIconWrapperStyle;")
     );
   };
 };

package/dist/components/Chip/Chip.types.d.ts

@@ -0,0 +1,34 @@
+import { ClickEvent } from '../../hooks/useLoading';
+import { flatColors } from '../../theme/palette';
+import { ButtonProps } from '../../utils/common';
+import { TestProps } from '../../utils/types';
+export declare const READ_ONLY: "read-only";
+export declare const INTERACTIVE: "interactive";
+export declare const styleType: readonly ["read-only", "interactive"];
+export declare type Props = {
+    /**
+     * Determines whether the chip should be read-only or interactive.
+     * @default read-only
+     */
+    styleType?: typeof styleType[number];
+    /** Defines the fill color of the component, if filled. */
+    fill?: typeof flatColors[number];
+    /** An optional thumbnail to show to the left. */
+    thumbnail?: {
+        src?: string;
+        name?: string;
+    };
+    /** Boolean defining if the chip is selected. */
+    isSelected?: boolean;
+    /** Boolean defining if the check icon is shown. */
+    isChecked?: boolean;
+    /** Defines the number value of the badge */
+    badgeNumber?: number;
+    /** Callback function for onClick. */
+    onClick?: (event: ClickEvent) => void;
+    /** A callback that is being triggered when type is interactive and you press the X icon. */
+    onClear?: () => void;
+    /** Boolean defining if the chip is disabled. Interactive only. */
+    disabled?: boolean;
+};
+export declare type ChipProps = Props & TestProps & ButtonProps;

package/dist/components/Chip/Chip.types.js

@@ -0,0 +1,10 @@
+"use strict";
+
+exports.__esModule = true;
+exports.styleType = exports.INTERACTIVE = exports.READ_ONLY = void 0;
+var READ_ONLY = 'read-only';
+exports.READ_ONLY = READ_ONLY;
+var INTERACTIVE = 'interactive';
+exports.INTERACTIVE = INTERACTIVE;
+var styleType = [READ_ONLY, INTERACTIVE];
+exports.styleType = styleType;

package/dist/components/Chip/components/Badge/Badge.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
 import { TestId } from 'utils/types';
-import { Props } from '../../Chip';
+import { Props } from '../../Chip.types';
 declare type TestProps = {
     dataTestId?: TestId;
 };
-declare const Badge: React.FC<Props & TestProps>;
+export declare type BadgeProps = Pick<Props, 'fill' | 'isSelected' | 'badgeNumber'> & TestProps;
+declare const Badge: React.FC<BadgeProps>;
 export default Badge;

package/dist/components/Chip/components/Badge/Badge.style.d.ts

@@ -1,4 +1,4 @@
 import { SerializedStyles } from '@emotion/react';
 import { Theme } from 'theme';
-import { Props } from '../../Chip';
-export declare const badgeStyle: ({ fill, isSelected }: Props) => (theme: Theme) => SerializedStyles;
+import { BadgeProps } from './Badge';
+export declare const badgeStyle: ({ fill, isSelected }: BadgeProps) => (theme: Theme) => SerializedStyles;

package/dist/components/Chip/components/Badge/Badge.style.js

@@ -16,7 +16,7 @@ var badgeStyle = function badgeStyle(_ref) {
       /*#__PURE__*/
 
       /*#__PURE__*/
-      (0, _react.css)(_functions.flex, ";width:", theme.spacing.md, ";height:", theme.spacing.md, ";border-radius:100%;background:", isSelected ? theme.utils.getColor(fill, 550) : theme.utils.getColor('lightGrey', 200), ";font-size:", theme.typography.fontSizes['10'], ";font-weight:", theme.typography.weights.medium, ";align-items:center;flex-shrink:0;line-height:normal;justify-content:center;color:", isSelected ? theme.utils.getAAColorFromSwatches(fill, 550) : theme.utils.getAAColorFromSwatches('lightGrey', 200), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:badgeStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvY29tcG9uZW50cy9CYWRnZS9CYWRnZS5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRMEIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQ2hpcC9jb21wb25lbnRzL0JhZGdlL0JhZGdlLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgVGhlbWUgfSBmcm9tICd0aGVtZSc7XG5pbXBvcnQgeyBmbGV4IH0gZnJvbSAndGhlbWUvZnVuY3Rpb25zJztcblxuaW1wb3J0IHsgUHJvcHMgfSBmcm9tICcuLi8uLi9DaGlwJztcblxuZXhwb3J0IGNvbnN0IGJhZGdlU3R5bGUgPSAoeyBmaWxsID0gJ2dyZXlTY2FsZScsIGlzU2VsZWN0ZWQgfTogUHJvcHMpID0+IChcbiAgdGhlbWU6IFRoZW1lXG4pOiBTZXJpYWxpemVkU3R5bGVzID0+IGNzc2BcbiAgJHtmbGV4fTtcbiAgd2lkdGg6ICR7dGhlbWUuc3BhY2luZy5tZH07XG4gIGhlaWdodDogJHt0aGVtZS5zcGFjaW5nLm1kfTtcbiAgYm9yZGVyLXJhZGl1czogMTAwJTtcbiAgYmFja2dyb3VuZDogJHtpc1NlbGVjdGVkXG4gICAgPyB0aGVtZS51dGlscy5nZXRDb2xvcihmaWxsLCA1NTApXG4gICAgOiB0aGVtZS51dGlscy5nZXRDb2xvcignbGlnaHRHcmV5JywgMjAwKX07XG4gIGZvbnQtc2l6ZTogJHt0aGVtZS50eXBvZ3JhcGh5LmZvbnRTaXplc1snMTAnXX07XG4gIGZvbnQtd2VpZ2h0OiAke3RoZW1lLnR5cG9ncmFwaHkud2VpZ2h0cy5tZWRpdW19O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBmbGV4LXNocmluazogMDtcbiAgbGluZS1oZWlnaHQ6IG5vcm1hbDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGNvbG9yOiAke2lzU2VsZWN0ZWRcbiAgICA/IHRoZW1lLnV0aWxzLmdldEFBQ29sb3JGcm9tU3dhdGNoZXMoZmlsbCwgNTUwKVxuICAgIDogdGhlbWUudXRpbHMuZ2V0QUFDb2xvckZyb21Td2F0Y2hlcygnbGlnaHRHcmV5JywgMjAwKX07XG5gO1xuIl19 */", process.env.NODE_ENV === "production" ? "" : ";label:badgeStyle;")
+      (0, _react.css)(_functions.flex, ";width:", theme.spacing.md, ";height:", theme.spacing.md, ";border-radius:100%;background:", isSelected ? theme.utils.getColor(fill, 550) : theme.utils.getColor('lightGrey', 200), ";font-size:", theme.typography.fontSizes['10'], ";font-weight:", theme.typography.weights.medium, ";align-items:center;flex-shrink:0;line-height:normal;justify-content:center;color:", isSelected ? theme.utils.getAAColorFromSwatches(fill, 550) : theme.utils.getAAColorFromSwatches('lightGrey', 200), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:badgeStyle;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0NoaXAvY29tcG9uZW50cy9CYWRnZS9CYWRnZS5zdHlsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRMEIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvQ2hpcC9jb21wb25lbnRzL0JhZGdlL0JhZGdlLnN0eWxlLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBTZXJpYWxpemVkU3R5bGVzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHsgVGhlbWUgfSBmcm9tICd0aGVtZSc7XG5pbXBvcnQgeyBmbGV4IH0gZnJvbSAndGhlbWUvZnVuY3Rpb25zJztcblxuaW1wb3J0IHsgQmFkZ2VQcm9wcyB9IGZyb20gJy4vQmFkZ2UnO1xuXG5leHBvcnQgY29uc3QgYmFkZ2VTdHlsZSA9ICh7IGZpbGwgPSAnZ3JleVNjYWxlJywgaXNTZWxlY3RlZCB9OiBCYWRnZVByb3BzKSA9PiAoXG4gIHRoZW1lOiBUaGVtZVxuKTogU2VyaWFsaXplZFN0eWxlcyA9PiBjc3NgXG4gICR7ZmxleH07XG4gIHdpZHRoOiAke3RoZW1lLnNwYWNpbmcubWR9O1xuICBoZWlnaHQ6ICR7dGhlbWUuc3BhY2luZy5tZH07XG4gIGJvcmRlci1yYWRpdXM6IDEwMCU7XG4gIGJhY2tncm91bmQ6ICR7aXNTZWxlY3RlZFxuICAgID8gdGhlbWUudXRpbHMuZ2V0Q29sb3IoZmlsbCwgNTUwKVxuICAgIDogdGhlbWUudXRpbHMuZ2V0Q29sb3IoJ2xpZ2h0R3JleScsIDIwMCl9O1xuICBmb250LXNpemU6ICR7dGhlbWUudHlwb2dyYXBoeS5mb250U2l6ZXNbJzEwJ119O1xuICBmb250LXdlaWdodDogJHt0aGVtZS50eXBvZ3JhcGh5LndlaWdodHMubWVkaXVtfTtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZmxleC1zaHJpbms6IDA7XG4gIGxpbmUtaGVpZ2h0OiBub3JtYWw7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBjb2xvcjogJHtpc1NlbGVjdGVkXG4gICAgPyB0aGVtZS51dGlscy5nZXRBQUNvbG9yRnJvbVN3YXRjaGVzKGZpbGwsIDU1MClcbiAgICA6IHRoZW1lLnV0aWxzLmdldEFBQ29sb3JGcm9tU3dhdGNoZXMoJ2xpZ2h0R3JleScsIDIwMCl9O1xuYDtcbiJdfQ== */", process.env.NODE_ENV === "production" ? "" : ";label:badgeStyle;")
     );
   };
 };

package/dist/components/Chip/utils.d.ts

@@ -0,0 +1,11 @@
+import { PropsValidationError } from '../../utils/errors';
+import { Props } from './Chip.types';
+export declare const defaultProps: {
+    disabled: boolean;
+    styleType: "read-only" | "interactive";
+    dataTestId: string;
+};
+export declare const errors: {
+    condition: ({ styleType, isSelected, isChecked, badgeNumber, disabled }: Props) => boolean;
+    error: PropsValidationError;
+}[];

package/dist/components/Chip/utils.js

@@ -0,0 +1,34 @@
+"use strict";
+
+exports.__esModule = true;
+exports.errors = exports.defaultProps = void 0;
+
+var _errors = require("../../utils/errors");
+
+var _Chip = require("./Chip.types");
+
+var defaultProps = {
+  disabled: false,
+  styleType: _Chip.READ_ONLY,
+  dataTestId: ''
+};
+exports.defaultProps = defaultProps;
+var errors = [{
+  condition: function condition(_ref) {
+    var styleType = _ref.styleType,
+        isSelected = _ref.isSelected,
+        isChecked = _ref.isChecked,
+        badgeNumber = _ref.badgeNumber,
+        disabled = _ref.disabled;
+    return Boolean(styleType === _Chip.READ_ONLY && (isSelected || isChecked || badgeNumber || disabled));
+  },
+  error: new _errors.PropsValidationError('The properties isSelected, isChecked, badgeNumber and disabled are only for Interactive style type Chips.')
+}, {
+  condition: function condition(_ref2) {
+    var styleType = _ref2.styleType,
+        thumbnail = _ref2.thumbnail;
+    return Boolean(styleType === _Chip.INTERACTIVE && thumbnail);
+  },
+  error: new _errors.PropsValidationError('The property thumbnail is only for Read-Only style type Chips.')
+}];
+exports.errors = errors;