@deque/cauldron-react 4.5.0-canary.9a1593ae → 4.5.0-canary.c21fc13b

package/lib/cauldron.css

@@ -23,7 +23,6 @@
 }
 
 .ExpandCollapse__panel {
-  background-color: var(--expandcollapse-panel-background-color);
   color: var(--expandcollapse-panel-color);
 }
 

package/lib/components/Accordion/Accordion.d.ts

@@ -0,0 +1,42 @@
+import React from 'react';
+import { ExpandCollapsePanelProps } from '../ExpandCollapsePanel';
+import PropTypes from 'prop-types';
+export interface AccordionTriggerProps extends React.HTMLAttributes<HTMLButtonElement> {
+    children: React.ReactElement;
+    heading?: React.ReactElement | {
+        level: string | undefined;
+    };
+}
+declare const AccordionTrigger: {
+    ({ children, ...triggerProps }: AccordionTriggerProps): JSX.Element;
+    displayName: string;
+    propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        heading: PropTypes.Requireable<string | undefined>;
+    };
+};
+interface AccordionContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    children: React.ReactNode | React.ReactNode[];
+    className?: string;
+}
+declare const AccordionContent: {
+    ({ children, className, ...otherProps }: AccordionContentProps): JSX.Element;
+    displayName: string;
+    propTypes: {
+        children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        className: PropTypes.Requireable<string>;
+    };
+};
+interface AccordionProps extends ExpandCollapsePanelProps {
+    children: React.ReactNode;
+}
+declare const Accordion: {
+    ({ children }: AccordionProps): JSX.Element | null;
+    displayName: string;
+    propTypes: {
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        className: PropTypes.Requireable<string>;
+    };
+};
+export default Accordion;
+export { Accordion, AccordionTrigger, AccordionContent };

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

@@ -0,0 +1,3 @@
+import { Accordion, AccordionTrigger, AccordionContent } from './Accordion';
+export default Accordion;
+export { Accordion, AccordionTrigger, AccordionContent };

package/lib/components/Breadcrumb/BreadcrumbLink.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-interface BreadcrumbLinkProps extends React.HTMLAttributes<HTMLLinkElement> {
+interface BreadcrumbLinkProps extends Omit<React.LinkHTMLAttributes<HTMLLinkElement>, 'as'> {
     as?: React.ElementType;
 }
 declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLElement>>;

package/lib/components/ExpandCollapsePanel/PanelTrigger.d.ts

@@ -10,17 +10,19 @@ export interface PanelTriggerProps extends Omit<React.ButtonHTMLAttributes<HTMLB
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
     iconExpanded?: IconType;
     iconCollapsed?: IconType;
+    heading?: React.ReactElement | {
+        level: string | undefined;
+    };
 }
