@react-aria/selection 3.0.0-alpha.1 → 3.0.0-nightly-4980928d3-240906

package/dist/main.js

@@ -1,399 +1,21 @@
-var _temp = require("react");
+var $b6837c2f80a3c32f$exports = require("./useSelectableCollection.main.js");
+var $433b1145b0781e10$exports = require("./useSelectableItem.main.js");
+var $bd230acee196f50c$exports = require("./useSelectableList.main.js");
+var $836f880b12dcae5c$exports = require("./ListKeyboardDelegate.main.js");
+var $2ac4508142683dcb$exports = require("./DOMLayoutDelegate.main.js");
+var $a1189052f36475e8$exports = require("./useTypeSelect.main.js");
 
-var useEffect = _temp.useEffect;
-var useRef = _temp.useRef;
-var useMemo = _temp.useMemo;
 
-var _temp2 = require("@react-aria/utils");
-
-var mergeProps = _temp2.mergeProps;
-var focusWithoutScrolling = _temp2.focusWithoutScrolling;
-
-var _babelRuntimeHelpersClassCallCheck = $parcel$interopDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _babelRuntimeHelpersCreateClass = $parcel$interopDefault(require("@babel/runtime/helpers/createClass"));
-
-var _babelRuntimeHelpersDefineProperty = $parcel$interopDefault(require("@babel/runtime/helpers/defineProperty"));
-
-var useCollator = require("@react-aria/i18n").useCollator;
-
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
-}
-
-function useTypeSelect(options) {
-  var keyboardDelegate = options.keyboardDelegate,
-      selectionManager = options.selectionManager,
-      onTypeSelect = options.onTypeSelect;
-  var state = useRef({
-    search: '',
-    timeout: null
-  }).current;
-
-  var onKeyDown = function onKeyDown(e) {
-    var character = $b843d8ac9c2b714d56acf7bb325b078e$var$getStringForKey(e.key);
-
-    if (!character) {
-      return;
-    }
-
-    state.search += character; // Use the delegate to find a key to focus.
-    // Prioritize items after the currently focused item, falling back to searching the whole list.
-
-    var key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);
-
-    if (!key) {
-      key = keyboardDelegate.getKeyForSearch(state.search);
-    }
-
-    if (key) {
-      selectionManager.setFocusedKey(key);
-
-      if (onTypeSelect) {
-        onTypeSelect(key);
-      }
-    }
-
-    clearTimeout(state.timeout);
-    state.timeout = setTimeout(function () {
-      state.search = '';
-    }, 500);
-  };
-
-  return {
-    typeSelectProps: {
-      onKeyDown: keyboardDelegate.getKeyForSearch ? onKeyDown : null
-    }
-  };
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
 }
 
