Improved Responsiveness controllers - "remember" latest state of selected breakpoint.

layouts/scripts/dist/index.min.js

@@ -11180,16 +11180,12 @@ function ResponsiveButton({
   active,
   onSelect
 }) {
-  // active = true;
   const [state, setState] = react.exports.useState({
     open: true,
-    breakpoint: defaultResponsiveOptions[mode]
+    activeBreakpoint: defaultResponsiveOptions[mode]
   });
 
-  const updateState = update => {
-    // update.open = true;
-    setState(Object.assign({}, state, update));
-  };
+  const updateState = update => setState(Object.assign({}, state, update));
 
   react.exports.useEffect(() => {
     const closeDropdown = e => isEscHit(e) ? updateState({
@@ -11206,11 +11202,10 @@ function ResponsiveButton({
     };
   }); // Blur event / Outside click
 
-  const outsideClickAction = async e => (await isClickOutside(e)) ? updateState({
+  const handleBlur = async e => (await isClickOutside(e)) ? updateState({
     open: false
   }) : null;
 
-  const handleBlur = react.exports.useCallback(outsideClickAction, []);
   return /*#__PURE__*/React.createElement(ResponsiveButtonStyle, {
     tabIndex: "0",
     onBlur: handleBlur
@@ -11220,27 +11215,27 @@ function ResponsiveButton({
     onClick: () => select()
   }, mode), active && state.open && responsiveOptions[mode] && /*#__PURE__*/React.createElement(ResponsiveOptionsDropdown, null, responsiveOptions[mode].map(breakpoint => {
     return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement("a", {
-      className: state.breakpoint === breakpoint ? 'active' : '',
+      className: state.activeBreakpoint === breakpoint ? 'active' : '',
       onClick: () => select(breakpoint)
     }, breakpoint));
   }))); //
   // Actions
   //
 
-  function select(breakpoint = null) {
+  function select(activeBreakpoint = null) {
     // Click on option in Dropdown.
-    if (breakpoint) {
+    if (activeBreakpoint) {
       updateState({
         open: false,
-        breakpoint
+        activeBreakpoint
       });
-      onSelect(breakpoint);
+      onSelect(activeBreakpoint);
       return;
     } // Click on device button.
 
 
     if (!active) {
-      onSelect(state.breakpoint);
+      onSelect(state.activeBreakpoint);
       updateState({
         open: false
       });
@@ -11254,9 +11249,7 @@ function ResponsiveButton({
 async function isClickOutside(e) {
   const currentTarget = e.currentTarget;
   return new Promise(resolve => {
-    setTimeout(() => {
-      resolve(!currentTarget.contains(document.activeElement));
-    }, 100);
+    setTimeout(() => resolve(!currentTarget.contains(document.activeElement)));
   });
 }
 function isEscHit(event) {