@react-aria/select 3.0.0-alpha.1 → 3.0.0-nightly-641446f65-240905

package/dist/types.d.ts

@@ -1,18 +1,78 @@
-import { HTMLAttributes, RefObject } from "react";
-import { KeyboardDelegate } from "@react-types/shared";
-import { PressProps } from "@react-aria/interactions";
+import { AriaButtonProps } from "@react-types/button";
+import { AriaListBoxOptions } from "@react-aria/listbox";
+import { AriaSelectProps } from "@react-types/select";
+import { DOMAttributes, FocusableElement, KeyboardDelegate, RefObject, ValidationResult } from "@react-types/shared";
 import { SelectState } from "@react-stately/select";
-interface SelectProps {
-    triggerRef: RefObject<HTMLElement>;
+import React, { ReactNode } from "react";
+export interface AriaSelectOptions<T> extends Omit<AriaSelectProps<T>, 'children'> {
+    /**
+     * An optional keyboard delegate implementation for type to select,
+     * to override the default.
+     */
+    keyboardDelegate?: KeyboardDelegate;
+}
+export interface SelectAria<T> extends ValidationResult {
+    /** Props for the label element. */
+    labelProps: DOMAttributes;
+    /** Props for the popup trigger element. */
+    triggerProps: AriaButtonProps;
+    /** Props for the element representing the selected value. */
+    valueProps: DOMAttributes;
+    /** Props for the popup. */
+    menuProps: AriaListBoxOptions<T>;
+    /** Props for the select's description element, if any. */
+    descriptionProps: DOMAttributes;
+    /** Props for the select's error message element, if any. */
+    errorMessageProps: DOMAttributes;
+}
+/**
+ * Provides the behavior and accessibility implementation for a select component.
+ * A select displays a collapsible list of options and allows a user to select one of them.
+ * @param props - Props for the select.
+ * @param state - State for the select, as returned by `useListState`.
+ */
+export function useSelect<T>(props: AriaSelectOptions<T>, state: SelectState<T>, ref: RefObject<FocusableElement | null>): SelectAria<T>;
+export interface AriaHiddenSelectProps {
+    /**
+     * Describes the type of autocomplete functionality the input should provide if any. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete).
+     */
+    autoComplete?: string;
+    /** The text label for the select. */
+    label?: ReactNode;
+    /** HTML form input name. */
+    name?: string;
+    /** Sets the disabled state of the select and input. */
     isDisabled?: boolean;
-    keyboardDelegate: KeyboardDelegate;
 }
-interface SelectAria {
-    labelProps: HTMLAttributes<HTMLElement>;
-    triggerProps: HTMLAttributes<HTMLElement> & PressProps;
-    valueProps: HTMLAttributes<HTMLElement>;
-    menuProps: HTMLAttributes<HTMLElement>;
+export interface HiddenSelectProps<T> extends AriaHiddenSelectProps {
+    /** State for the select. */
+    state: SelectState<T>;
+    /** A ref to the trigger element. */
+    triggerRef: RefObject<FocusableElement | null>;
+}
+interface AriaHiddenSelectOptions extends AriaHiddenSelectProps {
+    /** A ref to the hidden `<select>` element. */
+    selectRef?: RefObject<HTMLSelectElement | null>;
+}
+interface HiddenSelectAria {
+    /** Props for the container element. */
+    containerProps: React.HTMLAttributes<FocusableElement>;
+    /** Props for the hidden input element. */
+    inputProps: React.InputHTMLAttributes<HTMLInputElement>;
+    /** Props for the hidden select element. */
+    selectProps: React.SelectHTMLAttributes<HTMLSelectElement>;
 }
-export function useSelect<T>(props: SelectProps, state: SelectState<T>): SelectAria;
+/**
+ * Provides the behavior and accessibility implementation for a hidden `<select>` element, which
+ * can be used in combination with `useSelect` to support browser form autofill, mobile form
+ * navigation, and native HTML form submission.
+ */
+export function useHiddenSelect<T>(props: AriaHiddenSelectOptions, state: SelectState<T>, triggerRef: RefObject<FocusableElement | null>): HiddenSelectAria;
+/**
+ * Renders a hidden native `<select>` element, which can be used to support browser
+ * form autofill, mobile form navigation, and native form submission.
+ */
+export function HiddenSelect<T>(props: HiddenSelectProps<T>): React.JSX.Element;
+export type { AriaSelectProps } from '@react-types/select';
 
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["/Users/govett/dev/react-spectrum/packages/@react-aria/select/src/packages/@react-aria/select/src/useSelect.ts"],"names":[],"mappings":";;;;AAqBA;IACE,UAAU,EAAE,UAAU,WAAW,CAAC,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,gBAAgB,CAAA;CACnC;AAED;IACE,UAAU,EAAE,eAAe,WAAW,CAAC,CAAC;IACxC,YAAY,EAAE,eAAe,WAAW,CAAC,GAAG,UAAU,CAAC;IACvD,UAAU,EAAE,eAAe,WAAW,CAAC,CAAC;IACxC,SAAS,EAAE,eAAe,WAAW,CAAC,CAAA;CACvC;AAED,0BAA0B,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,GAAG,UAAU,CAmDlF","file":"types.d.ts.map"}
+{"mappings":";;;;;;AAyBA,mCAAmC,CAAC,CAAE,SAAQ,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,UAAU,CAAC;IAChF;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;CACpC;AAED,4BAA4B,CAAC,CAAE,SAAQ,gBAAgB;IACrD,mCAAmC;IACnC,UAAU,EAAE,aAAa,CAAC;IAE1B,2CAA2C;IAC3C,YAAY,EAAE,eAAe,CAAC;IAE9B,6DAA6D;IAC7D,UAAU,EAAE,aAAa,CAAC;IAE1B,2BAA2B;IAC3B,SAAS,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAEjC,0DAA0D;IAC1D,gBAAgB,EAAE,aAAa,CAAC;IAEhC,4DAA4D;IAC5D,iBAAiB,EAAE,aAAa,CAAA;CACjC;AAWD;;;;;GAKG;AACH,0BAA0B,CAAC,EAAE,KAAK,EAAE,kBAAkB,CAAC,CAAC,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,EAAE,GAAG,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,GAAG,WAAW,CAAC,CAAC,CAwKvI;ACvND;IACE;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,qCAAqC;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,uDAAuD;IACvD,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,mCAAmC,CAAC,CAAE,SAAQ,qBAAqB;IACjE,4BAA4B;IAC5B,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAEtB,oCAAoC;IACpC,UAAU,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,CAAA;CAC/C;AAED,iCAAyC,SAAQ,qBAAqB;IACpE,8CAA8C;IAC9C,SAAS,CAAC,EAAE,UAAU,iBAAiB,GAAG,IAAI,CAAC,CAAA;CAChD;AAED;IACE,uCAAuC;IACvC,cAAc,EAAE,MAAM,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAEvD,0CAA0C;IAC1C,UAAU,EAAE,MAAM,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IAExD,2CAA2C;IAC3C,WAAW,EAAE,MAAM,oBAAoB,CAAC,iBAAiB,CAAC,CAAA;CAC3D;AAED;;;;GAIG;AACH,gCAAgC,CAAC,EAAE,KAAK,EAAE,uBAAuB,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,EAAE,UAAU,EAAE,UAAU,gBAAgB,GAAG,IAAI,CAAC,GAAG,gBAAgB,CAyD1J;AAED;;;GAGG;AACH,6BAA6B,CAAC,EAAE,KAAK,EAAE,kBAAkB,CAAC,CAAC,qBA4C1D;AC9JD,YAAY,EAAC,eAAe,EAAC,MAAM,qBAAqB,CAAC","sources":["packages/@react-aria/select/src/packages/@react-aria/select/src/useSelect.ts","packages/@react-aria/select/src/packages/@react-aria/select/src/HiddenSelect.tsx","packages/@react-aria/select/src/packages/@react-aria/select/src/index.ts","packages/@react-aria/select/src/index.ts"],"sourcesContent":[null,null,null,"/*\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 */\nexport {useSelect} from './useSelect';\nexport {useHiddenSelect, HiddenSelect} from './HiddenSelect';\nexport type {AriaSelectOptions, SelectAria} from './useSelect';\nexport type {AriaHiddenSelectProps, HiddenSelectProps} from './HiddenSelect';\nexport type {AriaSelectProps} from '@react-types/select';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/dist/useSelect.main.js

@@ -0,0 +1,163 @@
+var $63cuq$reactariautils = require("@react-aria/utils");
+var $63cuq$react = require("react");
+var $63cuq$reactariaselection = require("@react-aria/selection");
+var $63cuq$reactariainteractions = require("@react-aria/interactions");
+var $63cuq$reactariai18n = require("@react-aria/i18n");
+var $63cuq$reactarialabel = require("@react-aria/label");
+var $63cuq$reactariamenu = require("@react-aria/menu");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "selectData", () => $23a1e93dc7fa8653$export$703601b7e90536f8);
+$parcel$export(module.exports, "useSelect", () => $23a1e93dc7fa8653$export$e64b2f635402ca43);
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * 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.
+ */ 
+
+
+
+
+
+
+const $23a1e93dc7fa8653$export$703601b7e90536f8 = new WeakMap();
+function $23a1e93dc7fa8653$export$e64b2f635402ca43(props, state, ref) {
+    let { keyboardDelegate: keyboardDelegate, isDisabled: isDisabled, isRequired: isRequired, name: name, validationBehavior: validationBehavior = 'aria' } = props;
+    // 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.
+    let collator = (0, $63cuq$reactariai18n.useCollator)({
+        usage: 'search',
+        sensitivity: 'base'
+    });
+    let delegate = (0, $63cuq$react.useMemo)(()=>keyboardDelegate || new (0, $63cuq$reactariaselection.ListKeyboardDelegate)(state.collection, state.disabledKeys, null, collator), [
+        keyboardDelegate,
+        state.collection,
+        state.disabledKeys,
+        collator
+    ]);
+    let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $63cuq$reactariamenu.useMenuTrigger)({
+        isDisabled: isDisabled,
+        type: 'listbox'
+    }, state, ref);
+    let onKeyDown = (e)=>{
+        switch(e.key){
+            case 'ArrowLeft':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+            case 'ArrowRight':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+        }
+    };
+    let { typeSelectProps: typeSelectProps } = (0, $63cuq$reactariaselection.useTypeSelect)({
+        keyboardDelegate: delegate,
+        selectionManager: state.selectionManager,
+        onTypeSelect (key) {
+            state.setSelectedKey(key);
+        }
+    });
+    let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
+    let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $63cuq$reactarialabel.useField)({
+        ...props,
+        labelElementType: 'span',
+        isInvalid: isInvalid,
+        errorMessage: props.errorMessage || validationErrors
+    });
+    typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
+    delete typeSelectProps.onKeyDownCapture;
+    let domProps = (0, $63cuq$reactariautils.filterDOMProps)(props, {
+        labelable: true
+    });
+    let triggerProps = (0, $63cuq$reactariautils.mergeProps)(typeSelectProps, menuTriggerProps, fieldProps);
+    let valueId = (0, $63cuq$reactariautils.useId)();
+    $23a1e93dc7fa8653$export$703601b7e90536f8.set(state, {
+        isDisabled: isDisabled,
+        isRequired: isRequired,
+        name: name,
+        validationBehavior: validationBehavior
+    });
+    return {
+        labelProps: {
+            ...labelProps,
+            onClick: ()=>{
+                if (!props.isDisabled) {
+                    ref.current.focus();
+                    // Show the focus ring so the user knows where focus went
+                    (0, $63cuq$reactariainteractions.setInteractionModality)('keyboard');
+                }
+            }
+        },
+        triggerProps: (0, $63cuq$reactariautils.mergeProps)(domProps, {
+            ...triggerProps,
+            isDisabled: isDisabled,
+            onKeyDown: (0, $63cuq$reactariautils.chain)(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),
+            onKeyUp: props.onKeyUp,
+            'aria-labelledby': [
+                valueId,
+                triggerProps['aria-labelledby'],
+                triggerProps['aria-label'] && !triggerProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' '),
+            onFocus (e) {
+                if (state.isFocused) return;
+                if (props.onFocus) props.onFocus(e);
+                if (props.onFocusChange) props.onFocusChange(true);
+                state.setFocused(true);
+            },
+            onBlur (e) {
+                if (state.isOpen) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            }
+        }),
+        valueProps: {
+            id: valueId
+        },
+        menuProps: {
+            ...menuProps,
+            autoFocus: state.focusStrategy || true,
+            shouldSelectOnPressUp: true,
+            shouldFocusOnHover: true,
+            disallowEmptySelection: true,
+            linkBehavior: 'selection',
+            onBlur: (e)=>{
+                if (e.currentTarget.contains(e.relatedTarget)) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            },
+            'aria-labelledby': [
+                fieldProps['aria-labelledby'],
+                triggerProps['aria-label'] && !fieldProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' ')
+        },
+        descriptionProps: descriptionProps,
+        errorMessageProps: errorMessageProps,
+        isInvalid: isInvalid,
+        validationErrors: validationErrors,
+        validationDetails: validationDetails
+    };
+}
+
+
+//# sourceMappingURL=useSelect.main.js.map