-exports.useTypeSelect = useTypeSelect;
-
-function $b843d8ac9c2b714d56acf7bb325b078e$var$getStringForKey(key) {
-  // If the key is of length 1, it is an ASCII value.
-  // Otherwise, if there are no ASCII characters in the key name,
-  // it is a Unicode character.
-  // See https://www.w3.org/TR/uievents-key/
-  if (key.length === 1 || !/^[A-Z]/i.test(key)) {
-    return key;
-  }
-
-  return '';
-}
-
-var $f6850b13dba63fef3157aa366dff950$var$isMac = typeof window !== 'undefined' && window.navigator != null ? /^Mac/.test(window.navigator.platform) : false;
-
-function $f6850b13dba63fef3157aa366dff950$var$isCtrlKeyPressed(e) {
-  if ($f6850b13dba63fef3157aa366dff950$var$isMac) {
-    return e.metaKey;
-  }
-
-  return e.ctrlKey;
-}
-
-function useSelectableCollection(options) {
-  var manager = options.selectionManager,
-      delegate = options.keyboardDelegate,
-      _options$autoFocus = options.autoFocus,
-      autoFocus = _options$autoFocus === void 0 ? false : _options$autoFocus,
-      _options$shouldFocusW = options.shouldFocusWrap,
-      shouldFocusWrap = _options$shouldFocusW === void 0 ? false : _options$shouldFocusW,
-      _options$disallowEmpt = options.disallowEmptySelection,
-      disallowEmptySelection = _options$disallowEmpt === void 0 ? false : _options$disallowEmpt,
-      _options$disallowSele = options.disallowSelectAll,
-      disallowSelectAll = _options$disallowSele === void 0 ? false : _options$disallowSele;
-
-  var onKeyDown = function onKeyDown(e) {
-    switch (e.key) {
-      case 'ArrowDown':
-        {
-          if (delegate.getKeyBelow) {
-            e.preventDefault();
-            var nextKey = delegate.getKeyBelow(manager.focusedKey);
-
-            if (nextKey) {
-              manager.setFocusedKey(nextKey);
-            } else if (shouldFocusWrap) {
-              manager.setFocusedKey(delegate.getFirstKey());
-            }
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(nextKey);
-            }
-          }
-
-          break;
-        }
-
-      case 'ArrowUp':
-        {
-          if (delegate.getKeyAbove) {
-            e.preventDefault();
-
-            var _nextKey = delegate.getKeyAbove(manager.focusedKey);
-
-            if (_nextKey) {
-              manager.setFocusedKey(_nextKey);
-            } else if (shouldFocusWrap) {
-              manager.setFocusedKey(delegate.getLastKey());
-            }
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(_nextKey);
-            }
-          }
-
-          break;
-        }
-
-      case 'ArrowLeft':
-        {
-          if (delegate.getKeyLeftOf) {
-            e.preventDefault();
-
-            var _nextKey2 = delegate.getKeyLeftOf(manager.focusedKey);
-
-            if (_nextKey2) {
-              manager.setFocusedKey(_nextKey2);
-            }
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(_nextKey2);
-            }
-          }
-
-          break;
-        }
-
-      case 'ArrowRight':
-        {
-          if (delegate.getKeyRightOf) {
-            e.preventDefault();
-
-            var _nextKey3 = delegate.getKeyRightOf(manager.focusedKey);
-
-            if (_nextKey3) {
-              manager.setFocusedKey(_nextKey3);
-            }
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(_nextKey3);
-            }
-          }
-
-          break;
-        }
-
-      case 'Home':
-        if (delegate.getFirstKey) {
-          e.preventDefault();
-          var firstKey = delegate.getFirstKey();
-          manager.setFocusedKey(firstKey);
-
-          if ($f6850b13dba63fef3157aa366dff950$var$isCtrlKeyPressed(e) && e.shiftKey && manager.selectionMode === 'multiple') {
-            manager.extendSelection(firstKey);
-          }
-        }
-
-        break;
-
-      case 'End':
-        if (delegate.getLastKey) {
-          e.preventDefault();
-          var lastKey = delegate.getLastKey();
-          manager.setFocusedKey(lastKey);
-
-          if ($f6850b13dba63fef3157aa366dff950$var$isCtrlKeyPressed(e) && e.shiftKey && manager.selectionMode === 'multiple') {
-            manager.extendSelection(lastKey);
-          }
-        }
-
-        break;
-
-      case 'PageDown':
-        if (delegate.getKeyPageBelow) {
-          e.preventDefault();
-
-          var _nextKey4 = delegate.getKeyPageBelow(manager.focusedKey);
-
-          if (_nextKey4) {
-            manager.setFocusedKey(_nextKey4);
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(_nextKey4);
-            }
-          }
-        }
-
-        break;
-
-      case 'PageUp':
-        if (delegate.getKeyPageAbove) {
-          e.preventDefault();
-
-          var _nextKey5 = delegate.getKeyPageAbove(manager.focusedKey);
-
-          if (_nextKey5) {
-            manager.setFocusedKey(_nextKey5);
-
-            if (e.shiftKey && manager.selectionMode === 'multiple') {
-              manager.extendSelection(_nextKey5);
-            }
-          }
-        }
-
-        break;
-
-      case 'a':
-        if ($f6850b13dba63fef3157aa366dff950$var$isCtrlKeyPressed(e) && manager.selectionMode === 'multiple' && disallowSelectAll !== true) {
-          e.preventDefault();
-          manager.selectAll();
-        }
-
-        break;
-
-      case 'Escape':
-        e.preventDefault();
-
-        if (!disallowEmptySelection) {
-          manager.clearSelection();
-        }
-
-        break;
-    }
-  };
-
-  var onFocus = function onFocus(e) {
-    manager.setFocused(true);
-
-    if (manager.focusedKey == null && e.target === e.currentTarget) {
-      // If the user hasn't yet interacted with the collection, there will be no focusedKey set.
-      // Attempt to detect whether the user is tabbing forward or backward into the collection
-      // and either focus the first or last item accordingly.
-      var relatedTarget = e.relatedTarget;
-
-      if (relatedTarget && e.currentTarget.compareDocumentPosition(relatedTarget) & Node.DOCUMENT_POSITION_FOLLOWING) {
-        manager.setFocusedKey(delegate.getLastKey());
-      } else {
-        manager.setFocusedKey(delegate.getFirstKey());
-      }
-    }
-  };
-
-  var onBlur = function onBlur() {
-    manager.setFocused(false);
-  };
-
-  useEffect(function () {
-    if (autoFocus) {
-      manager.setFocused(true); // By default, select first item for focus target
-
-      var focusedKey = delegate.getFirstKey();
-      var selectedKeys = manager.selectedKeys; // Set the last item as the new focus target if autoFocus is 'last' (i.e. ArrowUp opening the menu)
-
-      if (autoFocus === 'last') {
-        focusedKey = delegate.getLastKey();
-      } // If there are any selected keys, make the first one the new focus target
-
-
-      if (selectedKeys.size) {
-        focusedKey = selectedKeys.values().next().value;
-      }
-
-      manager.setFocusedKey(focusedKey);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
-  }, []);
-
-  var _useTypeSelect = useTypeSelect({
-    keyboardDelegate: delegate,
-    selectionManager: manager
-  }),
-      typeSelectProps = _useTypeSelect.typeSelectProps;
-
-  return {
-    collectionProps: mergeProps(typeSelectProps, {
-      onKeyDown: onKeyDown,
-      onFocus: onFocus,
-      onBlur: onBlur
-    })
-  };
-}
-
-exports.useSelectableCollection = useSelectableCollection;
-
-function useSelectableItem(options) {
-  var manager = options.selectionManager,
-      itemKey = options.itemKey,
-      itemRef = options.itemRef,
-      shouldSelectOnPressUp = options.shouldSelectOnPressUp,
-      isVirtualized = options.isVirtualized;
-
-  var onSelect = function onSelect(e) {
-    if (manager.selectionMode === 'none') {
-      return;
-    }
-
-    if (manager.selectionMode === 'single') {
-      if (manager.selectedKeys.has(itemKey)) {
-        manager.toggleSelection(itemKey);
-      } else {
-        manager.replaceSelection(itemKey);
-      }
-    } else if (e.shiftKey) {
-      manager.extendSelection(itemKey);
-    } else if (manager) {
-      manager.toggleSelection(itemKey);
-    }
-  }; // Focus the associated DOM node when this item becomes the focusedKey
-
-
-  var isFocused = itemKey === manager.focusedKey;
-  useEffect(function () {
-    if (isFocused && manager.isFocused && document.activeElement !== itemRef.current) {
-      focusWithoutScrolling(itemRef.current);
-    }
-  }, [itemRef, isFocused, manager.focusedKey, manager.isFocused]);
-  var itemProps = {
-    tabIndex: isFocused ? 0 : -1,
-    onFocus: function onFocus() {
-      manager.setFocusedKey(itemKey);
-    }
-  }; // By default, selection occurs on pointer down. This can be strange if selecting an 
-  // item causes the UI to disappear immediately (e.g. menuts).
-  // If shouldSelectOnPressUp is true, we use onPressUp instead of onPressStart.
-  // onPress requires a pointer down event on the same element as pointer up. For menus,
-  // we want to be able to have the pointer down on the trigger that opens the menu and
-  // the pointer up on the menu item rather than requiring a separate press.
-  // For keyboard events, selection still occurrs on key down.
-
-  if (shouldSelectOnPressUp) {
-    itemProps.onPressStart = function (e) {
-      if (e.pointerType === 'keyboard') {
-        onSelect(e);
-      }
-    };
-
-    itemProps.onPressUp = function (e) {
-      if (e.pointerType !== 'keyboard') {
-        onSelect(e);
-      }
-    };
-  } else {
-    itemProps.onPressStart = onSelect;
-  }
-
-  if (!isVirtualized) {
-    itemProps['data-key'] = itemKey;
-  }
-
-  return {
-    itemProps: itemProps
-  };
-}
-
-exports.useSelectableItem = useSelectableItem;
-
+$parcel$export(module.exports, "useSelectableCollection", () => $b6837c2f80a3c32f$exports.useSelectableCollection);
+$parcel$export(module.exports, "useSelectableItem", () => $433b1145b0781e10$exports.useSelectableItem);
+$parcel$export(module.exports, "useSelectableList", () => $bd230acee196f50c$exports.useSelectableList);
+$parcel$export(module.exports, "ListKeyboardDelegate", () => $836f880b12dcae5c$exports.ListKeyboardDelegate);
+$parcel$export(module.exports, "DOMLayoutDelegate", () => $2ac4508142683dcb$exports.DOMLayoutDelegate);
+$parcel$export(module.exports, "useTypeSelect", () => $a1189052f36475e8$exports.useTypeSelect);
 /*
  * Copyright 2020 Adobe. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -404,226 +26,12 @@ exports.useSelectableItem = useSelectableItem;
  * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
- */
-var ListKeyboardDelegate = /*#__PURE__*/function () {
-  function ListKeyboardDelegate(collection, ref, collator) {
-    _babelRuntimeHelpersClassCallCheck(this, ListKeyboardDelegate);
-
-    _babelRuntimeHelpersDefineProperty(this, "collection", void 0);
-
-    _babelRuntimeHelpersDefineProperty(this, "ref", void 0);
-
-    _babelRuntimeHelpersDefineProperty(this, "collator", void 0);
-
-    this.collection = collection;
-    this.ref = ref;
-    this.collator = collator;
-  }
-
-  _babelRuntimeHelpersCreateClass(ListKeyboardDelegate, [{
-    key: "getKeyBelow",
-    value: function getKeyBelow(key) {
-      key = this.collection.getKeyAfter(key);
-
-      while (key) {
-        var item = this.collection.getItem(key);
-
-        if (item.type === 'item' && !item.isDisabled) {
-          return key;
-        }
-
-        key = this.collection.getKeyAfter(key);
-      }
-    }
-  }, {
-    key: "getKeyAbove",
-    value: function getKeyAbove(key) {
-      key = this.collection.getKeyBefore(key);
-
-      while (key) {
-        var item = this.collection.getItem(key);
-
-        if (item.type === 'item' && !item.isDisabled) {
-          return key;
-        }
-
-        key = this.collection.getKeyBefore(key);
-      }
-    }
-  }, {
-    key: "getFirstKey",
-    value: function getFirstKey() {
-      var key = this.collection.getFirstKey();
-
-      while (key) {
-        var item = this.collection.getItem(key);
-
-        if (item.type === 'item' && !item.isDisabled) {
-          return key;
-        }
-
-        key = this.collection.getKeyAfter(key);
-      }
-    }
-  }, {
-    key: "getLastKey",
-    value: function getLastKey() {
-      var key = this.collection.getLastKey();
-
-      while (key) {
-        var item = this.collection.getItem(key);
-
-        if (item.type === 'item' && !item.isDisabled) {
-          return key;
-        }
-
-        key = this.collection.getKeyBefore(key);
-      }
-    }
-  }, {
-    key: "getItem",
-    value: function getItem(key) {
-      return this.ref.current.querySelector("[data-key=\"".concat(key, "\"]"));
-    }
-  }, {
-    key: "getKeyPageAbove",
-    value: function getKeyPageAbove(key) {
-      var menu = this.ref.current;
-      var item = this.getItem(key);
-
-      if (!item) {
-        return null;
-      }
-
-      var pageY = Math.max(0, item.offsetTop + item.offsetHeight - menu.offsetHeight);
-
-      while (item && item.offsetTop > pageY) {
-        key = this.getKeyAbove(key);
-        item = this.getItem(key);
-      }
-
-      return key;
-    }
-  }, {
-    key: "getKeyPageBelow",
-    value: function getKeyPageBelow(key) {
-      var menu = this.ref.current;
-      var item = this.getItem(key);
-
-      if (!item) {
-        return null;
-      }
-
-      var pageY = Math.min(menu.scrollHeight, item.offsetTop - item.offsetHeight + menu.offsetHeight);
-
-      while (item && item.offsetTop < pageY) {
-        key = this.getKeyBelow(key);
-        item = this.getItem(key);
-      }
-
-      return key;
-    }
-  }, {
-    key: "getKeyForSearch",
-    value: function getKeyForSearch(search, fromKey) {
-      if (!this.collator) {
-        return null;
-      }
-
-      var collection = this.collection;
-      var key = fromKey ? this.getKeyBelow(fromKey) : this.getFirstKey();
-
-      while (key) {
-        var item = collection.getItem(key);
-        var substring = item.textValue.slice(0, search.length);
-
-        if (item.textValue && this.collator.compare(substring, search) === 0) {
-          return key;
-        }
-
-        key = this.getKeyBelow(key);
-      }
-
-      return null;
-    }
-  }]);
-
-  return ListKeyboardDelegate;
-}();
-
-exports.ListKeyboardDelegate = ListKeyboardDelegate;
-
-function useSelectableList(props) {
-  var selectionManager = props.selectionManager,
-      collection = props.collection,
-      ref = props.ref,
-      keyboardDelegate = props.keyboardDelegate,
-      autoFocus = props.autoFocus,
-      shouldFocusWrap = props.shouldFocusWrap,
-      isVirtualized = props.isVirtualized,
-      disallowEmptySelection = props.disallowEmptySelection; // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
-  // When virtualized, the layout object will be passed in as a prop and override this.
-
-  var collator = useCollator({
-    usage: 'search',
-    sensitivity: 'base'
-  });
-  var delegate = useMemo(function () {
-    return keyboardDelegate || new ListKeyboardDelegate(collection, ref, collator);
-  }, [keyboardDelegate, collection, ref, collator]); // If not virtualized, scroll the focused element into view when the focusedKey changes.
-  // When virtualized, CollectionView handles this internally.
-
-  useEffect(function () {
-    if (!isVirtualized && selectionManager.focusedKey) {
-      var element = ref.current.querySelector("[data-key=\"".concat(selectionManager.focusedKey, "\"]"));
-
-      if (element) {
-        $c9da038647e33591ee80c7ba6beca8c$var$scrollIntoView(ref.current, element);
-      }
-    }
-  }, [isVirtualized, ref, selectionManager.focusedKey]);
-
-  var _useSelectableCollect = useSelectableCollection({
-    selectionManager: selectionManager,
-    keyboardDelegate: delegate,
-    autoFocus: autoFocus,
-    shouldFocusWrap: shouldFocusWrap,
-    disallowEmptySelection: disallowEmptySelection
-  }),
-      collectionProps = _useSelectableCollect.collectionProps;
+ */ 
 
-  return {
-    listProps: collectionProps
-  };
-} // Scrolls `scrollView` so that `element` is visible.
-// Similar to `element.scrollIntoView({block: 'nearest'})` (not supported in Edge),
-// but doesn't affect parents above `scrollView`.
 
 
-exports.useSelectableList = useSelectableList;
 