-declare function PanelTrigger({ children, className, open, fullWidth, onClick, iconExpanded, iconCollapsed, ...other }: PanelTriggerProps): JSX.Element;
-declare namespace PanelTrigger {
-    var propTypes: {
+declare const _default: React.MemoExoticComponent<{
+    ({ children, className, open, fullWidth, onClick, iconExpanded, iconCollapsed, heading, ...otherProps }: PanelTriggerProps): JSX.Element;
+    propTypes: {
         children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
         open: PropTypes.Requireable<boolean>;
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        className: PropTypes.Requireable<string>;
         iconExpanded: PropTypes.Requireable<string>;
         iconCollapsed: PropTypes.Requireable<string>;
+        heading: PropTypes.Requireable<number>;
     };
-}
-declare const _default: React.MemoExoticComponent<typeof PanelTrigger>;
+    displayName: string;
+}>;
 export default _default;

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

@@ -2,6 +2,6 @@
  * 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' | 'copy' | 'download' | 'dropper' | 'exchange' | 'external-link' | 'eye' | 'filter' | 'flag' | 'gears' | 'grid' | 'hamburger-menu' | 'highlight' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pencil' | 'plus' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'resend' | 'robot' | 'run-again' | 'save' | 'share' | 'sort-triangle' | 'sort' | 'star' | 'sun' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'upload';
+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' | 'copy' | 'download' | 'dropper' | 'exchange' | 'external-link' | 'eye' | 'filter-solid' | 'filter' | 'flag' | 'gears' | 'grid' | 'hamburger-menu' | 'highlight' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pencil' | 'play' | 'plus' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'resend' | 'robot' | 'run-again' | 'save' | 'share' | 'sort-triangle' | '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/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, "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" | "color" | "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" | "children" | "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" | "form" | "list" | "step" | "cite" | "data" | "label" | "span" | "summary" | "pattern" | "type" | "key" | "download" | "target" | "name" | "error" | "disabled" | "open" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "dateTime" | "default" | "defer" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "useMap" | "value" | "width" | "wmode" | "wrap" | "options" | "requiredText"> & React.RefAttributes<HTMLSelectElement>>;
+declare const Select: React.ForwardRefExoticComponent<Pick<SelectProps, "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" | "color" | "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" | "children" | "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" | "form" | "list" | "step" | "cite" | "data" | "label" | "span" | "summary" | "pattern" | "type" | "key" | "download" | "target" | "name" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value" | "open" | "error" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "dateTime" | "default" | "defer" | "encType" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "useMap" | "width" | "wmode" | "wrap" | "options" | "requiredText"> & React.RefAttributes<HTMLSelectElement>>;
 export default Select;

package/lib/filter-solid.js

@@ -0,0 +1,24 @@
+'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);
+
+var _path;
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const SvgFilterSolid = props => /*#__PURE__*/React.createElement("svg", _extends({
+  overflow: "visible",
+  preserveAspectRatio: "none",
+  viewBox: "0 0 24 24",
+  height: 24,
+  width: 24
+}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+  d: "M18.65 4.67H5.34a.616.616 0 0 0-.62.41c-.12.24-.06.55.16.73L10 10.94V16c0 .18.07.35.2.47l2.67 2.67c.12.13.29.2.47.2.09 0 .18-.02.26-.05.26-.1.42-.35.4-.63v-7.72l5.13-5.13c.21-.18.28-.48.15-.73a.628.628 0 0 0-.63-.41z",
+  vectorEffect: "non-scaling-stroke",
+  fill: "currentColor"
+})));
+
+exports.default = SvgFilterSolid;

package/lib/index.d.ts

@@ -3,6 +3,7 @@
  */
 export { default as Workspace } from './components/Workspace';
 export { default as Main } from './components/Main';
+export { default as Accordion, AccordionTrigger, AccordionContent } from './components/Accordion';
 export { default as Layout } from './components/Layout';
 export { default as Icon, IconType, iconTypes } from './components/Icon';
 export { default as Offscreen } from './components/Offscreen';

package/lib/index.js

@@ -9,9 +9,9 @@ var React = require('react');
 var React__default = _interopDefault(React);
 var PropTypes = _interopDefault(require('prop-types'));
 var classNames = _interopDefault(require('classnames'));
-var keyname = _interopDefault(require('keyname'));
 var nextId = require('react-id-generator');
 var nextId__default = _interopDefault(nextId);
+var keyname = _interopDefault(require('keyname'));
 var reactDom = require('react-dom');
 var FocusTrap = _interopDefault(require('focus-trap-react'));
 var reactPopper = require('react-popper');
