@deque/cauldron-react 2.0.0-canary.b30e4f33 → 2.0.0-canary.cd719c24

package/lib/components/Card/Card.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: 'simple';
 }
 declare const Card: {
-    ({ className, ...other }: CardProps): JSX.Element;
+    ({ className, variant, ...other }: CardProps): JSX.Element;
     displayName: string;
     propTypes: {
         className: PropTypes.Requireable<string>;
+        variant: PropTypes.Requireable<string>;
     };
 };
 export default Card;

package/lib/components/Icon/index.d.ts

@@ -1,7 +1,9 @@
 import React from 'react';
+import { IconType, iconTypes } from './types';
+export { IconType, iconTypes };
 export interface IconProps extends React.HTMLAttributes<HTMLDivElement> {
     label?: string;
-    type: string;
+    type: IconType;
 }
 declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<HTMLDivElement>>;
 export default Icon;

package/lib/components/Icon/types.d.ts

@@ -0,0 +1,7 @@
+/*!
+ * GENERATED CODE. DO NOT EDIT DIRECTLY!
+ */
+/** IconType represents each valid icon type. */
+export declare type IconType = 'add-user' | 'arrow-circle-up' | 'arrow-circle-down' | 'arrow-circle-left' | 'arrow-circle-right' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrows-alt' | 'bolt' | 'caution' | 'check-circle' | 'check-shield' | 'check-solid' | 'check' | 'checkbox-checked' | 'checkbox-unchecked' | 'chevron-double-up' | 'chevron-double-down' | 'chevron-double-left' | 'chevron-double-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'close' | 'code' | 'download' | 'exchange' | 'external-link' | 'eye' | 'filter' | 'flag' | 'gears' | 'grid' | 'hamburger-menu' | 'highlight' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'list' | 'lock' | 'menu' | 'new-releases' | 'new' | 'no' | 'pencil' | 'plus' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle' | 'run-again' | 'save' | 'share' | 'sort' | 'star' | 'sun' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'upload';
+/** iconTypes holds each valid icon type. */
+export declare const iconTypes: string[];

package/lib/components/IconButton/index.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
+import { IconType } from '../Icon';
 import { TooltipProps } from '../Tooltip';
 export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    icon: string;
+    icon: IconType;
     label: string;
     tooltipPlacement?: TooltipProps['placement'];
     tooltipVariant?: TooltipProps['variant'];

package/lib/components/Select/index.d.ts

@@ -15,5 +15,5 @@ export interface SelectProps extends Omit<React.HTMLProps<HTMLSelectElement>, 'c
     defaultValue?: any;
     onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
 }
-declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "max" | "required" | "default" | "high" | "low" | "disabled" | "error" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "key" | "children" | "list" | "step" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "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" | "onBlur" | "onBlurCapture" | "onChange" | "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" | "onClick" | "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" | "type" | "name" | "target" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "useMap" | "value" | "width" | "wmode" | "options" | "requiredText"> & React.RefAttributes<HTMLSelectElement>>;
+declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "max" | "required" | "default" | "high" | "low" | "disabled" | "error" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "color" | "content" | "size" | "wrap" | "multiple" | "key" | "children" | "list" | "step" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "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" | "onBlur" | "onBlurCapture" | "onChange" | "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" | "onClick" | "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" | "download" | "target" | "type" | "name" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "useMap" | "value" | "width" | "wmode" | "options" | "requiredText"> & React.RefAttributes<HTMLSelectElement>>;
 export default Select;

package/lib/components/Tabs/Tab.d.ts

@@ -1,5 +1,7 @@
 import React from 'react';
 interface TabProps extends React.HTMLAttributes<HTMLLIElement> {
+    target: React.RefObject<HTMLDivElement> | HTMLElement;
+    id?: string;
     children?: React.ReactNode;
 }
 declare const Tab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLLIElement>>;

package/lib/components/Tabs/TabPanel.d.ts

@@ -1,15 +1,8 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 interface TabPanelProps extends React.HTMLAttributes<HTMLDivElement> {
+    id?: string;
     children?: React.ReactNode;
     className?: string;
 }