-function $c9da038647e33591ee80c7ba6beca8c$var$scrollIntoView(scrollView, element) {
-  var offsetX = element.offsetLeft - scrollView.offsetLeft;
-  var offsetY = element.offsetTop - scrollView.offsetTop;
-  var width = element.offsetWidth;
-  var height = element.offsetHeight;
-  var x = scrollView.scrollLeft;
-  var y = scrollView.scrollTop;
-  var maxX = x + scrollView.offsetWidth;
-  var maxY = y + scrollView.offsetHeight;
 
-  if (offsetX <= x) {
-    x = offsetX;
-  } else if (offsetX + width > maxX) {
-    x += offsetX + width - maxX;
-  }
 
-  if (offsetY <= y) {
-    y = offsetY;
-  } else if (offsetY + height > maxY) {
-    y += offsetY + height - maxY;
-  }
 
-  scrollView.scrollLeft = x;
-  scrollView.scrollTop = y;
-}
+//# sourceMappingURL=main.js.map

package/dist/main.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC","sources":["packages/@react-aria/selection/src/index.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {useSelectableCollection} from './useSelectableCollection';\nexport {useSelectableItem} from './useSelectableItem';\nexport {useSelectableList} from './useSelectableList';\nexport {ListKeyboardDelegate} from './ListKeyboardDelegate';\nexport {DOMLayoutDelegate} from './DOMLayoutDelegate';\nexport {useTypeSelect} from './useTypeSelect';\n\nexport type {AriaSelectableCollectionOptions, SelectableCollectionAria} from './useSelectableCollection';\nexport type {AriaSelectableListOptions, SelectableListAria} from './useSelectableList';\nexport type {SelectableItemOptions, SelectableItemStates, SelectableItemAria} from './useSelectableItem';\nexport type {AriaTypeSelectOptions, TypeSelectAria} from './useTypeSelect';\n"],"names":[],"version":3,"file":"main.js.map"}