@deque/cauldron-react 4.6.0-canary.74cbb93c → 4.6.0-canary.8df85c5f

package/lib/components/TwoColumnPanel/TwoColumnPanel.d.ts

@@ -5,6 +5,7 @@ interface TwoColumnPanelProps extends React.HTMLAttributes<HTMLDivElement> {
     showCollapsedPanelLabel?: string;
     hideCollapsedPanelLabel?: string;
     skipLink?: SkipLink;
+    collapsedMediaQuery?: string;
 }
 declare const TwoColumnPanel: React.ForwardRefExoticComponent<TwoColumnPanelProps & React.RefAttributes<HTMLDivElement>>;
 export default TwoColumnPanel;

package/lib/index.js

@@ -8777,10 +8777,10 @@ var ColumnRight = React.forwardRef(function (_a, ref) {
 ColumnRight.displayName = 'ColumnRight';
 
 var TwoColumnPanel = React.forwardRef(function (_a, ref) {
-    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"]);
-    var _f = tslib.__read(React.useState(initialCollapsed), 2), isCollapsed = _f[0], setCollapsed = _f[1];
-    var _g = tslib.__read(React.useState(false), 2), isFocusTrap = _g[0], setIsFocusTrap = _g[1];
-    var _h = tslib.__read(React.useState(!initialCollapsed), 2), showPanel = _h[0], setShowPanel = _h[1];
+    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"]);
+    var _g = tslib.__read(React.useState(initialCollapsed), 2), isCollapsed = _g[0], setCollapsed = _g[1];
+    var _h = tslib.__read(React.useState(false), 2), isFocusTrap = _h[0], setIsFocusTrap = _h[1];
+    var _j = tslib.__read(React.useState(!initialCollapsed), 2), showPanel = _j[0], setShowPanel = _j[1];
     var toggleButtonRef = React.useRef(null);
     var closeButtonRef = React.useRef(null);
     var columnLeftRef = React.useRef(null);
@@ -8854,7 +8854,7 @@ var TwoColumnPanel = React.forwardRef(function (_a, ref) {
     }, [columnLeftRef.current, isCollapsed]);
     // When the collapsable panel starts to overlay content, it needs to become a focus trap and collapsed by default
     React.useLayoutEffect(function () {
-        var mediaQueryList = matchMedia('(max-width: 45rem)');
+        var mediaQueryList = matchMedia(collapsedMediaQuery);
         var handleMatch = function (matches) {
             setIsFocusTrap(matches);
             var collapsed = matches ? true : isCollapsed;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deque/cauldron-react",
-  "version": "4.6.0-canary.74cbb93c",
+  "version": "4.6.0-canary.8df85c5f",
   "description": "Fully accessible react components library for Deque Cauldron",
   "publishConfig": {
     "access": "public"