@@ -151,6 +151,7 @@ var iconTypes = [
     'exchange',
     'external-link',
     'eye',
+    'filter-solid',
     'filter',
     'flag',
     'gears',
@@ -170,6 +171,7 @@ var iconTypes = [
     'new',
     'no',
     'pencil',
+    'play',
     'plus',
     'question-circle',
     'radio-checked',
@@ -219,6 +221,7 @@ function __variableDynamicImportRuntime0__(path) {
     case './icons/exchange.svg': return Promise.resolve().then(function () { return require('./exchange.js'); });
     case './icons/external-link.svg': return Promise.resolve().then(function () { return require('./external-link.js'); });
     case './icons/eye.svg': return Promise.resolve().then(function () { return require('./eye.js'); });
+    case './icons/filter-solid.svg': return Promise.resolve().then(function () { return require('./filter-solid.js'); });
     case './icons/filter.svg': return Promise.resolve().then(function () { return require('./filter.js'); });
     case './icons/flag.svg': return Promise.resolve().then(function () { return require('./flag.js'); });
     case './icons/gears.svg': return Promise.resolve().then(function () { return require('./gears.js'); });
@@ -238,6 +241,7 @@ function __variableDynamicImportRuntime0__(path) {
     case './icons/new.svg': return Promise.resolve().then(function () { return require('./new.js'); });
     case './icons/no.svg': return Promise.resolve().then(function () { return require('./no.js'); });
     case './icons/pencil.svg': return Promise.resolve().then(function () { return require('./pencil.js'); });
+    case './icons/play.svg': return Promise.resolve().then(function () { return require('./play.js'); });
     case './icons/plus.svg': return Promise.resolve().then(function () { return require('./plus.js'); });
     case './icons/question-circle.svg': return Promise.resolve().then(function () { return require('./question-circle.js'); });
     case './icons/radio-checked.svg': return Promise.resolve().then(function () { return require('./radio-checked.js'); });
@@ -307,6 +311,207 @@ Icon.propTypes = {
 };
 Icon.displayName = 'Icon';
 
+var PanelTrigger = function (_a) {
+    var children = _a.children, className = _a.className, open = _a.open, fullWidth = _a.fullWidth, onClick = _a.onClick, _b = _a.iconExpanded, iconExpanded = _b === void 0 ? 'chevron-down' : _b, _c = _a.iconCollapsed, iconCollapsed = _c === void 0 ? 'chevron-right' : _c, heading = _a.heading, otherProps = tslib.__rest(_a, ["children", "className", "open", "fullWidth", "onClick", "iconExpanded", "iconCollapsed", "heading"]);
+    var Header = typeof heading === 'object' && 'level' in heading && !!heading.level
+        ? "h".concat(heading.level)
+        : React__default.Fragment;
+    return (React__default.createElement(Header, null,
+        React__default.createElement("button", tslib.__assign({ className: classNames(className, 'ExpandCollapse__trigger', {
+                fullWidth: fullWidth
+            }), type: "button", "aria-expanded": open, onClick: onClick }, otherProps),
+            React__default.createElement("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function'
+                ? children({ open: !!open })
+                : children),
+            React__default.createElement(Icon, { type: open ? iconExpanded : iconCollapsed }))));
+};
+PanelTrigger.propTypes = {
+    children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
+    open: PropTypes.bool,
+    iconExpanded: PropTypes.string,
+    iconCollapsed: PropTypes.string,
+    heading: PropTypes.number
+};
+PanelTrigger.displayName = 'PanelTrigger';
+var PanelTrigger$1 = React__default.memo(PanelTrigger);
+
+var injectStyleTag = function () {
+    var style = document.createElement('style');
+    document.head.appendChild(style);
+    return style;
+};
+var setStyle = function (tag, cssString) {
+    tag.textContent = cssString;
+};
+var removeStyleTag = function (tag) {
+    document.head.removeChild(tag);
+};
+
+var ExpandCollapsePanel = /** @class */ (function (_super) {
+    tslib.__extends(ExpandCollapsePanel, _super);
+    function ExpandCollapsePanel() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.state = {
+            controlled: typeof _this.props.open !== 'undefined',
+            isOpen: typeof _this.props.open !== 'undefined' ? _this.props.open : false
+        };
+        _this.panel = React__default.createRef();
+        _this.handleToggle = function (e) {
+            var onToggle = _this.props.onToggle;
+            var _a = _this.state, isOpen = _a.isOpen, controlled = _a.controlled;
+            onToggle(e);
+            if (!controlled) {
+                _this.setState({ isOpen: !isOpen, isAnimating: true });
+            }
+        };
+        _this.animateOpen = function () {
+            var panel = _this.panel.current;
+            var animationTiming = _this.props.animationTiming;
+            if (!animationTiming) {
+                _this.setState({ isAnimating: false });
+                return;
+            }
+            var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
+            if (!rect) {
+                return;
+            }
+            if (!_this.styleTag) {
+                _this.styleTag = injectStyleTag();
+            }
+            setStyle(_this.styleTag, "\n      @keyframes expandOpenAnimation {\n        0% { opacity: 0; height: 0; }\n        100% { opacity: 1; height: ".concat(rect.height, "px; }\n      }\n\n      .cauldron-expand-open {\n        will-change: opacity, height;\n        overflow: hidden;\n        animation: expandOpenAnimation ease-in-out ").concat(animationTiming, "ms forwards;\n      }\n    "));
+            _this.setState({ animationClass: 'cauldron-expand-open' }, function () {
+                setTimeout(function () {
+                    _this.setState({ animationClass: '', isAnimating: false });
+                    setStyle(_this.styleTag, '');
+                }, animationTiming);
+            });
+        };
+        _this.animateClose = function () {
+            var panel = _this.panel.current;
+            var animationTiming = _this.props.animationTiming;
+            if (!animationTiming) {
+                _this.setState({ isAnimating: false });
+                return;
+            }
+            if (!_this.styleTag) {
+                _this.styleTag = injectStyleTag();
+            }
+            var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
+            if (!rect)
+                return;
+            setStyle(_this.styleTag, "\n      @keyframes collapseCloseAnimation {\n        0% { opacity: 1; height: ".concat(rect.height, "px; }\n        100% { opacity: 0; height: 0; }\n      }\n\n      .cauldron-collapse-close {\n        will-change: opacity, height;\n        overflow: hidden;\n        animation: collapseCloseAnimation ease-in-out ").concat(animationTiming, "ms forwards;\n      }\n    "));
+            _this.setState({ animationClass: 'cauldron-collapse-close' }, function () {
+                setTimeout(function () {
+                    _this.setState({ animationClass: '', isAnimating: false });
+                    setStyle(_this.styleTag, '');
+                }, animationTiming);
+            });
+        };
+        return _this;
+    }
+    ExpandCollapsePanel.prototype.componentWillUnmount = function () {
+        var styleTag = this.styleTag;
+        if (styleTag) {
+            removeStyleTag(styleTag);
+        }
+    };
+    ExpandCollapsePanel.prototype.componentDidUpdate = function (prevProps, prevState) {
+        var _a = this.state, openState = _a.isOpen, controlled = _a.controlled;
+        var openProp = this.props.open;
+        if (controlled && openState !== openProp) {
+            this.setState({ isOpen: !!openProp, isAnimating: true });
+        }
+        if (typeof openProp !== typeof prevProps.open) {
+            this.setState({ controlled: typeof openProp !== 'undefined' });
+        }
+        if (prevState.isOpen !== openState && openState) {
+            this.animateOpen();
+        }
+        else if (prevState.isOpen !== openState && !openState) {
+            this.animateClose();
+        }
+    };
+    ExpandCollapsePanel.prototype.render = function () {
+        var _a = this.props, children = _a.children, animationTiming = _a.animationTiming, className = _a.className, onToggle = _a.onToggle, open = _a.open, otherProps = tslib.__rest(_a, ["children", "animationTiming", "className", "onToggle", "open"]);
+        var _b = this.state, isOpen = _b.isOpen, isAnimating = _b.isAnimating, animationClass = _b.animationClass;
+        var trigger = React__default.Children.toArray(children).find(function (child) { return child.type === PanelTrigger$1; });
+        var panelElements = React__default.Children.toArray(children).filter(function (child) {
+            return typeof child === 'string' ||
+                child.type !== PanelTrigger$1;
+        });
+        return (React__default.createElement(React__default.Fragment, null,
+            trigger &&
+                React__default.cloneElement(trigger, {
+                    open: isOpen,
+                    onClick: this.handleToggle
+                }),
+            React__default.createElement("div", tslib.__assign({ className: classNames(className, 'ExpandCollapse__panel', animationClass, {
+                    'is--hidden': !isOpen && !isAnimating
+                }), ref: this.panel }, otherProps), panelElements)));
+    };
+    ExpandCollapsePanel.defaultProps = {
+        animationTiming: 250,
+        // eslint-disable-next-line @typescript-eslint/no-empty-function
+        onToggle: function () { }
+    };
+    ExpandCollapsePanel.propTypes = {
+        open: PropTypes.bool,
+        children: PropTypes.node.isRequired,
+        className: PropTypes.string,
+        animationTiming: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
+        onToggle: PropTypes.func
+    };
+    return ExpandCollapsePanel;
+}(React__default.Component));
+
+var AccordionTrigger = function (_a) {
+    var children = _a.children, triggerProps = tslib.__rest(_a, ["children"]);
+    return React__default.createElement(React__default.Fragment, null, children);
+};
+var AccordionContent = function (_a) {
+    var children = _a.children, className = _a.className, otherProps = tslib.__rest(_a, ["children", "className"]);
+    return (React__default.createElement("div", tslib.__assign({ className: classNames('Accordion__panel', className) }, otherProps), children));
+};
+var Accordion = function (_a) {
+    var children = _a.children;
+    var childrenArray = React__default.Children.toArray(children);
+    var trigger = childrenArray.find(function (child) { return child.type === AccordionTrigger; });
+    var panelElement = childrenArray.find(function (child) {
+        return typeof child === 'string' ||
+            child.type === AccordionContent;
+    });
+    var isValid = !!(React__default.isValidElement(trigger) && React__default.isValidElement(panelElement));
+    if (!isValid) {
+        console.warn('Must provide <AccordionTrigger /> and <AccordionContent /> element(s). You provided:', {
+            trigger: trigger,
+            panelElement: panelElement,
+            isValid: isValid
+        });
+        return null;
+    }
+    var _b = trigger.props, triggerClassName = _b.className, triggerProps = tslib.__rest(_b, ["className"]);
+    var elementId = nextId.useId();
+    return (React__default.createElement("div", { className: "Accordion" },
+        React__default.createElement(ExpandCollapsePanel, tslib.__assign({ id: panelElement.props.id || "".concat(elementId, "-panel") }, panelElement.props),
+            React__default.createElement(PanelTrigger$1, tslib.__assign({ iconCollapsed: "triangle-right", iconExpanded: "triangle-down", className: classNames('Accordion__trigger', trigger.props.className), "aria-controls": panelElement.props.id || "".concat(elementId, "-panel"), heading: trigger.props.heading }, trigger.props), trigger),
+            panelElement)));
+};
+Accordion.displayName = 'Accordion';
+AccordionContent.displayName = 'AccordionContent';
+AccordionTrigger.displayName = 'AccordionTrigger';
+Accordion.propTypes = {
+    children: PropTypes.node,
+    className: PropTypes.string
+};
+AccordionTrigger.propTypes = {
+    children: PropTypes.node,
+    heading: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', undefined])
+};
+AccordionContent.propTypes = {
+    children: PropTypes.node.isRequired,
+    className: PropTypes.string
+};
+
 var Scrim = /** @class */ (function (_super) {
     tslib.__extends(Scrim, _super);
     function Scrim(props) {
@@ -792,9 +997,13 @@ var OptionsMenuList = /** @class */ (function (_super) {
             var _a = child.props, className = _a.className, other = tslib.__rest(_a, ["className"]);
             return React__default.cloneElement(child, tslib.__assign({ key: "list-item-".concat(i), className: classNames('OptionsMenu__list-item', className), tabIndex: -1, role: 'menuitem', ref: function (el) { return (_this.itemRefs[i] = el); } }, other));
         });
+        // This allows the ClickOutsideListener to only be activated when the menu is
+        // currently open. This prevents an obscure behavior where the activation of a
+        // different menu would cause all menus to close
+        var clickOutsideEventActive = !show ? false : undefined;
         // Key event is being handled in componentDidMount
         /* eslint-disable jsx-a11y/click-events-have-key-events */
-        return (React__default.createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside },
+        return (React__default.createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside, mouseEvent: clickOutsideEventActive, touchEvent: clickOutsideEventActive },
             React__default.createElement("ul", tslib.__assign({}, other, { className: classNames('OptionsMenu__list', className), "aria-expanded": show, role: "menu", onClick: handleClick, ref: function (el) {
                     _this.menuRef = el;
                     if (menuRef) {
@@ -833,7 +1042,6 @@ var OptionsMenu = /** @class */ (function (_super) {
                 var show = _a.show;
                 return ({ show: !show });
             });
-            event.preventDefault();
         };
         _this.handleClose = function () {
             var _a;
@@ -2678,152 +2886,6 @@ var TextField = /** @class */ (function (_super) {
     return TextField;
 }(React__default.Component));
 
-function PanelTrigger(_a) {
-    var children = _a.children, className = _a.className, open = _a.open, fullWidth = _a.fullWidth, onClick = _a.onClick, _b = _a.iconExpanded, iconExpanded = _b === void 0 ? 'chevron-down' : _b, _c = _a.iconCollapsed, iconCollapsed = _c === void 0 ? 'chevron-right' : _c, other = tslib.__rest(_a, ["children", "className", "open", "fullWidth", "onClick", "iconExpanded", "iconCollapsed"]);
-    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: open ? iconExpanded : iconCollapsed })));
-}
-PanelTrigger.propTypes = {
-    children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
-    open: PropTypes.bool,
-    onClick: PropTypes.func,
-    className: PropTypes.string,
-    iconExpanded: PropTypes.string,
-    iconCollapsed: PropTypes.string
-};
-var PanelTrigger$1 = React__default.memo(PanelTrigger);
-
-var injectStyleTag = function () {
-    var style = document.createElement('style');
-    document.head.appendChild(style);
-    return style;
-};
-var setStyle = function (tag, cssString) {
-    tag.textContent = cssString;
-};
-var removeStyleTag = function (tag) {
-    document.head.removeChild(tag);
-};
-
-var ExpandCollapsePanel = /** @class */ (function (_super) {
-    tslib.__extends(ExpandCollapsePanel, _super);
-    function ExpandCollapsePanel() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.state = {
-            controlled: typeof _this.props.open !== 'undefined',
-            isOpen: typeof _this.props.open !== 'undefined' ? _this.props.open : false
-        };
-        _this.panel = React__default.createRef();
-        _this.handleToggle = function (e) {
-            var onToggle = _this.props.onToggle;
-            var _a = _this.state, isOpen = _a.isOpen, controlled = _a.controlled;
-            onToggle(e);
-            if (!controlled) {
-                _this.setState({ isOpen: !isOpen, isAnimating: true });
-            }
-        };
-        _this.animateOpen = function () {
-            var panel = _this.panel.current;
-            var animationTiming = _this.props.animationTiming;
-            if (!animationTiming) {
-                _this.setState({ isAnimating: false });
-                return;
-            }
-            var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
-            if (!rect) {
-                return;
-            }
-            if (!_this.styleTag) {
-                _this.styleTag = injectStyleTag();
-            }
-            setStyle(_this.styleTag, "\n      @keyframes expandOpenAnimation {\n        0% { opacity: 0; height: 0; }\n        100% { opacity: 1; height: ".concat(rect.height, "px; }\n      }\n\n      .cauldron-expand-open {\n        will-change: opacity, height;\n        overflow: hidden;\n        animation: expandOpenAnimation ease-in-out ").concat(animationTiming, "ms forwards;\n      }\n    "));
-            _this.setState({ animationClass: 'cauldron-expand-open' }, function () {
-                setTimeout(function () {
-                    _this.setState({ animationClass: '', isAnimating: false });
-                    setStyle(_this.styleTag, '');
-                }, animationTiming);
-            });
-        };
-        _this.animateClose = function () {
-            var panel = _this.panel.current;
-            var animationTiming = _this.props.animationTiming;
-            if (!animationTiming) {
-                _this.setState({ isAnimating: false });
-                return;
-            }
-            if (!_this.styleTag) {
-                _this.styleTag = injectStyleTag();
-            }
-            var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
-            if (!rect)
-                return;
-            setStyle(_this.styleTag, "\n      @keyframes collapseCloseAnimation {\n        0% { opacity: 1; height: ".concat(rect.height, "px; }\n        100% { opacity: 0; height: 0; }\n      }\n\n      .cauldron-collapse-close {\n        will-change: opacity, height;\n        overflow: hidden;\n        animation: collapseCloseAnimation ease-in-out ").concat(animationTiming, "ms forwards;\n      }\n    "));
-            _this.setState({ animationClass: 'cauldron-collapse-close' }, function () {
-                setTimeout(function () {
-                    _this.setState({ animationClass: '', isAnimating: false });
-                    setStyle(_this.styleTag, '');
-                }, animationTiming);
-            });
-        };
-        return _this;
-    }
-    ExpandCollapsePanel.prototype.componentWillUnmount = function () {
-        var styleTag = this.styleTag;
-        if (styleTag) {
-            removeStyleTag(styleTag);
-        }
-    };
-    ExpandCollapsePanel.prototype.componentDidUpdate = function (prevProps, prevState) {
-        var _a = this.state, openState = _a.isOpen, controlled = _a.controlled;
-        var openProp = this.props.open;
-        if (controlled && openState !== openProp) {
-            this.setState({ isOpen: !!openProp, isAnimating: true });
-        }
-        if (typeof openProp !== typeof prevProps.open) {
-            this.setState({ controlled: typeof openProp !== 'undefined' });
-        }
-        if (prevState.isOpen !== openState && openState) {
-            this.animateOpen();
-        }
-        else if (prevState.isOpen !== openState && !openState) {
-            this.animateClose();
-        }
-    };
-    ExpandCollapsePanel.prototype.render = function () {
-        /* eslint-disable no-unused-vars */
-        var _a = this.props, children = _a.children, animationTiming = _a.animationTiming, className = _a.className, onToggle = _a.onToggle, open = _a.open, other = tslib.__rest(_a, ["children", "animationTiming", "className", "onToggle", "open"]);
-        /* eslint-enable no-unused-vars */
-        var _b = this.state, isOpen = _b.isOpen, isAnimating = _b.isAnimating, animationClass = _b.animationClass;
-        var trigger = React__default.Children.toArray(children).find(function (child) { return child.type === PanelTrigger$1; });
-        var panelElements = React__default.Children.toArray(children).filter(function (child) {
-            return typeof child === 'string' ||
-                child.type !== PanelTrigger$1;
-        });
-        return (React__default.createElement(React__default.Fragment, null,
-            trigger &&
-                React__default.cloneElement(trigger, {
-                    open: isOpen,
-                    onClick: this.handleToggle
-                }),
-            React__default.createElement("div", tslib.__assign({}, other, { className: classNames('ExpandCollapse__panel', animationClass, className, {
-                    'is--hidden': !isOpen && !isAnimating
-                }), ref: this.panel }), panelElements)));
-    };
-    ExpandCollapsePanel.defaultProps = {
-        animationTiming: 250,
-        onToggle: function () { }
-    };
-    ExpandCollapsePanel.propTypes = {
-        open: PropTypes.bool,
-        children: PropTypes.node.isRequired,
-        className: PropTypes.string,
-        animationTiming: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
-        onToggle: PropTypes.func
-    };
-    return ExpandCollapsePanel;
-}(React__default.Component));
-
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -8685,6 +8747,7 @@ var BreadcrumbLink = React.forwardRef(function (_a, ref) {
     var className = _a.className, _b = _a.as, ElementType = _b === void 0 ? 'a' : _b, children = _a.children, props = tslib.__rest(_a, ["className", "as", "children"]);
     return (React__default.createElement(ElementType, tslib.__assign({ className: classNames('Link', 'Breadcrumb__Link', className), ref: ref }, props), children));
 });
+BreadcrumbLink.displayName = 'BreadcrumbLink';
 
 var ColumnLeft = React.forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, props = tslib.__rest(_a, ["className", "children"]);
@@ -8913,6 +8976,9 @@ ThemeProvider.propTypes = {
     initialTheme: PropTypes.string
 };
 
+exports.Accordion = Accordion;
+exports.AccordionContent = AccordionContent;
+exports.AccordionTrigger = AccordionTrigger;
 exports.Address = Address;
 exports.AddressCityStateZip = AddressCityStateZip;
 exports.AddressLine = AddressLine;

package/lib/play.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);
+
+var _path;
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const SvgPlay = props => /*#__PURE__*/React.createElement("svg", _extends({
+  xmlns: "http://www.w3.org/2000/svg",
+  overflow: "visible",
+  preserveAspectRatio: "none",
+  viewBox: "0 0 24 24",
+  height: 24,
+  width: 24
+}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+  d: "M8 5v14l11-7z",
+  fill: "currentColor",
+  vectorEffect: "non-scaling-stroke"
+})));
+
+exports.default = SvgPlay;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "4.5.0-canary.9a1593ae",
+  "version": "4.5.0-canary.c21fc13b",
   "description": "Fully accessible react components library for Deque Cauldron",
   "publishConfig": {
     "access": "public"