package/dist/useSelect.main.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-aria/select/src/useSelect.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\nimport {AriaButtonProps} from '@react-types/button';\nimport {AriaListBoxOptions} from '@react-aria/listbox';\nimport {AriaSelectProps} from '@react-types/select';\nimport {chain, filterDOMProps, mergeProps, useId} from '@react-aria/utils';\nimport {DOMAttributes, FocusableElement, KeyboardDelegate, RefObject, ValidationResult} from '@react-types/shared';\nimport {FocusEvent, useMemo} from 'react';\nimport {ListKeyboardDelegate, useTypeSelect} from '@react-aria/selection';\nimport {SelectState} from '@react-stately/select';\nimport {setInteractionModality} from '@react-aria/interactions';\nimport {useCollator} from '@react-aria/i18n';\nimport {useField} from '@react-aria/label';\nimport {useMenuTrigger} from '@react-aria/menu';\n\nexport interface AriaSelectOptions<T> extends Omit<AriaSelectProps<T>, 'children'> {\n  /**\n   * An optional keyboard delegate implementation for type to select,\n   * to override the default.\n   */\n  keyboardDelegate?: KeyboardDelegate\n}\n\nexport interface SelectAria<T> extends ValidationResult {\n  /** Props for the label element. */\n  labelProps: DOMAttributes,\n\n  /** Props for the popup trigger element. */\n  triggerProps: AriaButtonProps,\n\n  /** Props for the element representing the selected value. */\n  valueProps: DOMAttributes,\n\n  /** Props for the popup. */\n  menuProps: AriaListBoxOptions<T>,\n\n  /** Props for the select's description element, if any. */\n  descriptionProps: DOMAttributes,\n\n  /** Props for the select's error message element, if any. */\n  errorMessageProps: DOMAttributes\n}\n\ninterface SelectData {\n  isDisabled?: boolean,\n  isRequired?: boolean,\n  name?: string,\n  validationBehavior?: 'aria' | 'native'\n}\n\nexport const selectData = new WeakMap<SelectState<any>, SelectData>();\n\n/**\n * Provides the behavior and accessibility implementation for a select component.\n * A select displays a collapsible list of options and allows a user to select one of them.\n * @param props - Props for the select.\n * @param state - State for the select, as returned by `useListState`.\n */\nexport function useSelect<T>(props: AriaSelectOptions<T>, state: SelectState<T>, ref: RefObject<FocusableElement | null>): SelectAria<T> {\n  let {\n    keyboardDelegate,\n    isDisabled,\n    isRequired,\n    name,\n    validationBehavior = 'aria'\n  } = props;\n\n  // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).\n  // When virtualized, the layout object will be passed in as a prop and override this.\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let delegate = useMemo(() => keyboardDelegate || new ListKeyboardDelegate(state.collection, state.disabledKeys, null, collator), [keyboardDelegate, state.collection, state.disabledKeys, collator]);\n\n  let {menuTriggerProps, menuProps} = useMenuTrigger<T>(\n    {\n      isDisabled,\n      type: 'listbox'\n    },\n    state,\n    ref\n  );\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    switch (e.key) {\n      case 'ArrowLeft': {\n        // prevent scrolling containers\n        e.preventDefault();\n\n        let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();\n        if (key) {\n          state.setSelectedKey(key);\n        }\n        break;\n      }\n      case 'ArrowRight': {\n        // prevent scrolling containers\n        e.preventDefault();\n\n        let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();\n        if (key) {\n          state.setSelectedKey(key);\n        }\n        break;\n      }\n    }\n  };\n\n  let {typeSelectProps} = useTypeSelect({\n    keyboardDelegate: delegate,\n    selectionManager: state.selectionManager,\n    onTypeSelect(key) {\n      state.setSelectedKey(key);\n    }\n  });\n\n  let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n  let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n    ...props,\n    labelElementType: 'span',\n    isInvalid,\n    errorMessage: props.errorMessage || validationErrors\n  });\n\n  typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;\n  delete typeSelectProps.onKeyDownCapture;\n\n  let domProps = filterDOMProps(props, {labelable: true});\n  let triggerProps = mergeProps(typeSelectProps, menuTriggerProps, fieldProps);\n\n  let valueId = useId();\n\n  selectData.set(state, {\n    isDisabled,\n    isRequired,\n    name,\n    validationBehavior\n  });\n\n  return {\n    labelProps: {\n      ...labelProps,\n      onClick: () => {\n        if (!props.isDisabled) {\n          ref.current.focus();\n\n          // Show the focus ring so the user knows where focus went\n          setInteractionModality('keyboard');\n        }\n      }\n    },\n    triggerProps: mergeProps(domProps, {\n      ...triggerProps,\n      isDisabled,\n      onKeyDown: chain(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),\n      onKeyUp: props.onKeyUp,\n      'aria-labelledby': [\n        valueId,\n        triggerProps['aria-labelledby'],\n        triggerProps['aria-label'] && !triggerProps['aria-labelledby'] ? triggerProps.id : null\n      ].filter(Boolean).join(' '),\n      onFocus(e: FocusEvent) {\n        if (state.isFocused) {\n          return;\n        }\n\n        if (props.onFocus) {\n          props.onFocus(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(true);\n        }\n\n        state.setFocused(true);\n      },\n      onBlur(e: FocusEvent) {\n        if (state.isOpen) {\n          return;\n        }\n\n        if (props.onBlur) {\n          props.onBlur(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(false);\n        }\n\n        state.setFocused(false);\n      }\n    }),\n    valueProps: {\n      id: valueId\n    },\n    menuProps: {\n      ...menuProps,\n      autoFocus: state.focusStrategy || true,\n      shouldSelectOnPressUp: true,\n      shouldFocusOnHover: true,\n      disallowEmptySelection: true,\n      linkBehavior: 'selection',\n      onBlur: (e) => {\n        if (e.currentTarget.contains(e.relatedTarget as Node)) {\n          return;\n        }\n\n        if (props.onBlur) {\n          props.onBlur(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(false);\n        }\n\n        state.setFocused(false);\n      },\n      'aria-labelledby': [\n        fieldProps['aria-labelledby'],\n        triggerProps['aria-label'] && !fieldProps['aria-labelledby'] ? triggerProps.id : null\n      ].filter(Boolean).join(' ')\n    },\n    descriptionProps,\n    errorMessageProps,\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useSelect.main.js.map"}

package/dist/useSelect.mjs

@@ -0,0 +1,157 @@
+import {filterDOMProps as $aUnai$filterDOMProps, mergeProps as $aUnai$mergeProps, useId as $aUnai$useId, chain as $aUnai$chain} from "@react-aria/utils";
+import {useMemo as $aUnai$useMemo} from "react";
+import {ListKeyboardDelegate as $aUnai$ListKeyboardDelegate, useTypeSelect as $aUnai$useTypeSelect} from "@react-aria/selection";
+import {setInteractionModality as $aUnai$setInteractionModality} from "@react-aria/interactions";
+import {useCollator as $aUnai$useCollator} from "@react-aria/i18n";
+import {useField as $aUnai$useField} from "@react-aria/label";
+import {useMenuTrigger as $aUnai$useMenuTrigger} from "@react-aria/menu";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * 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.
+ */ 
+
+
+
+
+
+
+const $58aed456727eb0f3$export$703601b7e90536f8 = new WeakMap();
+function $58aed456727eb0f3$export$e64b2f635402ca43(props, state, ref) {
+    let { keyboardDelegate: keyboardDelegate, isDisabled: isDisabled, isRequired: isRequired, name: name, validationBehavior: validationBehavior = 'aria' } = props;
+    // 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.
+    let collator = (0, $aUnai$useCollator)({
+        usage: 'search',
+        sensitivity: 'base'
+    });
+    let delegate = (0, $aUnai$useMemo)(()=>keyboardDelegate || new (0, $aUnai$ListKeyboardDelegate)(state.collection, state.disabledKeys, null, collator), [
+        keyboardDelegate,
+        state.collection,
+        state.disabledKeys,
+        collator
+    ]);
+    let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $aUnai$useMenuTrigger)({
+        isDisabled: isDisabled,
+        type: 'listbox'
+    }, state, ref);
+    let onKeyDown = (e)=>{
+        switch(e.key){
+            case 'ArrowLeft':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+            case 'ArrowRight':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+        }
+    };
+    let { typeSelectProps: typeSelectProps } = (0, $aUnai$useTypeSelect)({
+        keyboardDelegate: delegate,
+        selectionManager: state.selectionManager,
+        onTypeSelect (key) {
+            state.setSelectedKey(key);
+        }
+    });
+    let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
+    let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $aUnai$useField)({
+        ...props,
+        labelElementType: 'span',
+        isInvalid: isInvalid,
+        errorMessage: props.errorMessage || validationErrors
+    });
+    typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
+    delete typeSelectProps.onKeyDownCapture;
+    let domProps = (0, $aUnai$filterDOMProps)(props, {
+        labelable: true
+    });
+    let triggerProps = (0, $aUnai$mergeProps)(typeSelectProps, menuTriggerProps, fieldProps);
+    let valueId = (0, $aUnai$useId)();
+    $58aed456727eb0f3$export$703601b7e90536f8.set(state, {
+        isDisabled: isDisabled,
+        isRequired: isRequired,
+        name: name,
+        validationBehavior: validationBehavior
+    });
+    return {
+        labelProps: {
+            ...labelProps,
+            onClick: ()=>{
+                if (!props.isDisabled) {
+                    ref.current.focus();
+                    // Show the focus ring so the user knows where focus went
+                    (0, $aUnai$setInteractionModality)('keyboard');
+                }
+            }
+        },
+        triggerProps: (0, $aUnai$mergeProps)(domProps, {
+            ...triggerProps,
+            isDisabled: isDisabled,
+            onKeyDown: (0, $aUnai$chain)(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),
+            onKeyUp: props.onKeyUp,
+            'aria-labelledby': [
+                valueId,
+                triggerProps['aria-labelledby'],
+                triggerProps['aria-label'] && !triggerProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' '),
+            onFocus (e) {
+                if (state.isFocused) return;
+                if (props.onFocus) props.onFocus(e);
+                if (props.onFocusChange) props.onFocusChange(true);
+                state.setFocused(true);
+            },
+            onBlur (e) {
+                if (state.isOpen) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            }
+        }),
+        valueProps: {
+            id: valueId
+        },
+        menuProps: {
+            ...menuProps,
+            autoFocus: state.focusStrategy || true,
+            shouldSelectOnPressUp: true,
+            shouldFocusOnHover: true,
+            disallowEmptySelection: true,
+            linkBehavior: 'selection',
+            onBlur: (e)=>{
+                if (e.currentTarget.contains(e.relatedTarget)) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            },
+            'aria-labelledby': [
+                fieldProps['aria-labelledby'],
+                triggerProps['aria-label'] && !fieldProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' ')
+        },
+        descriptionProps: descriptionProps,
+        errorMessageProps: errorMessageProps,
+        isInvalid: isInvalid,
+        validationErrors: validationErrors,
+        validationDetails: validationDetails
+    };
+}
+
+
+export {$58aed456727eb0f3$export$703601b7e90536f8 as selectData, $58aed456727eb0f3$export$e64b2f635402ca43 as useSelect};
+//# sourceMappingURL=useSelect.module.js.map