-declare const TabPanel: {
-    ({ children, ...other }: TabPanelProps): JSX.Element;
-    displayName: string;
-    Proptypes: {
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        className: PropTypes.Requireable<string>;
-    };
-};
+declare const TabPanel: React.ForwardRefExoticComponent<TabPanelProps & React.RefAttributes<HTMLDivElement>>;
 export default TabPanel;

package/lib/components/Tabs/Tabs.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-declare type TabsVariant = 'full-width';
 declare type LabelProps = {
     'aria-label': string;
 } | {
@@ -9,23 +8,19 @@ declare type LabelProps = {
 declare type TabsProps = {
     children: React.ReactNode;
     initialActiveIndex?: number;
-    id?: string;
     thin?: boolean;
     className?: string;
-    variant?: TabsVariant;
 } & LabelProps;
 declare const Tabs: {
-    ({ children, thin, id: propId, initialActiveIndex, variant, className, ...labelProp }: TabsProps): JSX.Element;
+    ({ children, thin, initialActiveIndex, className, ...labelProp }: TabsProps): JSX.Element;
     displayName: string;
     propTypes: {
         children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        label: PropTypes.Requireable<string>;
-        labelledby: PropTypes.Requireable<string>;
-        id: PropTypes.Requireable<string>;
+        'aria-label': PropTypes.Requireable<string>;
+        'aria-labelledby': PropTypes.Requireable<string>;
         initialActiveIndex: PropTypes.Requireable<number>;
         thin: PropTypes.Requireable<boolean>;
         className: PropTypes.Requireable<string>;
-        variant: PropTypes.Requireable<string>;
     };
 };
 export default Tabs;

package/lib/components/TextField/index.d.ts

@@ -42,7 +42,6 @@ export default class TextField extends React.Component<TextFieldProps, TextField
     private errorId;
     private input;
     constructor(props: TextFieldProps);
-    componentDidUpdate(prevProps: TextFieldProps): void;
     render(): JSX.Element;
     onChange(e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>): void;
 }

package/lib/components/Toast/utils.d.ts

@@ -1,26 +1,13 @@
+import { IconType } from '../Icon';
+interface TypeMap {
+    [name: string]: {
+        className: string;
+        icon: IconType;
+    };
+}
 /**
  * Maps toast types to their classNames and icons
  */
-export declare const typeMap: {
-    confirmation: {
-        className: string;
-        icon: string;
-    };
-    caution: {
-        className: string;
-        icon: string;
-    };
-    'action-needed': {
-        className: string;
-        icon: string;
-    };
-    error: {
-        className: string;
-        icon: string;
-    };
-    info: {
-        className: string;
-        icon: string;
-    };
-};
+export declare const typeMap: TypeMap;
 export declare const tabIndexHandler: (reset: boolean, toast: HTMLElement | null) => any;
+export {};

package/lib/index.d.ts

@@ -4,7 +4,7 @@
 export { default as Workspace } from './components/Workspace';
 export { default as Main } from './components/Main';
 export { default as Layout } from './components/Layout';
-export { default as Icon } from './components/Icon';
+export { default as Icon, IconType, iconTypes } from './components/Icon';
 export { default as Offscreen } from './components/Offscreen';
 export { default as Scrim } from './components/Scrim';
 export { default as MenuItem } from './components/MenuItem';

package/lib/index.js

@@ -112,6 +112,81 @@ var Workspace = /** @class */ (function (_super) {
 
 var Offscreen = function (props) { return (React__default.createElement("div", tslib.__assign({ className: "Offscreen" }, props))); };
 
+/*!
+ * GENERATED CODE. DO NOT EDIT DIRECTLY!
+ */
+/** iconTypes holds each valid icon type. */
+var iconTypes = [
+    'add-user',
+    'arrow-circle-up',
+    'arrow-circle-down',
+    'arrow-circle-left',
+    'arrow-circle-right',
+    'arrow-up',
+    'arrow-down',
+    'arrow-left',
+    'arrow-right',
+    'arrows-alt',
+    'bolt',
+    'caution',
+    'check-circle',
+    'check-shield',
+    'check-solid',
+    'check',
+    'checkbox-checked',
+    'checkbox-unchecked',
+    'chevron-double-up',
+    'chevron-double-down',
+    'chevron-double-left',
+    'chevron-double-right',
+    'chevron-up',
+    'chevron-down',
+    'chevron-left',
+    'chevron-right',
+    'close',
+    'code',
+    'download',
+    'exchange',
+    'external-link',
+    'eye',
+    'filter',
+    'flag',
+    'gears',
+    'grid',
+    'hamburger-menu',
+    'highlight',
+    'info-circle-alt',
+    'info-circle',
+    'info-square',
+    'kabob',
+    'list',
+    'lock',
+    'menu',
+    'new-releases',
+    'new',
+    'no',
+    'pencil',
+    'plus',
+    'question-circle',
+    'radio-checked',
+    'radio-unchecked',
+    'recycle',
+    'run-again',
+    'save',
+    'share',
+    'sort',
+    'star',
+    'sun',
+    'tag',
+    'target',
+    'trash',
+    'triangle-up',
+    'triangle-down',
+    'triangle-left',
+    'triangle-right',
+    'upload'
+];
+
 function __variableDynamicImportRuntime0__(path) {
    switch (path) {
      case './icons/add-user.svg': return Promise.resolve().then(function () { return require('./add-user-075c63a1.js'); });
@@ -142,10 +217,11 @@ function __variableDynamicImportRuntime0__(path) {
      case './icons/highlight.svg': return Promise.resolve().then(function () { return require('./highlight-81bfb759.js'); });
      case './icons/info-circle-alt.svg': return Promise.resolve().then(function () { return require('./info-circle-alt-b1a696c7.js'); });
      case './icons/info-circle.svg': return Promise.resolve().then(function () { return require('./info-circle-b43f7a9b.js'); });
+     case './icons/info-square.svg': return Promise.resolve().then(function () { return require('./info-square-f193e281.js'); });
      case './icons/kabob.svg': return Promise.resolve().then(function () { return require('./kabob-692fdc00.js'); });
      case './icons/list.svg': return Promise.resolve().then(function () { return require('./list-8fbd8209.js'); });
      case './icons/lock.svg': return Promise.resolve().then(function () { return require('./lock-bd0122db.js'); });
-     case './icons/menu.svg': return Promise.resolve().then(function () { return require('./menu-2bb052ac.js'); });
+     case './icons/menu.svg': return Promise.resolve().then(function () { return require('./menu-2f2be7c2.js'); });
      case './icons/new-releases.svg': return Promise.resolve().then(function () { return require('./new-releases-ac749bdd.js'); });
      case './icons/new.svg': return Promise.resolve().then(function () { return require('./new-6c3ac7d7.js'); });
      case './icons/no.svg': return Promise.resolve().then(function () { return require('./no-bb3aa565.js'); });
@@ -154,6 +230,7 @@ function __variableDynamicImportRuntime0__(path) {
      case './icons/question-circle.svg': return Promise.resolve().then(function () { return require('./question-circle-c3c634c4.js'); });
      case './icons/radio-checked.svg': return Promise.resolve().then(function () { return require('./radio-checked-006112fe.js'); });
      case './icons/radio-unchecked.svg': return Promise.resolve().then(function () { return require('./radio-unchecked-a76e2d66.js'); });
+     case './icons/recycle.svg': return Promise.resolve().then(function () { return require('./recycle-0198fb67.js'); });
      case './icons/run-again.svg': return Promise.resolve().then(function () { return require('./run-again-c9777075.js'); });
      case './icons/save.svg': return Promise.resolve().then(function () { return require('./save-edf5fc68.js'); });
      case './icons/share.svg': return Promise.resolve().then(function () { return require('./share-70e94257.js'); });
@@ -205,6 +282,7 @@ var Icon = React.forwardRef(function (_a, ref) {
 Icon.propTypes = {
     label: PropTypes.string,
     className: PropTypes.string,
+    // @ts-expect-error
     type: PropTypes.string.isRequired
 };
 Icon.displayName = 'Icon';
@@ -1485,14 +1563,15 @@ var IconButton = React.forwardRef(function (_a, ref) {
         !disabled && (React__default.createElement(Tooltip, { target: buttonRef, placement: tooltipPlacement, variant: tooltipVariant, portal: tooltipPortal, association: "aria-labelledby", hideElementOnHidden: true }, label))));
 });
 IconButton.propTypes = {
+    // @ts-expect-error
     icon: PropTypes.string.isRequired,
     label: PropTypes.string.isRequired,
-    // @ts-ignore
+    // @ts-expect-error
     tooltipPlacement: PropTypes.string,
-    // @ts-ignore
+    // @ts-expect-error
     tooltipVariant: PropTypes.string,
     tooltipPortal: PropTypes.any,
-    // @ts-ignore
+    // @ts-expect-error
     variant: PropTypes.string
 };
 IconButton.displayName = 'IconButton';
@@ -2242,12 +2321,16 @@ function TooltipTabstop(_a) {
 TooltipTabstop.displayName = 'TooltipTabstop';
 
 var Card = function (_a) {
-    var className = _a.className, other = tslib.__rest(_a, ["className"]);
-    return (React__default.createElement("div", tslib.__assign({ className: classNames('Card', className) }, other)));
+    var className = _a.className, variant = _a.variant, other = tslib.__rest(_a, ["className", "variant"]);
+    return (React__default.createElement("div", tslib.__assign({ className: classNames(className, {
+            'Card--simple': variant === 'simple',
+            Card: !variant
+        }) }, other)));
 };
 Card.displayName = 'Card';
 Card.propTypes = {
-    className: PropTypes.string
+    className: PropTypes.string,
+    variant: PropTypes.string
 };
 
 var CardHeader = function (_a) {
@@ -2291,21 +2374,12 @@ var TextField = /** @class */ (function (_super) {
         _this.onChange = _this.onChange.bind(_this);
         return _this;
     }
-    TextField.prototype.componentDidUpdate = function (prevProps) {
-        var value = this.props.value;
-        if (value === prevProps.value) {
-            return;
-        }
-        this.setState({ value: value });
-    };
     TextField.prototype.render = function () {
         var _this = this;
         var isRequired = !!this.props.required;
         // disabling `no-unused-vars` to prevent specific
         // props from being passed through to the input
-        var _a = this.props, label = _a.label, fieldRef = _a.fieldRef, 
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-        value = _a.value, 
+        var _a = this.props, label = _a.label, fieldRef = _a.fieldRef, value = _a.value, 
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         onChange = _a.onChange, 
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -2330,7 +2404,7 @@ var TextField = /** @class */ (function (_super) {
                     'Field__text-input': !multiline,
                     Field__textarea: multiline,
                     'Field--has-error': error
-                }), id: this.inputId, value: this.state.value, onChange: this.onChange, "aria-invalid": !!error, ref: function (input) {
+                }), id: this.inputId, value: typeof value !== 'undefined' ? value : this.state.value, onChange: this.onChange, "aria-invalid": !!error, ref: function (input) {
                     _this.input = input;
                     setRef(fieldRef, input);
                 } }, other, inputProps)),
@@ -2383,7 +2457,7 @@ function PanelTrigger(_a) {
     var children = _a.children, className = _a.className, open = _a.open, fullWidth = _a.fullWidth, onClick = _a.onClick, other = tslib.__rest(_a, ["children", "className", "open", "fullWidth", "onClick"]);
     return (React__default.createElement("button", tslib.__assign({}, other, { className: classNames('ExpandCollapse__trigger', fullWidth ? 'fullWidth' : '', className), type: "button", "aria-expanded": open, onClick: onClick }),
         React__default.createElement("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function' ? children({ open: !!open }) : children),
-        React__default.createElement(Icon, { type: "chevron-" + (open ? 'down' : 'right') })));
+        React__default.createElement(Icon, { type: open ? 'chevron-down' : 'chevron-right' })));
 }
 PanelTrigger.propTypes = {
     children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
@@ -7871,42 +7945,31 @@ TableRow.propTypes = {
     className: PropTypes.string
 };
 
-var TabPanel = function (_a) {
-    var children = _a.children, other = tslib.__rest(_a, ["children"]);
-    return (React__default.createElement("div", tslib.__assign({ role: "tabpanel" }, other), children));
-};
-TabPanel.displayName = 'TabPanel';
-TabPanel.Proptypes = {
-    children: PropTypes.node,
-    className: PropTypes.string
-};
-
 var Tab = React__default.forwardRef(function (_a, ref) {
-    var children = _a.children, other = tslib.__rest(_a, ["children"]);
-    return (React__default.createElement("li", tslib.__assign({ ref: ref, role: "tab" }, other), children));
+    var children = _a.children, propId = _a.id, target = _a.target, other = tslib.__rest(_a, ["children", "id", "target"]);
+    return (React__default.createElement("li", tslib.__assign({ id: propId, ref: ref, role: "tab" }, other), children));
 });
 Tab.displayName = 'Tab';
 Tab.propTypes = {
+    target: PropTypes.any.isRequired,
+    id: PropTypes.string,
     children: PropTypes.node
 };
 
-var _a$1 = [37, 39, 36, 35], left = _a$1[0], right = _a$1[1], home = _a$1[2], end = _a$1[3];
 var Tabs = function (_a) {
-    var children = _a.children, thin = _a.thin, propId = _a.id, _b = _a.initialActiveIndex, initialActiveIndex = _b === void 0 ? 0 : _b, variant = _a.variant, className = _a.className, labelProp = tslib.__rest(_a, ["children", "thin", "id", "initialActiveIndex", "variant", "className"]);
+    var children = _a.children, thin = _a.thin, _b = _a.initialActiveIndex, initialActiveIndex = _b === void 0 ? 0 : _b, className = _a.className, labelProp = tslib.__rest(_a, ["children", "thin", "initialActiveIndex", "className"]);
     var _c = React.useState(initialActiveIndex), activeIndex = _c[0], setActiveIndex = _c[1];
-    var id = (propId ? [propId] : nextId.useId(1, 'tabs'))[0];
     var focusedTabRef = React.useRef(null);
     var tabs = React__default.Children.toArray(children).filter(function (child) { return child.type === Tab; });
-    var panels = React__default.Children.toArray(children).filter(function (child) { return child.type === TabPanel; });
     var tabCount = tabs.length;
     var handleClick = function (index) {
         setActiveIndex(index);
     };
     var handleKeyDown = function (event) {
-        var which = event.which;
+        var key = event.key;
         var newIndex = activeIndex;
-        switch (which) {
-            case left: {
+        switch (key) {
+            case 'ArrowLeft': {
                 newIndex = activeIndex - 1;
                 // circularity
                 if (newIndex === -1) {
@@ -7915,7 +7978,7 @@ var Tabs = function (_a) {
                 setActiveIndex(newIndex);
                 break;
             }
-            case right: {
+            case 'ArrowRight': {
                 newIndex = activeIndex + 1;
                 // circularity
                 if (newIndex === tabCount) {
@@ -7924,12 +7987,13 @@ var Tabs = function (_a) {
                 setActiveIndex(newIndex);
                 break;
             }
-            case home: {
+            case 'Home': {
                 newIndex = 0;
                 setActiveIndex(newIndex);
                 break;
             }
-            case end: {
+            case 'End': {
+                event.preventDefault();
                 newIndex = tabCount - 1;
                 setActiveIndex(newIndex);
                 break;
@@ -7938,22 +8002,24 @@ var Tabs = function (_a) {
     };
     var tabComponents = tabs.map(function (child, index) {
         var _a;
-        var other = tslib.__rest(child.props, []);
+        var _b;
+        var _c = child.props, target = _c.target, propId = _c.id, other = tslib.__rest(_c, ["target", "id"]);
         var selected = index === activeIndex;
-        var config = tslib.__assign((_a = { id: id + "-" + index, className: classNames('Tab', {
-                    'Tab--active': selected,
-                    'Tab--full-width': variant === 'full-width'
-                }), tabIndex: index === activeIndex ? 0 : -1 }, _a['aria-controls'] = id + "-panel-" + index, _a['aria-selected'] = selected, _a.ref = index === activeIndex ? focusedTabRef : null, _a.onClick = function () { return handleClick(index); }, _a), other);
+        var id = (propId ? [propId] : nextId.useId(1, 'tab'))[0];
+        React.useEffect(function () {
+            var _a;
+            (_a = target.current) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', id);
+        }, [target]);
+        React.useEffect(function () {
+            var _a, _b;
+            index === activeIndex
+                ? (_a = target.current) === null || _a === void 0 ? void 0 : _a.classList.remove('TabPanel--hidden') : (_b = target.current) === null || _b === void 0 ? void 0 : _b.classList.add('TabPanel--hidden');
+        }, [activeIndex]);
+        var config = tslib.__assign((_a = { id: id, className: classNames('Tab', {
+                    'Tab--active': selected
+                }), tabIndex: index === activeIndex ? 0 : -1 }, _a['aria-controls'] = (_b = target.current) === null || _b === void 0 ? void 0 : _b.id, _a['aria-selected'] = selected, _a.ref = index === activeIndex ? focusedTabRef : null, _a.onClick = function () { return handleClick(index); }, _a), other);
         return React__default.cloneElement(child, config);
     });
-    var tabPanelComponents = panels.map(function (child, index) {
-        var _a;
-        var _b = child.props, className = _b.className, other = tslib.__rest(_b, ["className"]);
-        var panelId = id + "-panel-" + index;
-        return React__default.cloneElement(child, tslib.__assign((_a = { id: panelId }, _a['aria-labelledby'] = id + "-" + index, _a.className = classNames('TabPanel', className, {
-            'TabPanel--hidden': activeIndex !== index
-        }), _a), other));
-    });
     useDidUpdate(function () {
         var _a;
         (_a = focusedTabRef.current) === null || _a === void 0 ? void 0 : _a.focus();
@@ -7961,21 +8027,28 @@ var Tabs = function (_a) {
     return (React__default.createElement("div", { className: classNames('Tabs', className, {
             'Tabs--thin': thin
         }) },
-        React__default.createElement("ul", tslib.__assign({ role: "tablist", className: classNames('Tablist', {
-                'Tablist--full-width': variant === 'full-width'
-            }) }, labelProp, { onKeyDown: handleKeyDown }), tabComponents),
-        tabPanelComponents));
+        React__default.createElement("ul", tslib.__assign({ role: "tablist", className: "Tablist" }, labelProp, { onKeyDown: handleKeyDown }), tabComponents)));
 };
 Tabs.displayName = 'Tabs';
 Tabs.propTypes = {
     children: PropTypes.node.isRequired,
-    label: PropTypes.string,
-    labelledby: PropTypes.string,
-    id: PropTypes.string,
+    'aria-label': PropTypes.string,
+    'aria-labelledby': PropTypes.string,
     initialActiveIndex: PropTypes.number,
     thin: PropTypes.bool,
-    className: PropTypes.string,
-    variant: PropTypes.string
+    className: PropTypes.string
+};
+
+var TabPanel = React.forwardRef(function (_a, ref) {
+    var children = _a.children, propId = _a.id, className = _a.className, other = tslib.__rest(_a, ["children", "id", "className"]);
+    var id = (propId ? [propId] : nextId.useId(1, 'tabpanel'))[0];
+    return (React__default.createElement("div", tslib.__assign({ role: "tabpanel", className: classNames('TabPanel', className), id: id, ref: ref }, other), children));
+});
+TabPanel.displayName = 'TabPanel';
+TabPanel.propTypes = {
+    id: PropTypes.string,
+    children: PropTypes.node,
+    className: PropTypes.string
 };
 
 var commonPropTypes = {
@@ -8201,5 +8274,6 @@ exports.TopBarMenu = TopBarMenu;
 exports.TopBarTrigger = TopBarTrigger;
 exports.Workspace = Workspace;
 exports.focusableSelector = focusableSelector;
+exports.iconTypes = iconTypes;
 exports.useDidUpdate = useDidUpdate;
 exports.useThemeContext = useThemeContext;

package/lib/info-square-f193e281.js

@@ -0,0 +1,25 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var React = require('react');
+var React__default = _interopDefault(React);
+
+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); }
+
+var _ref = /*#__PURE__*/React.createElement("path", {
+  d: "M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-7 9h-2V5h2v6zm0 4h-2v-2h2v2z",
+  vectorEffect: "non-scaling-stroke",
+  fill: "currentColor"
+});
+
+function SvgInfoSquare(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    overflow: "visible",
+    preserveAspectRatio: "none",
+    width: 24,
+    height: 24
+  }, props), _ref);
+}
+
+exports.default = SvgInfoSquare;

package/lib/{menu-2bb052ac.js → menu-2f2be7c2.js}

@@ -7,24 +7,7 @@ var React__default = _interopDefault(React);
 
 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); }
 
-var _ref = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("path", {
-  d: "M0 0h24v24H0V0z",
-  id: "menu_svg__a",
-  vectorEffect: "non-scaling-stroke",
-  fill: "currentColor"
-}));
-
-var _ref2 = /*#__PURE__*/React.createElement("clipPath", {
-  xmlnsXlink: "http://www.w3.org/1999/xlink",
-  id: "menu_svg__b",
-  vectorEffect: "non-scaling-stroke"
-}, /*#__PURE__*/React.createElement("use", {
-  xlinkHref: "#menu_svg__a",
-  vectorEffect: "non-scaling-stroke"
-}));
-
-var _ref3 = /*#__PURE__*/React.createElement("path", {
-  clipPath: "url(#menu_svg__b)",
+var _ref = /*#__PURE__*/React.createElement("path", {
   d: "M20 9H4v2h16V9zM4 15h16v-2H4v2z",
   vectorEffect: "non-scaling-stroke",
   fill: "currentColor"
@@ -37,7 +20,7 @@ function SvgMenu(props) {
     viewBox: "0 0 24 24",
     width: 19,
     height: 19
-  }, props), _ref, _ref2, _ref3);
+  }, props), _ref);
 }
 
 exports.default = SvgMenu;

package/lib/recycle-0198fb67.js

@@ -0,0 +1,25 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var React = require('react');
+var React__default = _interopDefault(React);
+
+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); }
+
+var _ref = /*#__PURE__*/React.createElement("path", {
+  d: "M12 6v3l4-4-4-4v3c-4.42 0-8 3.58-8 8 0 1.57.46 3.03 1.24 4.26L6.7 14.8A5.87 5.87 0 016 12c0-3.31 2.69-6 6-6zm6.76 1.74L17.3 9.2c.44.84.7 1.79.7 2.8 0 3.31-2.69 6-6 6v-3l-4 4 4 4v-3c4.42 0 8-3.58 8-8 0-1.57-.46-3.03-1.24-4.26z",
+  vectorEffect: "non-scaling-stroke",
+  fill: "currentColor"
+});
+
+function SvgRecycle(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    overflow: "visible",
+    preserveAspectRatio: "none",
+    width: 24,
+    height: 24
+  }, props), _ref);
+}
+
+exports.default = SvgRecycle;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "2.0.0-canary.b30e4f33",
+  "version": "2.0.0-canary.cd719c24",
   "description": "Fully accessible react components library for Deque Cauldron",
   "publishConfig": {
     "access": "public"
@@ -13,6 +13,7 @@
   ],
   "scripts": {
     "build": "yarn build:lib && yarn build:css",
+    "prebuild:lib": "node scripts/buildIconTypes.js",
     "build:lib": "rollup -c && tsc --declaration --emitDeclarationOnly --outDir lib",
     "build:css": "postcss --output=lib/cauldron.css src/index.css",
     "dev": "concurrently 'yarn build:css --watch' 'rollup -c --watch'",