@deque/cauldron-react 4.6.0-canary.53b76d5e → 4.6.0-canary.5fcb9709

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.
@@ -33,7 +33,7 @@ interface AccordionProps extends ExpandCollapsePanelProps {
33
33
  children: React.ReactNode;
34
34
  }
35
35
  declare const Accordion: {
36
- ({ children }: AccordionProps): JSX.Element | null;
36
+ ({ children, open, onToggle, animationTiming, ...props }: AccordionProps): JSX.Element | null;
37
37
  displayName: string;
38
38
  propTypes: {
39
39
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
@@ -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' | 'clipboard' | 'close' | 'code' | 'copy' | 'download' | 'dropper' | 'exchange' | 'export-solid' | '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';
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' | 'export-solid' | '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-alt' | '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[];
@@ -9,10 +9,10 @@ interface Props extends React.HTMLAttributes<HTMLDivElement> {
9
9
  previousPageLabel?: string;
10
10
  nextPageLabel?: string;
11
11
  lastPageLabel?: string;
12
- onNextPageClick?: () => void;
13
- onPreviousPageClick?: () => void;
14
- onFirstPageClick?: () => void;
15
- onLastPageClick?: () => void;
12
+ onNextPageClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
13
+ onPreviousPageClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
14
+ onFirstPageClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
15
+ onLastPageClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
16
16
  tooltipPlacement?: Placement;
17
17
  thin?: boolean;
18
18
  className?: string;
@@ -5,6 +5,7 @@ interface TwoColumnPanelProps extends React.HTMLAttributes<HTMLDivElement> {
5
5
  showCollapsedPanelLabel?: string;
6
6
  hideCollapsedPanelLabel?: string;
7
7
  skipLink?: SkipLink;
8
+ collapsedMediaQuery?: string;
8
9
  }
9
10
  declare const TwoColumnPanel: React.ForwardRefExoticComponent<TwoColumnPanelProps & React.RefAttributes<HTMLDivElement>>;
10
11
  export default TwoColumnPanel;
package/lib/index.js CHANGED
@@ -175,6 +175,7 @@ var iconTypes = [
175
175
  'pencil',
176
176
  'play',
177
177
  'plus',
178
+ 'question-circle-alt',
178
179
  'question-circle',
179
180
  'radio-checked',
180
181
  'radio-unchecked',
@@ -247,6 +248,7 @@ function __variableDynamicImportRuntime0__(path) {
247
248
  case './icons/pencil.svg': return Promise.resolve().then(function () { return require('./pencil.js'); });
248
249
  case './icons/play.svg': return Promise.resolve().then(function () { return require('./play.js'); });
249
250
  case './icons/plus.svg': return Promise.resolve().then(function () { return require('./plus.js'); });
251
+ case './icons/question-circle-alt.svg': return Promise.resolve().then(function () { return require('./question-circle-alt.js'); });
250
252
  case './icons/question-circle.svg': return Promise.resolve().then(function () { return require('./question-circle.js'); });
251
253
  case './icons/radio-checked.svg': return Promise.resolve().then(function () { return require('./radio-checked.js'); });
252
254
  case './icons/radio-unchecked.svg': return Promise.resolve().then(function () { return require('./radio-unchecked.js'); });
@@ -479,7 +481,7 @@ var AccordionContent = function (_a) {
479
481
  return (React__default.createElement("div", tslib.__assign({ className: classNames('Accordion__panel', className) }, otherProps), children));
480
482
  };
481
483
  var Accordion = function (_a) {
482
- var children = _a.children;
484
+ var children = _a.children, open = _a.open, onToggle = _a.onToggle, animationTiming = _a.animationTiming, props = tslib.__rest(_a, ["children", "open", "onToggle", "animationTiming"]);
483
485
  var childrenArray = React__default.Children.toArray(children);
484
486
  var trigger = childrenArray.find(function (child) {
485
487
  return typeof child === 'string' ||
@@ -500,8 +502,8 @@ var Accordion = function (_a) {
500
502
  }
501
503
  var _b = trigger.props, triggerClassName = _b.className, triggerProps = tslib.__rest(_b, ["className"]);
502
504
  var elementId = nextId.useId();
503
- return (React__default.createElement("div", { className: "Accordion" },
504
- React__default.createElement(ExpandCollapsePanel, tslib.__assign({ id: panelElement.props.id || "".concat(elementId, "-panel") }, panelElement.props),
505
+ return (React__default.createElement("div", tslib.__assign({ className: "Accordion" }, props),
506
+ React__default.createElement(ExpandCollapsePanel, tslib.__assign({ id: panelElement.props.id || "".concat(elementId, "-panel"), open: open, onToggle: onToggle, animationTiming: animationTiming }, panelElement.props),
505
507
  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),
506
508
  panelElement)));
507
509
  };
@@ -8775,10 +8777,10 @@ var ColumnRight = React.forwardRef(function (_a, ref) {
8775
8777
  ColumnRight.displayName = 'ColumnRight';
8776
8778
 
8777
8779
  var TwoColumnPanel = React.forwardRef(function (_a, ref) {
8778
- var className = _a.className, children = _a.children, _b = _a.initialCollapsed, initialCollapsed = _b === void 0 ? false : _b, _c = _a.showCollapsedPanelLabel, showCollapsedPanelLabel = _c === void 0 ? 'Show Panel' : _c, _d = _a.hideCollapsedPanelLabel, hideCollapsedPanelLabel = _d === void 0 ? 'Hide Panel' : _d, _e = _a.skipLink, skipLink = _e === void 0 ? null : _e, props = tslib.__rest(_a, ["className", "children", "initialCollapsed", "showCollapsedPanelLabel", "hideCollapsedPanelLabel", "skipLink"]);
8779
- var _f = tslib.__read(React.useState(initialCollapsed), 2), isCollapsed = _f[0], setCollapsed = _f[1];
8780
- var _g = tslib.__read(React.useState(false), 2), isFocusTrap = _g[0], setIsFocusTrap = _g[1];
8781
- var _h = tslib.__read(React.useState(!initialCollapsed), 2), showPanel = _h[0], setShowPanel = _h[1];
8780
+ var className = _a.className, children = _a.children, _b = _a.initialCollapsed, initialCollapsed = _b === void 0 ? false : _b, _c = _a.showCollapsedPanelLabel, showCollapsedPanelLabel = _c === void 0 ? 'Show Panel' : _c, _d = _a.hideCollapsedPanelLabel, hideCollapsedPanelLabel = _d === void 0 ? 'Hide Panel' : _d, _e = _a.skipLink, skipLink = _e === void 0 ? null : _e, _f = _a.collapsedMediaQuery, collapsedMediaQuery = _f === void 0 ? '(max-width: 45rem)' : _f, props = tslib.__rest(_a, ["className", "children", "initialCollapsed", "showCollapsedPanelLabel", "hideCollapsedPanelLabel", "skipLink", "collapsedMediaQuery"]);
8781
+ var _g = tslib.__read(React.useState(initialCollapsed), 2), isCollapsed = _g[0], setCollapsed = _g[1];
8782
+ var _h = tslib.__read(React.useState(false), 2), isFocusTrap = _h[0], setIsFocusTrap = _h[1];
8783
+ var _j = tslib.__read(React.useState(!initialCollapsed), 2), showPanel = _j[0], setShowPanel = _j[1];
8782
8784
  var toggleButtonRef = React.useRef(null);
8783
8785
  var closeButtonRef = React.useRef(null);
8784
8786
  var columnLeftRef = React.useRef(null);
@@ -8852,7 +8854,7 @@ var TwoColumnPanel = React.forwardRef(function (_a, ref) {
8852
8854
  }, [columnLeftRef.current, isCollapsed]);
8853
8855
  // When the collapsable panel starts to overlay content, it needs to become a focus trap and collapsed by default
8854
8856
  React.useLayoutEffect(function () {
8855
- var mediaQueryList = matchMedia('(max-width: 45rem)');
8857
+ var mediaQueryList = matchMedia(collapsedMediaQuery);
8856
8858
  var handleMatch = function (matches) {
8857
8859
  setIsFocusTrap(matches);
8858
8860
  var collapsed = matches ? true : isCollapsed;
@@ -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 SvgQuestionCircleAlt = 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: "M13.07 14.93a.34.34 0 0 0-.24-.09h-1.66c-.18-.01-.32.13-.33.31v1.69c-.01.18.13.32.31.33h1.69c.18.01.32-.13.33-.31v-1.69a.31.31 0 0 0-.1-.24zM15.83 10c-.01-.88-.43-1.71-1.14-2.23-.69-.59-1.57-.92-2.48-.93-1.48-.05-2.88.72-3.63 2-.05.07-.07.16-.05.24.01.08.05.16.12.21l1.12.85c.06.04.13.06.2.06.1 0 .2-.04.26-.12.24-.32.52-.61.83-.86.3-.2.65-.29 1-.28.36 0 .71.11 1 .31.27.15.44.43.45.74.01.2-.08.39-.23.51-.24.18-.5.33-.78.45l-.5.21c-.15.08-.29.17-.43.27-.16.1-.29.23-.41.37-.11.15-.19.32-.25.49-.07.22-.11.44-.11.67v.71c-.01.18.13.32.31.33h1.69c.18.01.32-.13.33-.31V13.33c0-.11.05-.22.12-.3.08-.1.17-.18.27-.25l.48-.29c.27-.15.47-.27.62-.37.19-.14.37-.29.54-.46.21-.2.37-.45.47-.72.12-.3.19-.62.2-.94zm-1.24-4.13a6.57 6.57 0 0 1 3.55 3.55 6.54 6.54 0 0 1 0 5.17 6.57 6.57 0 0 1-3.55 3.55 6.54 6.54 0 0 1-5.17 0 6.57 6.57 0 0 1-3.55-3.55 6.54 6.54 0 0 1 0-5.17c.66-1.6 1.94-2.88 3.54-3.55 1.65-.71 3.53-.71 5.18 0zM18.92 8A8.016 8.016 0 0 0 16 5.08 7.798 7.798 0 0 0 12 4c-1.41-.01-2.79.37-4 1.08-1.21.7-2.22 1.71-2.92 2.92A7.798 7.798 0 0 0 4 12c-.01 1.41.36 2.79 1.07 4 .7 1.21 1.71 2.22 2.93 2.92 1.21.71 2.59 1.09 4 1.08 1.41.01 2.79-.36 4-1.07 1.21-.7 2.22-1.71 2.92-2.93A7.798 7.798 0 0 0 20 12c.01-1.41-.37-2.79-1.08-4z",
20
+ fill: "currentColor",
21
+ vectorEffect: "non-scaling-stroke"
22
+ })));
23
+
24
+ exports.default = SvgQuestionCircleAlt;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deque/cauldron-react",
3
- "version": "4.6.0-canary.53b76d5e",
3
+ "version": "4.6.0-canary.5fcb9709",
4
4
  "description": "Fully accessible react components library for Deque Cauldron",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -80,7 +80,7 @@
80
80
  "react-router-dom": "^5.1.2",
81
81
  "rollup": "^2.23.0",
82
82
  "sinon": "^10.0.0",
83
- "ts-node": "^10.8.1",
83
+ "ts-node": "^10.9.1",
84
84
  "typescript": "^4.7.3"
85
85
  },
86
86
  "repository": {