package/dist/useSelect.module.js

@@ -0,0 +1,157 @@
+import {filterDOMProps as $aUnai$filterDOMProps, mergeProps as $aUnai$mergeProps, useId as $aUnai$useId, chain as $aUnai$chain} from "@react-aria/utils";
+import {useMemo as $aUnai$useMemo} from "react";
+import {ListKeyboardDelegate as $aUnai$ListKeyboardDelegate, useTypeSelect as $aUnai$useTypeSelect} from "@react-aria/selection";
+import {setInteractionModality as $aUnai$setInteractionModality} from "@react-aria/interactions";
+import {useCollator as $aUnai$useCollator} from "@react-aria/i18n";
+import {useField as $aUnai$useField} from "@react-aria/label";
+import {useMenuTrigger as $aUnai$useMenuTrigger} from "@react-aria/menu";
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * 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.
+ */ 
+
+
+
+
+
+
+const $58aed456727eb0f3$export$703601b7e90536f8 = new WeakMap();
+function $58aed456727eb0f3$export$e64b2f635402ca43(props, state, ref) {
+    let { keyboardDelegate: keyboardDelegate, isDisabled: isDisabled, isRequired: isRequired, name: name, validationBehavior: validationBehavior = 'aria' } = props;
+    // 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.
+    let collator = (0, $aUnai$useCollator)({
+        usage: 'search',
+        sensitivity: 'base'
+    });
+    let delegate = (0, $aUnai$useMemo)(()=>keyboardDelegate || new (0, $aUnai$ListKeyboardDelegate)(state.collection, state.disabledKeys, null, collator), [
+        keyboardDelegate,
+        state.collection,
+        state.disabledKeys,
+        collator
+    ]);
+    let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = (0, $aUnai$useMenuTrigger)({
+        isDisabled: isDisabled,
+        type: 'listbox'
+    }, state, ref);
+    let onKeyDown = (e)=>{
+        switch(e.key){
+            case 'ArrowLeft':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+            case 'ArrowRight':
+                {
+                    // prevent scrolling containers
+                    e.preventDefault();
+                    let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
+                    if (key) state.setSelectedKey(key);
+                    break;
+                }
+        }
+    };
+    let { typeSelectProps: typeSelectProps } = (0, $aUnai$useTypeSelect)({
+        keyboardDelegate: delegate,
+        selectionManager: state.selectionManager,
+        onTypeSelect (key) {
+            state.setSelectedKey(key);
+        }
+    });
+    let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
+    let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = (0, $aUnai$useField)({
+        ...props,
+        labelElementType: 'span',
+        isInvalid: isInvalid,
+        errorMessage: props.errorMessage || validationErrors
+    });
+    typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
+    delete typeSelectProps.onKeyDownCapture;
+    let domProps = (0, $aUnai$filterDOMProps)(props, {
+        labelable: true
+    });
+    let triggerProps = (0, $aUnai$mergeProps)(typeSelectProps, menuTriggerProps, fieldProps);
+    let valueId = (0, $aUnai$useId)();
+    $58aed456727eb0f3$export$703601b7e90536f8.set(state, {
+        isDisabled: isDisabled,
+        isRequired: isRequired,
+        name: name,
+        validationBehavior: validationBehavior
+    });
+    return {
+        labelProps: {
+            ...labelProps,
+            onClick: ()=>{
+                if (!props.isDisabled) {
+                    ref.current.focus();
+                    // Show the focus ring so the user knows where focus went
+                    (0, $aUnai$setInteractionModality)('keyboard');
+                }
+            }
+        },
+        triggerProps: (0, $aUnai$mergeProps)(domProps, {
+            ...triggerProps,
+            isDisabled: isDisabled,
+            onKeyDown: (0, $aUnai$chain)(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),
+            onKeyUp: props.onKeyUp,
+            'aria-labelledby': [
+                valueId,
+                triggerProps['aria-labelledby'],
+                triggerProps['aria-label'] && !triggerProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' '),
+            onFocus (e) {
+                if (state.isFocused) return;
+                if (props.onFocus) props.onFocus(e);
+                if (props.onFocusChange) props.onFocusChange(true);
+                state.setFocused(true);
+            },
+            onBlur (e) {
+                if (state.isOpen) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            }
+        }),
+        valueProps: {
+            id: valueId
+        },
+        menuProps: {
+            ...menuProps,
+            autoFocus: state.focusStrategy || true,
+            shouldSelectOnPressUp: true,
+            shouldFocusOnHover: true,
+            disallowEmptySelection: true,
+            linkBehavior: 'selection',
+            onBlur: (e)=>{
+                if (e.currentTarget.contains(e.relatedTarget)) return;
+                if (props.onBlur) props.onBlur(e);
+                if (props.onFocusChange) props.onFocusChange(false);
+                state.setFocused(false);
+            },
+            'aria-labelledby': [
+                fieldProps['aria-labelledby'],
+                triggerProps['aria-label'] && !fieldProps['aria-labelledby'] ? triggerProps.id : null
+            ].filter(Boolean).join(' ')
+        },
+        descriptionProps: descriptionProps,
+        errorMessageProps: errorMessageProps,
+        isInvalid: isInvalid,
+        validationErrors: validationErrors,
+        validationDetails: validationDetails
+    };
+}
+
+
+export {$58aed456727eb0f3$export$703601b7e90536f8 as selectData, $58aed456727eb0f3$export$e64b2f635402ca43 as useSelect};
+//# sourceMappingURL=useSelect.module.js.map

