@deque/cauldron-react 4.5.0-canary.fa9f1d61 → 4.6.0-canary.6b49f783
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cauldron.css +0 -1
- package/lib/clipboard.js +24 -0
- package/lib/components/Accordion/Accordion.d.ts +42 -0
- package/lib/components/Accordion/index.d.ts +3 -0
- package/lib/components/Breadcrumb/BreadcrumbLink.d.ts +1 -1
- package/lib/components/ExpandCollapsePanel/PanelTrigger.d.ts +9 -7
- package/lib/components/Icon/types.d.ts +1 -1
- package/lib/components/Select/index.d.ts +1 -1
- package/lib/filter-solid.js +24 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +215 -149
- package/package.json +1 -1
package/lib/cauldron.css
CHANGED
package/lib/clipboard.js
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var React__default = _interopDefault(React);
|
|
7
|
+
|
|
8
|
+
var _path;
|
|
9
|
+
|
|
10
|
+
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); }
|
|
11
|
+
|
|
12
|
+
const SvgClipboard = props => /*#__PURE__*/React.createElement("svg", _extends({
|
|
13
|
+
overflow: "visible",
|
|
14
|
+
preserveAspectRatio: "none",
|
|
15
|
+
viewBox: "0 0 24 24",
|
|
16
|
+
height: 24,
|
|
17
|
+
width: 24
|
|
18
|
+
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
19
|
+
d: "M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm2 14H7v-2h7v2zm3-4H7v-2h10v2zm0-4H7V7h10v2z",
|
|
20
|
+
fill: "currentColor",
|
|
21
|
+
vectorEffect: "non-scaling-stroke"
|
|
22
|
+
})));
|
|
23
|
+
|
|
24
|
+
exports.default = SvgClipboard;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ExpandCollapsePanelProps } from '../ExpandCollapsePanel';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
export interface AccordionTriggerProps extends React.HTMLAttributes<HTMLButtonElement> {
|
|
5
|
+
children: React.ReactElement;
|
|
6
|
+
heading?: React.ReactElement | {
|
|
7
|
+
level: string | undefined;
|
|
8
|
+
};
|
|
9
|
+
}
|
|
10
|
+
declare const AccordionTrigger: {
|
|
11
|
+
({ children, ...triggerProps }: AccordionTriggerProps): JSX.Element;
|
|
12
|
+
displayName: string;
|
|
13
|
+
propTypes: {
|
|
14
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
15
|
+
heading: PropTypes.Requireable<string | undefined>;
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
interface AccordionContentProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
19
|
+
children: React.ReactNode | React.ReactNode[];
|
|
20
|
+
className?: string;
|
|
21
|
+
}
|
|
22
|
+
declare const AccordionContent: {
|
|
23
|
+
({ children, className, ...otherProps }: AccordionContentProps): JSX.Element;
|
|
24
|
+
displayName: string;
|
|
25
|
+
propTypes: {
|
|
26
|
+
children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
27
|
+
className: PropTypes.Requireable<string>;
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
interface AccordionProps extends ExpandCollapsePanelProps {
|
|
31
|
+
children: React.ReactNode;
|
|
32
|
+
}
|
|
33
|
+
declare const Accordion: {
|
|
34
|
+
({ children }: AccordionProps): JSX.Element | null;
|
|
35
|
+
displayName: string;
|
|
36
|
+
propTypes: {
|
|
37
|
+
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
38
|
+
className: PropTypes.Requireable<string>;
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
export default Accordion;
|
|
42
|
+
export { Accordion, AccordionTrigger, AccordionContent };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
interface BreadcrumbLinkProps extends React.
|
|
2
|
+
interface BreadcrumbLinkProps extends Omit<React.LinkHTMLAttributes<HTMLLinkElement>, 'as'> {
|
|
3
3
|
as?: React.ElementType;
|
|
4
4
|
}
|
|
5
5
|
declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -10,17 +10,19 @@ export interface PanelTriggerProps extends Omit<React.ButtonHTMLAttributes<HTMLB
|
|
|
10
10
|
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
11
11
|
iconExpanded?: IconType;
|
|
12
12
|
iconCollapsed?: IconType;
|
|
13
|
+
heading?: React.ReactElement | {
|
|
14
|
+
level: string | undefined;
|
|
15
|
+
};
|
|
13
16
|
}
|
|
14
|
-
declare
|
|
15
|
-
|
|
16
|
-
|
|
17
|
+
declare const _default: React.MemoExoticComponent<{
|
|
18
|
+
({ children, className, open, fullWidth, onClick, iconExpanded, iconCollapsed, heading, ...otherProps }: PanelTriggerProps): JSX.Element;
|
|
19
|
+
propTypes: {
|
|
17
20
|
children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
18
21
|
open: PropTypes.Requireable<boolean>;
|
|
19
|
-
onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
20
|
-
className: PropTypes.Requireable<string>;
|
|
21
22
|
iconExpanded: PropTypes.Requireable<string>;
|
|
22
23
|
iconCollapsed: PropTypes.Requireable<string>;
|
|
24
|
+
heading: PropTypes.Requireable<number>;
|
|
23
25
|
};
|
|
24
|
-
|
|
25
|
-
|
|
26
|
+
displayName: string;
|
|
27
|
+
}>;
|
|
26
28
|
export default _default;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
* GENERATED CODE. DO NOT EDIT DIRECTLY!
|
|
3
3
|
*/
|
|
4
4
|
/** IconType represents each valid icon type. */
|
|
5
|
-
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' | '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';
|
|
5
|
+
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' | 'clipboard' | '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';
|
|
6
6
|
/** iconTypes holds each valid icon type. */
|
|
7
7
|
export declare const iconTypes: string[];
|
|
@@ -15,5 +15,5 @@ export interface SelectProps extends Omit<React.HTMLProps<HTMLSelectElement>, 'c
|
|
|
15
15
|
defaultValue?: any;
|
|
16
16
|
onChange?: (e: React.ChangeEvent<HTMLSelectElement>) => void;
|
|
17
17
|
}
|
|
18
|
-
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" | "
|
|
18
|
+
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>>;
|
|
19
19
|
export default Select;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var React__default = _interopDefault(React);
|
|
7
|
+
|
|
8
|
+
var _path;
|
|
9
|
+
|
|
10
|
+
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); }
|
|
11
|
+
|
|
12
|
+
const SvgFilterSolid = props => /*#__PURE__*/React.createElement("svg", _extends({
|
|
13
|
+
overflow: "visible",
|
|
14
|
+
preserveAspectRatio: "none",
|
|
15
|
+
viewBox: "0 0 24 24",
|
|
16
|
+
height: 24,
|
|
17
|
+
width: 24
|
|
18
|
+
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
19
|
+
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",
|
|
20
|
+
vectorEffect: "non-scaling-stroke",
|
|
21
|
+
fill: "currentColor"
|
|
22
|
+
})));
|
|
23
|
+
|
|
24
|
+
exports.default = SvgFilterSolid;
|
package/lib/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
export { default as Workspace } from './components/Workspace';
|
|
5
5
|
export { default as Main } from './components/Main';
|
|
6
|
+
export { default as Accordion, AccordionTrigger, AccordionContent } from './components/Accordion';
|
|
6
7
|
export { default as Layout } from './components/Layout';
|
|
7
8
|
export { default as Icon, IconType, iconTypes } from './components/Icon';
|
|
8
9
|
export { default as Offscreen } from './components/Offscreen';
|
package/lib/index.js
CHANGED
|
@@ -9,9 +9,9 @@ var React = require('react');
|
|
|
9
9
|
var React__default = _interopDefault(React);
|
|
10
10
|
var PropTypes = _interopDefault(require('prop-types'));
|
|
11
11
|
var classNames = _interopDefault(require('classnames'));
|
|
12
|
-
var keyname = _interopDefault(require('keyname'));
|
|
13
12
|
var nextId = require('react-id-generator');
|
|
14
13
|
var nextId__default = _interopDefault(nextId);
|
|
14
|
+
var keyname = _interopDefault(require('keyname'));
|
|
15
15
|
var reactDom = require('react-dom');
|
|
16
16
|
var FocusTrap = _interopDefault(require('focus-trap-react'));
|
|
17
17
|
var reactPopper = require('react-popper');
|
|
@@ -143,6 +143,7 @@ var iconTypes = [
|
|
|
143
143
|
'chevron-down',
|
|
144
144
|
'chevron-left',
|
|
145
145
|
'chevron-right',
|
|
146
|
+
'clipboard',
|
|
146
147
|
'close',
|
|
147
148
|
'code',
|
|
148
149
|
'copy',
|
|
@@ -151,6 +152,7 @@ var iconTypes = [
|
|
|
151
152
|
'exchange',
|
|
152
153
|
'external-link',
|
|
153
154
|
'eye',
|
|
155
|
+
'filter-solid',
|
|
154
156
|
'filter',
|
|
155
157
|
'flag',
|
|
156
158
|
'gears',
|
|
@@ -212,6 +214,7 @@ function __variableDynamicImportRuntime0__(path) {
|
|
|
212
214
|
case './icons/checkbox-unchecked.svg': return Promise.resolve().then(function () { return require('./checkbox-unchecked.js'); });
|
|
213
215
|
case './icons/chevron-double.svg': return Promise.resolve().then(function () { return require('./chevron-double.js'); });
|
|
214
216
|
case './icons/chevron.svg': return Promise.resolve().then(function () { return require('./chevron.js'); });
|
|
217
|
+
case './icons/clipboard.svg': return Promise.resolve().then(function () { return require('./clipboard.js'); });
|
|
215
218
|
case './icons/close.svg': return Promise.resolve().then(function () { return require('./close.js'); });
|
|
216
219
|
case './icons/code.svg': return Promise.resolve().then(function () { return require('./code.js'); });
|
|
217
220
|
case './icons/copy.svg': return Promise.resolve().then(function () { return require('./copy.js'); });
|
|
@@ -220,6 +223,7 @@ function __variableDynamicImportRuntime0__(path) {
|
|
|
220
223
|
case './icons/exchange.svg': return Promise.resolve().then(function () { return require('./exchange.js'); });
|
|
221
224
|
case './icons/external-link.svg': return Promise.resolve().then(function () { return require('./external-link.js'); });
|
|
222
225
|
case './icons/eye.svg': return Promise.resolve().then(function () { return require('./eye.js'); });
|
|
226
|
+
case './icons/filter-solid.svg': return Promise.resolve().then(function () { return require('./filter-solid.js'); });
|
|
223
227
|
case './icons/filter.svg': return Promise.resolve().then(function () { return require('./filter.js'); });
|
|
224
228
|
case './icons/flag.svg': return Promise.resolve().then(function () { return require('./flag.js'); });
|
|
225
229
|
case './icons/gears.svg': return Promise.resolve().then(function () { return require('./gears.js'); });
|
|
@@ -309,6 +313,207 @@ Icon.propTypes = {
|
|
|
309
313
|
};
|
|
310
314
|
Icon.displayName = 'Icon';
|
|
311
315
|
|
|
316
|
+
var PanelTrigger = function (_a) {
|
|
317
|
+
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"]);
|
|
318
|
+
var Header = typeof heading === 'object' && 'level' in heading && !!heading.level
|
|
319
|
+
? "h".concat(heading.level)
|
|
320
|
+
: React__default.Fragment;
|
|
321
|
+
return (React__default.createElement(Header, null,
|
|
322
|
+
React__default.createElement("button", tslib.__assign({ className: classNames(className, 'ExpandCollapse__trigger', {
|
|
323
|
+
fullWidth: fullWidth
|
|
324
|
+
}), type: "button", "aria-expanded": open, onClick: onClick }, otherProps),
|
|
325
|
+
React__default.createElement("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function'
|
|
326
|
+
? children({ open: !!open })
|
|
327
|
+
: children),
|
|
328
|
+
React__default.createElement(Icon, { type: open ? iconExpanded : iconCollapsed }))));
|
|
329
|
+
};
|
|
330
|
+
PanelTrigger.propTypes = {
|
|
331
|
+
children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
|
|
332
|
+
open: PropTypes.bool,
|
|
333
|
+
iconExpanded: PropTypes.string,
|
|
334
|
+
iconCollapsed: PropTypes.string,
|
|
335
|
+
heading: PropTypes.number
|
|
336
|
+
};
|
|
337
|
+
PanelTrigger.displayName = 'PanelTrigger';
|
|
338
|
+
var PanelTrigger$1 = React__default.memo(PanelTrigger);
|
|
339
|
+
|
|
340
|
+
var injectStyleTag = function () {
|
|
341
|
+
var style = document.createElement('style');
|
|
342
|
+
document.head.appendChild(style);
|
|
343
|
+
return style;
|
|
344
|
+
};
|
|
345
|
+
var setStyle = function (tag, cssString) {
|
|
346
|
+
tag.textContent = cssString;
|
|
347
|
+
};
|
|
348
|
+
var removeStyleTag = function (tag) {
|
|
349
|
+
document.head.removeChild(tag);
|
|
350
|
+
};
|
|
351
|
+
|
|
352
|
+
var ExpandCollapsePanel = /** @class */ (function (_super) {
|
|
353
|
+
tslib.__extends(ExpandCollapsePanel, _super);
|
|
354
|
+
function ExpandCollapsePanel() {
|
|
355
|
+
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
356
|
+
_this.state = {
|
|
357
|
+
controlled: typeof _this.props.open !== 'undefined',
|
|
358
|
+
isOpen: typeof _this.props.open !== 'undefined' ? _this.props.open : false
|
|
359
|
+
};
|
|
360
|
+
_this.panel = React__default.createRef();
|
|
361
|
+
_this.handleToggle = function (e) {
|
|
362
|
+
var onToggle = _this.props.onToggle;
|
|
363
|
+
var _a = _this.state, isOpen = _a.isOpen, controlled = _a.controlled;
|
|
364
|
+
onToggle(e);
|
|
365
|
+
if (!controlled) {
|
|
366
|
+
_this.setState({ isOpen: !isOpen, isAnimating: true });
|
|
367
|
+
}
|
|
368
|
+
};
|
|
369
|
+
_this.animateOpen = function () {
|
|
370
|
+
var panel = _this.panel.current;
|
|
371
|
+
var animationTiming = _this.props.animationTiming;
|
|
372
|
+
if (!animationTiming) {
|
|
373
|
+
_this.setState({ isAnimating: false });
|
|
374
|
+
return;
|
|
375
|
+
}
|
|
376
|
+
var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
|
|
377
|
+
if (!rect) {
|
|
378
|
+
return;
|
|
379
|
+
}
|
|
380
|
+
if (!_this.styleTag) {
|
|
381
|
+
_this.styleTag = injectStyleTag();
|
|
382
|
+
}
|
|
383
|
+
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 "));
|
|
384
|
+
_this.setState({ animationClass: 'cauldron-expand-open' }, function () {
|
|
385
|
+
setTimeout(function () {
|
|
386
|
+
_this.setState({ animationClass: '', isAnimating: false });
|
|
387
|
+
setStyle(_this.styleTag, '');
|
|
388
|
+
}, animationTiming);
|
|
389
|
+
});
|
|
390
|
+
};
|
|
391
|
+
_this.animateClose = function () {
|
|
392
|
+
var panel = _this.panel.current;
|
|
393
|
+
var animationTiming = _this.props.animationTiming;
|
|
394
|
+
if (!animationTiming) {
|
|
395
|
+
_this.setState({ isAnimating: false });
|
|
396
|
+
return;
|
|
397
|
+
}
|
|
398
|
+
if (!_this.styleTag) {
|
|
399
|
+
_this.styleTag = injectStyleTag();
|
|
400
|
+
}
|
|
401
|
+
var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
|
|
402
|
+
if (!rect)
|
|
403
|
+
return;
|
|
404
|
+
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 "));
|
|
405
|
+
_this.setState({ animationClass: 'cauldron-collapse-close' }, function () {
|
|
406
|
+
setTimeout(function () {
|
|
407
|
+
_this.setState({ animationClass: '', isAnimating: false });
|
|
408
|
+
setStyle(_this.styleTag, '');
|
|
409
|
+
}, animationTiming);
|
|
410
|
+
});
|
|
411
|
+
};
|
|
412
|
+
return _this;
|
|
413
|
+
}
|
|
414
|
+
ExpandCollapsePanel.prototype.componentWillUnmount = function () {
|
|
415
|
+
var styleTag = this.styleTag;
|
|
416
|
+
if (styleTag) {
|
|
417
|
+
removeStyleTag(styleTag);
|
|
418
|
+
}
|
|
419
|
+
};
|
|
420
|
+
ExpandCollapsePanel.prototype.componentDidUpdate = function (prevProps, prevState) {
|
|
421
|
+
var _a = this.state, openState = _a.isOpen, controlled = _a.controlled;
|
|
422
|
+
var openProp = this.props.open;
|
|
423
|
+
if (controlled && openState !== openProp) {
|
|
424
|
+
this.setState({ isOpen: !!openProp, isAnimating: true });
|
|
425
|
+
}
|
|
426
|
+
if (typeof openProp !== typeof prevProps.open) {
|
|
427
|
+
this.setState({ controlled: typeof openProp !== 'undefined' });
|
|
428
|
+
}
|
|
429
|
+
if (prevState.isOpen !== openState && openState) {
|
|
430
|
+
this.animateOpen();
|
|
431
|
+
}
|
|
432
|
+
else if (prevState.isOpen !== openState && !openState) {
|
|
433
|
+
this.animateClose();
|
|
434
|
+
}
|
|
435
|
+
};
|
|
436
|
+
ExpandCollapsePanel.prototype.render = function () {
|
|
437
|
+
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"]);
|
|
438
|
+
var _b = this.state, isOpen = _b.isOpen, isAnimating = _b.isAnimating, animationClass = _b.animationClass;
|
|
439
|
+
var trigger = React__default.Children.toArray(children).find(function (child) { return child.type === PanelTrigger$1; });
|
|
440
|
+
var panelElements = React__default.Children.toArray(children).filter(function (child) {
|
|
441
|
+
return typeof child === 'string' ||
|
|
442
|
+
child.type !== PanelTrigger$1;
|
|
443
|
+
});
|
|
444
|
+
return (React__default.createElement(React__default.Fragment, null,
|
|
445
|
+
trigger &&
|
|
446
|
+
React__default.cloneElement(trigger, {
|
|
447
|
+
open: isOpen,
|
|
448
|
+
onClick: this.handleToggle
|
|
449
|
+
}),
|
|
450
|
+
React__default.createElement("div", tslib.__assign({ className: classNames(className, 'ExpandCollapse__panel', animationClass, {
|
|
451
|
+
'is--hidden': !isOpen && !isAnimating
|
|
452
|
+
}), ref: this.panel }, otherProps), panelElements)));
|
|
453
|
+
};
|
|
454
|
+
ExpandCollapsePanel.defaultProps = {
|
|
455
|
+
animationTiming: 250,
|
|
456
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
457
|
+
onToggle: function () { }
|
|
458
|
+
};
|
|
459
|
+
ExpandCollapsePanel.propTypes = {
|
|
460
|
+
open: PropTypes.bool,
|
|
461
|
+
children: PropTypes.node.isRequired,
|
|
462
|
+
className: PropTypes.string,
|
|
463
|
+
animationTiming: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
|
|
464
|
+
onToggle: PropTypes.func
|
|
465
|
+
};
|
|
466
|
+
return ExpandCollapsePanel;
|
|
467
|
+
}(React__default.Component));
|
|
468
|
+
|
|
469
|
+
var AccordionTrigger = function (_a) {
|
|
470
|
+
var children = _a.children, triggerProps = tslib.__rest(_a, ["children"]);
|
|
471
|
+
return React__default.createElement(React__default.Fragment, null, children);
|
|
472
|
+
};
|
|
473
|
+
var AccordionContent = function (_a) {
|
|
474
|
+
var children = _a.children, className = _a.className, otherProps = tslib.__rest(_a, ["children", "className"]);
|
|
475
|
+
return (React__default.createElement("div", tslib.__assign({ className: classNames('Accordion__panel', className) }, otherProps), children));
|
|
476
|
+
};
|
|
477
|
+
var Accordion = function (_a) {
|
|
478
|
+
var children = _a.children;
|
|
479
|
+
var childrenArray = React__default.Children.toArray(children);
|
|
480
|
+
var trigger = childrenArray.find(function (child) { return child.type === AccordionTrigger; });
|
|
481
|
+
var panelElement = childrenArray.find(function (child) {
|
|
482
|
+
return typeof child === 'string' ||
|
|
483
|
+
child.type === AccordionContent;
|
|
484
|
+
});
|
|
485
|
+
var isValid = !!(React__default.isValidElement(trigger) && React__default.isValidElement(panelElement));
|
|
486
|
+
if (!isValid) {
|
|
487
|
+
console.warn('Must provide <AccordionTrigger /> and <AccordionContent /> element(s). You provided:', {
|
|
488
|
+
trigger: trigger,
|
|
489
|
+
panelElement: panelElement,
|
|
490
|
+
isValid: isValid
|
|
491
|
+
});
|
|
492
|
+
return null;
|
|
493
|
+
}
|
|
494
|
+
var _b = trigger.props, triggerClassName = _b.className, triggerProps = tslib.__rest(_b, ["className"]);
|
|
495
|
+
var elementId = nextId.useId();
|
|
496
|
+
return (React__default.createElement("div", { className: "Accordion" },
|
|
497
|
+
React__default.createElement(ExpandCollapsePanel, tslib.__assign({ id: panelElement.props.id || "".concat(elementId, "-panel") }, panelElement.props),
|
|
498
|
+
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),
|
|
499
|
+
panelElement)));
|
|
500
|
+
};
|
|
501
|
+
Accordion.displayName = 'Accordion';
|
|
502
|
+
AccordionContent.displayName = 'AccordionContent';
|
|
503
|
+
AccordionTrigger.displayName = 'AccordionTrigger';
|
|
504
|
+
Accordion.propTypes = {
|
|
505
|
+
children: PropTypes.node,
|
|
506
|
+
className: PropTypes.string
|
|
507
|
+
};
|
|
508
|
+
AccordionTrigger.propTypes = {
|
|
509
|
+
children: PropTypes.node,
|
|
510
|
+
heading: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', undefined])
|
|
511
|
+
};
|
|
512
|
+
AccordionContent.propTypes = {
|
|
513
|
+
children: PropTypes.node.isRequired,
|
|
514
|
+
className: PropTypes.string
|
|
515
|
+
};
|
|
516
|
+
|
|
312
517
|
var Scrim = /** @class */ (function (_super) {
|
|
313
518
|
tslib.__extends(Scrim, _super);
|
|
314
519
|
function Scrim(props) {
|
|
@@ -794,9 +999,13 @@ var OptionsMenuList = /** @class */ (function (_super) {
|
|
|
794
999
|
var _a = child.props, className = _a.className, other = tslib.__rest(_a, ["className"]);
|
|
795
1000
|
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));
|
|
796
1001
|
});
|
|
1002
|
+
// This allows the ClickOutsideListener to only be activated when the menu is
|
|
1003
|
+
// currently open. This prevents an obscure behavior where the activation of a
|
|
1004
|
+
// different menu would cause all menus to close
|
|
1005
|
+
var clickOutsideEventActive = !show ? false : undefined;
|
|
797
1006
|
// Key event is being handled in componentDidMount
|
|
798
1007
|
/* eslint-disable jsx-a11y/click-events-have-key-events */
|
|
799
|
-
return (React__default.createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside },
|
|
1008
|
+
return (React__default.createElement(ClickOutsideListener, { onClickOutside: this.handleClickOutside, mouseEvent: clickOutsideEventActive, touchEvent: clickOutsideEventActive },
|
|
800
1009
|
React__default.createElement("ul", tslib.__assign({}, other, { className: classNames('OptionsMenu__list', className), "aria-expanded": show, role: "menu", onClick: handleClick, ref: function (el) {
|
|
801
1010
|
_this.menuRef = el;
|
|
802
1011
|
if (menuRef) {
|
|
@@ -835,7 +1044,6 @@ var OptionsMenu = /** @class */ (function (_super) {
|
|
|
835
1044
|
var show = _a.show;
|
|
836
1045
|
return ({ show: !show });
|
|
837
1046
|
});
|
|
838
|
-
event.preventDefault();
|
|
839
1047
|
};
|
|
840
1048
|
_this.handleClose = function () {
|
|
841
1049
|
var _a;
|
|
@@ -2680,152 +2888,6 @@ var TextField = /** @class */ (function (_super) {
|
|
|
2680
2888
|
return TextField;
|
|
2681
2889
|
}(React__default.Component));
|
|
2682
2890
|
|
|
2683
|
-
function PanelTrigger(_a) {
|
|
2684
|
-
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"]);
|
|
2685
|
-
return (React__default.createElement("button", tslib.__assign({}, other, { className: classNames('ExpandCollapse__trigger', fullWidth ? 'fullWidth' : '', className), type: "button", "aria-expanded": open, onClick: onClick }),
|
|
2686
|
-
React__default.createElement("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function' ? children({ open: !!open }) : children),
|
|
2687
|
-
React__default.createElement(Icon, { type: open ? iconExpanded : iconCollapsed })));
|
|
2688
|
-
}
|
|
2689
|
-
PanelTrigger.propTypes = {
|
|
2690
|
-
children: PropTypes.oneOfType([PropTypes.func, PropTypes.node]),
|
|
2691
|
-
open: PropTypes.bool,
|
|
2692
|
-
onClick: PropTypes.func,
|
|
2693
|
-
className: PropTypes.string,
|
|
2694
|
-
iconExpanded: PropTypes.string,
|
|
2695
|
-
iconCollapsed: PropTypes.string
|
|
2696
|
-
};
|
|
2697
|
-
var PanelTrigger$1 = React__default.memo(PanelTrigger);
|
|
2698
|
-
|
|
2699
|
-
var injectStyleTag = function () {
|
|
2700
|
-
var style = document.createElement('style');
|
|
2701
|
-
document.head.appendChild(style);
|
|
2702
|
-
return style;
|
|
2703
|
-
};
|
|
2704
|
-
var setStyle = function (tag, cssString) {
|
|
2705
|
-
tag.textContent = cssString;
|
|
2706
|
-
};
|
|
2707
|
-
var removeStyleTag = function (tag) {
|
|
2708
|
-
document.head.removeChild(tag);
|
|
2709
|
-
};
|
|
2710
|
-
|
|
2711
|
-
var ExpandCollapsePanel = /** @class */ (function (_super) {
|
|
2712
|
-
tslib.__extends(ExpandCollapsePanel, _super);
|
|
2713
|
-
function ExpandCollapsePanel() {
|
|
2714
|
-
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
2715
|
-
_this.state = {
|
|
2716
|
-
controlled: typeof _this.props.open !== 'undefined',
|
|
2717
|
-
isOpen: typeof _this.props.open !== 'undefined' ? _this.props.open : false
|
|
2718
|
-
};
|
|
2719
|
-
_this.panel = React__default.createRef();
|
|
2720
|
-
_this.handleToggle = function (e) {
|
|
2721
|
-
var onToggle = _this.props.onToggle;
|
|
2722
|
-
var _a = _this.state, isOpen = _a.isOpen, controlled = _a.controlled;
|
|
2723
|
-
onToggle(e);
|
|
2724
|
-
if (!controlled) {
|
|
2725
|
-
_this.setState({ isOpen: !isOpen, isAnimating: true });
|
|
2726
|
-
}
|
|
2727
|
-
};
|
|
2728
|
-
_this.animateOpen = function () {
|
|
2729
|
-
var panel = _this.panel.current;
|
|
2730
|
-
var animationTiming = _this.props.animationTiming;
|
|
2731
|
-
if (!animationTiming) {
|
|
2732
|
-
_this.setState({ isAnimating: false });
|
|
2733
|
-
return;
|
|
2734
|
-
}
|
|
2735
|
-
var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
|
|
2736
|
-
if (!rect) {
|
|
2737
|
-
return;
|
|
2738
|
-
}
|
|
2739
|
-
if (!_this.styleTag) {
|
|
2740
|
-
_this.styleTag = injectStyleTag();
|
|
2741
|
-
}
|
|
2742
|
-
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 "));
|
|
2743
|
-
_this.setState({ animationClass: 'cauldron-expand-open' }, function () {
|
|
2744
|
-
setTimeout(function () {
|
|
2745
|
-
_this.setState({ animationClass: '', isAnimating: false });
|
|
2746
|
-
setStyle(_this.styleTag, '');
|
|
2747
|
-
}, animationTiming);
|
|
2748
|
-
});
|
|
2749
|
-
};
|
|
2750
|
-
_this.animateClose = function () {
|
|
2751
|
-
var panel = _this.panel.current;
|
|
2752
|
-
var animationTiming = _this.props.animationTiming;
|
|
2753
|
-
if (!animationTiming) {
|
|
2754
|
-
_this.setState({ isAnimating: false });
|
|
2755
|
-
return;
|
|
2756
|
-
}
|
|
2757
|
-
if (!_this.styleTag) {
|
|
2758
|
-
_this.styleTag = injectStyleTag();
|
|
2759
|
-
}
|
|
2760
|
-
var rect = panel === null || panel === void 0 ? void 0 : panel.getBoundingClientRect();
|
|
2761
|
-
if (!rect)
|
|
2762
|
-
return;
|
|
2763
|
-
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 "));
|
|
2764
|
-
_this.setState({ animationClass: 'cauldron-collapse-close' }, function () {
|
|
2765
|
-
setTimeout(function () {
|
|
2766
|
-
_this.setState({ animationClass: '', isAnimating: false });
|
|
2767
|
-
setStyle(_this.styleTag, '');
|
|
2768
|
-
}, animationTiming);
|
|
2769
|
-
});
|
|
2770
|
-
};
|
|
2771
|
-
return _this;
|
|
2772
|
-
}
|
|
2773
|
-
ExpandCollapsePanel.prototype.componentWillUnmount = function () {
|
|
2774
|
-
var styleTag = this.styleTag;
|
|
2775
|
-
if (styleTag) {
|
|
2776
|
-
removeStyleTag(styleTag);
|
|
2777
|
-
}
|
|
2778
|
-
};
|
|
2779
|
-
ExpandCollapsePanel.prototype.componentDidUpdate = function (prevProps, prevState) {
|
|
2780
|
-
var _a = this.state, openState = _a.isOpen, controlled = _a.controlled;
|
|
2781
|
-
var openProp = this.props.open;
|
|
2782
|
-
if (controlled && openState !== openProp) {
|
|
2783
|
-
this.setState({ isOpen: !!openProp, isAnimating: true });
|
|
2784
|
-
}
|
|
2785
|
-
if (typeof openProp !== typeof prevProps.open) {
|
|
2786
|
-
this.setState({ controlled: typeof openProp !== 'undefined' });
|
|
2787
|
-
}
|
|
2788
|
-
if (prevState.isOpen !== openState && openState) {
|
|
2789
|
-
this.animateOpen();
|
|
2790
|
-
}
|
|
2791
|
-
else if (prevState.isOpen !== openState && !openState) {
|
|
2792
|
-
this.animateClose();
|
|
2793
|
-
}
|
|
2794
|
-
};
|
|
2795
|
-
ExpandCollapsePanel.prototype.render = function () {
|
|
2796
|
-
/* eslint-disable no-unused-vars */
|
|
2797
|
-
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"]);
|
|
2798
|
-
/* eslint-enable no-unused-vars */
|
|
2799
|
-
var _b = this.state, isOpen = _b.isOpen, isAnimating = _b.isAnimating, animationClass = _b.animationClass;
|
|
2800
|
-
var trigger = React__default.Children.toArray(children).find(function (child) { return child.type === PanelTrigger$1; });
|
|
2801
|
-
var panelElements = React__default.Children.toArray(children).filter(function (child) {
|
|
2802
|
-
return typeof child === 'string' ||
|
|
2803
|
-
child.type !== PanelTrigger$1;
|
|
2804
|
-
});
|
|
2805
|
-
return (React__default.createElement(React__default.Fragment, null,
|
|
2806
|
-
trigger &&
|
|
2807
|
-
React__default.cloneElement(trigger, {
|
|
2808
|
-
open: isOpen,
|
|
2809
|
-
onClick: this.handleToggle
|
|
2810
|
-
}),
|
|
2811
|
-
React__default.createElement("div", tslib.__assign({}, other, { className: classNames('ExpandCollapse__panel', animationClass, className, {
|
|
2812
|
-
'is--hidden': !isOpen && !isAnimating
|
|
2813
|
-
}), ref: this.panel }), panelElements)));
|
|
2814
|
-
};
|
|
2815
|
-
ExpandCollapsePanel.defaultProps = {
|
|
2816
|
-
animationTiming: 250,
|
|
2817
|
-
onToggle: function () { }
|
|
2818
|
-
};
|
|
2819
|
-
ExpandCollapsePanel.propTypes = {
|
|
2820
|
-
open: PropTypes.bool,
|
|
2821
|
-
children: PropTypes.node.isRequired,
|
|
2822
|
-
className: PropTypes.string,
|
|
2823
|
-
animationTiming: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]),
|
|
2824
|
-
onToggle: PropTypes.func
|
|
2825
|
-
};
|
|
2826
|
-
return ExpandCollapsePanel;
|
|
2827
|
-
}(React__default.Component));
|
|
2828
|
-
|
|
2829
2891
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
2830
2892
|
if (source == null) return {};
|
|
2831
2893
|
var target = {};
|
|
@@ -8687,6 +8749,7 @@ var BreadcrumbLink = React.forwardRef(function (_a, ref) {
|
|
|
8687
8749
|
var className = _a.className, _b = _a.as, ElementType = _b === void 0 ? 'a' : _b, children = _a.children, props = tslib.__rest(_a, ["className", "as", "children"]);
|
|
8688
8750
|
return (React__default.createElement(ElementType, tslib.__assign({ className: classNames('Link', 'Breadcrumb__Link', className), ref: ref }, props), children));
|
|
8689
8751
|
});
|
|
8752
|
+
BreadcrumbLink.displayName = 'BreadcrumbLink';
|
|
8690
8753
|
|
|
8691
8754
|
var ColumnLeft = React.forwardRef(function (_a, ref) {
|
|
8692
8755
|
var className = _a.className, children = _a.children, props = tslib.__rest(_a, ["className", "children"]);
|
|
@@ -8915,6 +8978,9 @@ ThemeProvider.propTypes = {
|
|
|
8915
8978
|
initialTheme: PropTypes.string
|
|
8916
8979
|
};
|
|
8917
8980
|
|
|
8981
|
+
exports.Accordion = Accordion;
|
|
8982
|
+
exports.AccordionContent = AccordionContent;
|
|
8983
|
+
exports.AccordionTrigger = AccordionTrigger;
|
|
8918
8984
|
exports.Address = Address;
|
|
8919
8985
|
exports.AddressCityStateZip = AddressCityStateZip;
|
|
8920
8986
|
exports.AddressLine = AddressLine;
|