package/dist/useSelect.module.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-aria/select/src/useSelect.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\nimport {AriaButtonProps} from '@react-types/button';\nimport {AriaListBoxOptions} from '@react-aria/listbox';\nimport {AriaSelectProps} from '@react-types/select';\nimport {chain, filterDOMProps, mergeProps, useId} from '@react-aria/utils';\nimport {DOMAttributes, FocusableElement, KeyboardDelegate, RefObject, ValidationResult} from '@react-types/shared';\nimport {FocusEvent, useMemo} from 'react';\nimport {ListKeyboardDelegate, useTypeSelect} from '@react-aria/selection';\nimport {SelectState} from '@react-stately/select';\nimport {setInteractionModality} from '@react-aria/interactions';\nimport {useCollator} from '@react-aria/i18n';\nimport {useField} from '@react-aria/label';\nimport {useMenuTrigger} from '@react-aria/menu';\n\nexport interface AriaSelectOptions<T> extends Omit<AriaSelectProps<T>, 'children'> {\n  /**\n   * An optional keyboard delegate implementation for type to select,\n   * to override the default.\n   */\n  keyboardDelegate?: KeyboardDelegate\n}\n\nexport interface SelectAria<T> extends ValidationResult {\n  /** Props for the label element. */\n  labelProps: DOMAttributes,\n\n  /** Props for the popup trigger element. */\n  triggerProps: AriaButtonProps,\n\n  /** Props for the element representing the selected value. */\n  valueProps: DOMAttributes,\n\n  /** Props for the popup. */\n  menuProps: AriaListBoxOptions<T>,\n\n  /** Props for the select's description element, if any. */\n  descriptionProps: DOMAttributes,\n\n  /** Props for the select's error message element, if any. */\n  errorMessageProps: DOMAttributes\n}\n\ninterface SelectData {\n  isDisabled?: boolean,\n  isRequired?: boolean,\n  name?: string,\n  validationBehavior?: 'aria' | 'native'\n}\n\nexport const selectData = new WeakMap<SelectState<any>, SelectData>();\n\n/**\n * Provides the behavior and accessibility implementation for a select component.\n * A select displays a collapsible list of options and allows a user to select one of them.\n * @param props - Props for the select.\n * @param state - State for the select, as returned by `useListState`.\n */\nexport function useSelect<T>(props: AriaSelectOptions<T>, state: SelectState<T>, ref: RefObject<FocusableElement | null>): SelectAria<T> {\n  let {\n    keyboardDelegate,\n    isDisabled,\n    isRequired,\n    name,\n    validationBehavior = 'aria'\n  } = props;\n\n  // By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).\n  // When virtualized, the layout object will be passed in as a prop and override this.\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let delegate = useMemo(() => keyboardDelegate || new ListKeyboardDelegate(state.collection, state.disabledKeys, null, collator), [keyboardDelegate, state.collection, state.disabledKeys, collator]);\n\n  let {menuTriggerProps, menuProps} = useMenuTrigger<T>(\n    {\n      isDisabled,\n      type: 'listbox'\n    },\n    state,\n    ref\n  );\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    switch (e.key) {\n      case 'ArrowLeft': {\n        // prevent scrolling containers\n        e.preventDefault();\n\n        let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();\n        if (key) {\n          state.setSelectedKey(key);\n        }\n        break;\n      }\n      case 'ArrowRight': {\n        // prevent scrolling containers\n        e.preventDefault();\n\n        let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();\n        if (key) {\n          state.setSelectedKey(key);\n        }\n        break;\n      }\n    }\n  };\n\n  let {typeSelectProps} = useTypeSelect({\n    keyboardDelegate: delegate,\n    selectionManager: state.selectionManager,\n    onTypeSelect(key) {\n      state.setSelectedKey(key);\n    }\n  });\n\n  let {isInvalid, validationErrors, validationDetails} = state.displayValidation;\n  let {labelProps, fieldProps, descriptionProps, errorMessageProps} = useField({\n    ...props,\n    labelElementType: 'span',\n    isInvalid,\n    errorMessage: props.errorMessage || validationErrors\n  });\n\n  typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;\n  delete typeSelectProps.onKeyDownCapture;\n\n  let domProps = filterDOMProps(props, {labelable: true});\n  let triggerProps = mergeProps(typeSelectProps, menuTriggerProps, fieldProps);\n\n  let valueId = useId();\n\n  selectData.set(state, {\n    isDisabled,\n    isRequired,\n    name,\n    validationBehavior\n  });\n\n  return {\n    labelProps: {\n      ...labelProps,\n      onClick: () => {\n        if (!props.isDisabled) {\n          ref.current.focus();\n\n          // Show the focus ring so the user knows where focus went\n          setInteractionModality('keyboard');\n        }\n      }\n    },\n    triggerProps: mergeProps(domProps, {\n      ...triggerProps,\n      isDisabled,\n      onKeyDown: chain(triggerProps.onKeyDown, onKeyDown, props.onKeyDown),\n      onKeyUp: props.onKeyUp,\n      'aria-labelledby': [\n        valueId,\n        triggerProps['aria-labelledby'],\n        triggerProps['aria-label'] && !triggerProps['aria-labelledby'] ? triggerProps.id : null\n      ].filter(Boolean).join(' '),\n      onFocus(e: FocusEvent) {\n        if (state.isFocused) {\n          return;\n        }\n\n        if (props.onFocus) {\n          props.onFocus(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(true);\n        }\n\n        state.setFocused(true);\n      },\n      onBlur(e: FocusEvent) {\n        if (state.isOpen) {\n          return;\n        }\n\n        if (props.onBlur) {\n          props.onBlur(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(false);\n        }\n\n        state.setFocused(false);\n      }\n    }),\n    valueProps: {\n      id: valueId\n    },\n    menuProps: {\n      ...menuProps,\n      autoFocus: state.focusStrategy || true,\n      shouldSelectOnPressUp: true,\n      shouldFocusOnHover: true,\n      disallowEmptySelection: true,\n      linkBehavior: 'selection',\n      onBlur: (e) => {\n        if (e.currentTarget.contains(e.relatedTarget as Node)) {\n          return;\n        }\n\n        if (props.onBlur) {\n          props.onBlur(e);\n        }\n\n        if (props.onFocusChange) {\n          props.onFocusChange(false);\n        }\n\n        state.setFocused(false);\n      },\n      'aria-labelledby': [\n        fieldProps['aria-labelledby'],\n        triggerProps['aria-label'] && !fieldProps['aria-labelledby'] ? triggerProps.id : null\n      ].filter(Boolean).join(' ')\n    },\n    descriptionProps,\n    errorMessageProps,\n    isInvalid,\n    validationErrors,\n    validationDetails\n  };\n}\n"],"names":[],"version":3,"file":"useSelect.module.js.map"}