@react-spectrum/listbox 3.12.8-nightly.4552 → 3.12.8-nightly.4558

package/dist/ListBoxBase.module.js

@@ -0,0 +1,162 @@
+import $gF3QK$intlStringsmodulejs from "./intlStrings.module.js";
+import {ListBoxContext as $0c6f792811e33483$export$7ff8f37d2d81a48d} from "./ListBoxContext.module.js";
+import {ListBoxOption as $86983ea1fa3f7312$export$feb3b6b552c14a12} from "./ListBoxOption.module.js";
+import {ListBoxSection as $92d678ed88836094$export$dca12b0bb56e4fc} from "./ListBoxSection.module.js";
+import "./vars.5bf8960a.css";
+import $gF3QK$menu_vars_cssmodulejs from "./menu_vars_css.module.js";
+import {useListBox as $gF3QK$useListBox} from "@react-aria/listbox";
+import {useStyleProps as $gF3QK$useStyleProps, classNames as $gF3QK$classNames} from "@react-spectrum/utils";
+import {FocusScope as $gF3QK$FocusScope} from "@react-aria/focus";
+import {ListLayout as $gF3QK$ListLayout} from "@react-stately/layout";
+import {useLayoutEffect as $gF3QK$useLayoutEffect, mergeProps as $gF3QK$mergeProps} from "@react-aria/utils";
+import {ProgressCircle as $gF3QK$ProgressCircle} from "@react-spectrum/progress";
+import $gF3QK$react, {useMemo as $gF3QK$useMemo} from "react";
+import {useCollator as $gF3QK$useCollator, useLocalizedStringFormatter as $gF3QK$useLocalizedStringFormatter} from "@react-aria/i18n";
+import {useProvider as $gF3QK$useProvider} from "@react-spectrum/provider";
+import {VirtualizerItem as $gF3QK$VirtualizerItem, Virtualizer as $gF3QK$Virtualizer} from "@react-aria/virtualizer";
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+/*
+ * 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.
+ */ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+function $3247d4a89e6094e9$export$25768ea656ae32a7(state, isLoading) {
+    let { scale: scale } = (0, $gF3QK$useProvider)();
+    let collator = (0, $gF3QK$useCollator)({
+        usage: "search",
+        sensitivity: "base"
+    });
+    let layout = (0, $gF3QK$useMemo)(()=>new (0, $gF3QK$ListLayout)({
+            estimatedRowHeight: scale === "large" ? 48 : 32,
+            estimatedHeadingHeight: scale === "large" ? 33 : 26,
+            padding: scale === "large" ? 5 : 4,
+            loaderHeight: 40,
+            placeholderHeight: scale === "large" ? 48 : 32,
+            collator: collator
+        }), [
+        collator,
+        scale
+    ]);
+    layout.collection = state.collection;
+    layout.disabledKeys = state.disabledKeys;
+    (0, $gF3QK$useLayoutEffect)(()=>{
+        // Sync loading state into the layout.
+        if (layout.isLoading !== isLoading) {
+            var _layout_virtualizer;
+            layout.isLoading = isLoading;
+            (_layout_virtualizer = layout.virtualizer) === null || _layout_virtualizer === void 0 ? void 0 : _layout_virtualizer.relayoutNow();
+        }
+    }, [
+        layout,
+        isLoading
+    ]);
+    return layout;
+}
+/** @private */ function $3247d4a89e6094e9$var$ListBoxBase(props, ref) {
+    let { layout: layout, state: state, shouldSelectOnPressUp: shouldSelectOnPressUp, focusOnPointerEnter: focusOnPointerEnter, shouldUseVirtualFocus: shouldUseVirtualFocus, domProps: domProps = {}, transitionDuration: transitionDuration = 0, onScroll: onScroll } = props;
+    let { listBoxProps: listBoxProps } = (0, $gF3QK$useListBox)({
+        ...props,
+        keyboardDelegate: layout,
+        isVirtualized: true
+    }, state, ref);
+    let { styleProps: styleProps } = (0, $gF3QK$useStyleProps)(props);
+    let stringFormatter = (0, $gF3QK$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gF3QK$intlStringsmodulejs))), "@react-spectrum/listbox");
+    let renderWrapper = (parent, reusableView, children, renderChildren)=>{
+        if (reusableView.viewType === "section") return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $92d678ed88836094$export$dca12b0bb56e4fc), {
+            key: reusableView.key,
+            item: reusableView.content,
+            layoutInfo: reusableView.layoutInfo,
+            virtualizer: reusableView.virtualizer,
+            headerLayoutInfo: children.find((c)=>c.viewType === "header").layoutInfo
+        }, renderChildren(children.filter((c)=>c.viewType === "item")));
+        return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$VirtualizerItem), {
+            key: reusableView.key,
+            layoutInfo: reusableView.layoutInfo,
+            virtualizer: reusableView.virtualizer,
+            parent: parent === null || parent === void 0 ? void 0 : parent.layoutInfo
+        }, reusableView.rendered);
+    };
+    return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $0c6f792811e33483$export$7ff8f37d2d81a48d).Provider, {
+        value: state
+    }, /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$FocusScope), null, /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$Virtualizer), {
+        ...styleProps,
+        ...(0, $gF3QK$mergeProps)(listBoxProps, domProps),
+        ref: ref,
+        focusedKey: state.selectionManager.focusedKey,
+        autoFocus: !!props.autoFocus,
+        sizeToFit: "height",
+        scrollDirection: "vertical",
+        className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), "spectrum-Menu", styleProps.className),
+        layout: layout,
+        collection: state.collection,
+        renderWrapper: renderWrapper,
+        transitionDuration: transitionDuration,
+        isLoading: props.isLoading,
+        onLoadMore: props.onLoadMore,
+        shouldUseVirtualFocus: shouldUseVirtualFocus,
+        onScroll: onScroll
+    }, (type, item)=>{
+        if (type === "item") return /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $86983ea1fa3f7312$export$feb3b6b552c14a12), {
+            item: item,
+            shouldSelectOnPressUp: shouldSelectOnPressUp,
+            shouldFocusOnHover: focusOnPointerEnter,
+            shouldUseVirtualFocus: shouldUseVirtualFocus
+        });
+        else if (type === "loader") return(// aria-selected isn't needed here since this option is not selectable.
+        // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+        /*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
+            role: "option",
+            style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                height: "100%"
+            }
+        }, /*#__PURE__*/ (0, $gF3QK$react).createElement((0, $gF3QK$ProgressCircle), {
+            isIndeterminate: true,
+            size: "S",
+            "aria-label": state.collection.size > 0 ? stringFormatter.format("loadingMore") : stringFormatter.format("loading"),
+            UNSAFE_className: (0, $gF3QK$classNames)((0, ($parcel$interopDefault($gF3QK$menu_vars_cssmodulejs))), "spectrum-Dropdown-progressCircle")
+        })));
+        else if (type === "placeholder") {
+            let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
+            if (emptyState == null) return null;
+            return /*#__PURE__*/ (0, $gF3QK$react).createElement("div", {
+                // aria-selected isn't needed here since this option is not selectable.
+                // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+                role: "option"
+            }, emptyState);
+        }
+    })));
+}
+// forwardRef doesn't support generic parameters, so cast the result to the correct type
+// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref
+const $3247d4a89e6094e9$export$1afdcf349979fb7e = /*#__PURE__*/ (0, $gF3QK$react).forwardRef($3247d4a89e6094e9$var$ListBoxBase);
+
+
+export {$3247d4a89e6094e9$export$25768ea656ae32a7 as useListBoxLayout, $3247d4a89e6094e9$export$1afdcf349979fb7e as ListBoxBase};
+//# sourceMappingURL=ListBoxBase.module.js.map

package/dist/ListBoxBase.module.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-spectrum/listbox/src/ListBoxBase.tsx"],"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 {AriaLabelingProps, DOMProps, FocusStrategy, Node, StyleProps} from '@react-types/shared';\nimport {AriaListBoxOptions, useListBox} from '@react-aria/listbox';\nimport {classNames, useStyleProps} from '@react-spectrum/utils';\nimport {FocusScope} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListBoxContext} from './ListBoxContext';\nimport {ListBoxOption} from './ListBoxOption';\nimport {ListBoxSection} from './ListBoxSection';\nimport {ListLayout} from '@react-stately/layout';\nimport {ListState} from '@react-stately/list';\nimport {mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {HTMLAttributes, ReactElement, ReactNode, RefObject, useMemo} from 'react';\nimport {ReusableView} from '@react-stately/virtualizer';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {useCollator, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer, VirtualizerItem} from '@react-aria/virtualizer';\n\ninterface ListBoxBaseProps<T> extends AriaListBoxOptions<T>, DOMProps, AriaLabelingProps, StyleProps {\n  layout: ListLayout<T>,\n  state: ListState<T>,\n  autoFocus?: boolean | FocusStrategy,\n  shouldFocusWrap?: boolean,\n  shouldSelectOnPressUp?: boolean,\n  focusOnPointerEnter?: boolean,\n  domProps?: HTMLAttributes<HTMLElement>,\n  disallowEmptySelection?: boolean,\n  shouldUseVirtualFocus?: boolean,\n  transitionDuration?: number,\n  isLoading?: boolean,\n  onLoadMore?: () => void,\n  renderEmptyState?: () => ReactNode,\n  onScroll?: () => void\n}\n\n/** @private */\nexport function useListBoxLayout<T>(state: ListState<T>, isLoading: boolean): ListLayout<T> {\n  let {scale} = useProvider();\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let layout = useMemo(() =>\n    new ListLayout<T>({\n      estimatedRowHeight: scale === 'large' ? 48 : 32,\n      estimatedHeadingHeight: scale === 'large' ? 33 : 26,\n      padding: scale === 'large' ? 5 : 4, // TODO: get from DNA\n      loaderHeight: 40,\n      placeholderHeight: scale === 'large' ? 48 : 32,\n      collator\n    })\n  , [collator, scale]);\n\n  layout.collection = state.collection;\n  layout.disabledKeys = state.disabledKeys;\n\n  useLayoutEffect(() => {\n    // Sync loading state into the layout.\n    if (layout.isLoading !== isLoading) {\n      layout.isLoading = isLoading;\n      layout.virtualizer?.relayoutNow();\n    }\n  }, [layout, isLoading]);\n  return layout;\n}\n\n/** @private */\nfunction ListBoxBase<T>(props: ListBoxBaseProps<T>, ref: RefObject<HTMLDivElement>) {\n  let {layout, state, shouldSelectOnPressUp, focusOnPointerEnter, shouldUseVirtualFocus, domProps = {}, transitionDuration = 0, onScroll} = props;\n  let {listBoxProps} = useListBox({\n    ...props,\n    keyboardDelegate: layout,\n    isVirtualized: true\n  }, state, ref);\n  let {styleProps} = useStyleProps(props);\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/listbox');\n\n  // This overrides collection view's renderWrapper to support hierarchy of items in sections.\n  // The header is extracted from the children so it can receive ARIA labeling properties.\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = (parent: View, reusableView: View, children: View[], renderChildren: (views: View[]) => ReactElement[]) => {\n    if (reusableView.viewType === 'section') {\n      return (\n        <ListBoxSection\n          key={reusableView.key}\n          item={reusableView.content}\n          layoutInfo={reusableView.layoutInfo}\n          virtualizer={reusableView.virtualizer}\n          headerLayoutInfo={children.find(c => c.viewType === 'header').layoutInfo}>\n          {renderChildren(children.filter(c => c.viewType === 'item'))}\n        </ListBoxSection>\n      );\n    }\n\n    return (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    );\n  };\n\n  return (\n    <ListBoxContext.Provider value={state}>\n      <FocusScope>\n        <Virtualizer\n          {...styleProps}\n          {...mergeProps(listBoxProps, domProps)}\n          ref={ref}\n          focusedKey={state.selectionManager.focusedKey}\n          autoFocus={!!props.autoFocus}\n          sizeToFit=\"height\"\n          scrollDirection=\"vertical\"\n          className={\n            classNames(\n              styles,\n              'spectrum-Menu',\n              styleProps.className\n            )\n          }\n          layout={layout}\n          collection={state.collection}\n          renderWrapper={renderWrapper}\n          transitionDuration={transitionDuration}\n          isLoading={props.isLoading}\n          onLoadMore={props.onLoadMore}\n          shouldUseVirtualFocus={shouldUseVirtualFocus}\n          onScroll={onScroll}>\n          {(type, item: Node<T>) => {\n            if (type === 'item') {\n              return (\n                <ListBoxOption\n                  item={item}\n                  shouldSelectOnPressUp={shouldSelectOnPressUp}\n                  shouldFocusOnHover={focusOnPointerEnter}\n                  shouldUseVirtualFocus={shouldUseVirtualFocus} />\n              );\n            } else if (type === 'loader') {\n              return (\n                // aria-selected isn't needed here since this option is not selectable.\n                // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n                <div role=\"option\" style={{display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%'}}>\n                  <ProgressCircle\n                    isIndeterminate\n                    size=\"S\"\n                    aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')}\n                    UNSAFE_className={classNames(styles, 'spectrum-Dropdown-progressCircle')} />\n                </div>\n              );\n            } else if (type === 'placeholder') {\n              let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;\n              if (emptyState == null) {\n                return null;\n              }\n\n              return (\n                <div\n                  // aria-selected isn't needed here since this option is not selectable.\n                  // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n                  role=\"option\">\n                  {emptyState}\n                </div>\n              );\n            }\n          }}\n        </Virtualizer>\n      </FocusScope>\n    </ListBoxContext.Provider>\n  );\n}\n\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\n// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref\nconst _ListBoxBase = React.forwardRef(ListBoxBase) as <T>(props: ListBoxBaseProps<T> & {ref?: RefObject<HTMLDivElement>}) => ReactElement;\nexport {_ListBoxBase as ListBoxBase};\n"],"names":[],"version":3,"file":"ListBoxBase.module.js.map"}

package/dist/ListBoxContext.main.js

@@ -0,0 +1,27 @@
+var $497sr$react = require("react");
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "ListBoxContext", () => $611e93c7b7c0413c$export$7ff8f37d2d81a48d);
+/*
+ * 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 $611e93c7b7c0413c$export$7ff8f37d2d81a48d = (0, ($parcel$interopDefault($497sr$react))).createContext(null);
+
+
+//# sourceMappingURL=ListBoxContext.main.js.map

package/dist/ListBoxContext.main.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;AAKM,MAAM,4CAAiB,CAAA,GAAA,sCAAI,EAAE,aAAa,CAAqB","sources":["packages/@react-spectrum/listbox/src/ListBoxContext.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 {ListState} from '@react-stately/list';\nimport React from 'react';\n\nexport const ListBoxContext = React.createContext<ListState<unknown>>(null);\n"],"names":[],"version":3,"file":"ListBoxContext.main.js.map"}

package/dist/ListBoxContext.mjs

@@ -0,0 +1,18 @@
+import $8XLda$react from "react";
+
+/*
+ * 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 $0c6f792811e33483$export$7ff8f37d2d81a48d = (0, $8XLda$react).createContext(null);
+
+
+export {$0c6f792811e33483$export$7ff8f37d2d81a48d as ListBoxContext};
+//# sourceMappingURL=ListBoxContext.mjs.map

package/dist/ListBoxContext.module.js

@@ -0,0 +1,18 @@
+import $8XLda$react from "react";
+
+/*
+ * 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 $0c6f792811e33483$export$7ff8f37d2d81a48d = (0, $8XLda$react).createContext(null);
+
+
+export {$0c6f792811e33483$export$7ff8f37d2d81a48d as ListBoxContext};
+//# sourceMappingURL=ListBoxContext.module.js.map

package/dist/ListBoxContext.module.js.map

@@ -0,0 +1 @@
+{"mappings":";;AAAA;;;;;;;;;;CAUC;AAKM,MAAM,4CAAiB,CAAA,GAAA,YAAI,EAAE,aAAa,CAAqB","sources":["packages/@react-spectrum/listbox/src/ListBoxContext.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 {ListState} from '@react-stately/list';\nimport React from 'react';\n\nexport const ListBoxContext = React.createContext<ListState<unknown>>(null);\n"],"names":[],"version":3,"file":"ListBoxContext.module.js.map"}

package/dist/ListBoxOption.main.js

@@ -0,0 +1,108 @@
+var $611e93c7b7c0413c$exports = require("./ListBoxContext.main.js");
+require("./vars.5bf8960a.css");
+var $3deee0fd2b46e64f$exports = require("./menu_vars_css.main.js");
+var $8xmxv$spectrumiconsuiCheckmarkMedium = require("@spectrum-icons/ui/CheckmarkMedium");
+var $8xmxv$reactspectrumutils = require("@react-spectrum/utils");
+var $8xmxv$reactariafocus = require("@react-aria/focus");
+var $8xmxv$reactspectrumlayout = require("@react-spectrum/layout");
+var $8xmxv$reactariainteractions = require("@react-aria/interactions");
+var $8xmxv$reactariautils = require("@react-aria/utils");
+var $8xmxv$react = require("react");
+var $8xmxv$reactspectrumtext = require("@react-spectrum/text");
+var $8xmxv$reactarialistbox = require("@react-aria/listbox");
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "ListBoxOption", () => $2205d250ee1cb1ac$export$feb3b6b552c14a12);
+/*
+ * 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.
+ */ 
+
+
+
+
+
+
+
+
+
+
+function $2205d250ee1cb1ac$export$feb3b6b552c14a12(props) {
+    let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
+    let { rendered: rendered, key: key } = item;
+    let ElementType = item.props.href ? "a" : "div";
+    let state = (0, $8xmxv$react.useContext)((0, $611e93c7b7c0413c$exports.ListBoxContext));
+    let ref = (0, $8xmxv$react.useRef)();
+    let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $8xmxv$reactarialistbox.useOption)({
+        "aria-label": item["aria-label"],
+        key: key,
+        shouldSelectOnPressUp: shouldSelectOnPressUp,
+        shouldFocusOnHover: shouldFocusOnHover,
+        isVirtualized: true,
+        shouldUseVirtualFocus: shouldUseVirtualFocus
+    }, state, ref);
+    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $8xmxv$reactariainteractions.useHover)({
+        ...props,
+        isDisabled: isDisabled
+    });
+    let contents = typeof rendered === "string" ? /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumtext.Text), null, rendered) : rendered;
+    let isKeyboardModality = (0, $8xmxv$reactariainteractions.isFocusVisible)();
+    return /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactariafocus.FocusRing), {
+        focusRingClass: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), "focus-ring")
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement(ElementType, {
+        ...(0, $8xmxv$reactariautils.mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
+        ref: ref,
+        className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), "spectrum-Menu-item", {
+            // If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
+            "is-focused": shouldUseVirtualFocus && isFocused && isKeyboardModality,
+            "is-disabled": isDisabled,
+            "is-selected": isSelected,
+            "is-selectable": state.selectionManager.selectionMode !== "none",
+            // When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
+            // Otherwise, apply hover styles when focused using non-keyboard modality.
+            "is-hovered": isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
+        })
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumlayout.Grid), {
+        UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), "spectrum-Menu-itemGrid")
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumutils.ClearSlots), null, /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, $8xmxv$reactspectrumutils.SlotProvider), {
+        slots: {
+            text: {
+                UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))["spectrum-Menu-itemLabel"],
+                ...labelProps
+            },
+            icon: {
+                size: "S",
+                UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))["spectrum-Menu-icon"]
+            },
+            avatar: {
+                size: "avatar-size-100",
+                UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))["spectrum-Menu-avatar"]
+            },
+            description: {
+                UNSAFE_className: (0, ($parcel$interopDefault($3deee0fd2b46e64f$exports)))["spectrum-Menu-description"],
+                ...descriptionProps
+            }
+        }
+    }, contents, isSelected && /*#__PURE__*/ (0, ($parcel$interopDefault($8xmxv$react))).createElement((0, ($parcel$interopDefault($8xmxv$spectrumiconsuiCheckmarkMedium))), {
+        slot: "checkmark",
+        UNSAFE_className: (0, $8xmxv$reactspectrumutils.classNames)((0, ($parcel$interopDefault($3deee0fd2b46e64f$exports))), "spectrum-Menu-checkmark")
+    }))))));
+}
+
+
+//# sourceMappingURL=ListBoxOption.main.js.map

package/dist/ListBoxOption.main.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAuBM,SAAS,0CAAiB,KAAqB;IACpD,IAAI,QACF,IAAI,yBACJ,qBAAqB,sBACrB,kBAAkB,yBAClB,qBAAqB,EACtB,GAAG;IAEJ,IAAI,YACF,QAAQ,OACR,GAAG,EACJ,GAAG;IACJ,IAAI,cAAiC,KAAK,KAAK,CAAC,IAAI,GAAG,MAAM;IAC7D,IAAI,QAAQ,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,wCAAa;IAEpC,IAAI,MAAM,CAAA,GAAA,mBAAK;IACf,IAAI,eAAC,WAAW,cAAE,UAAU,oBAAE,gBAAgB,cAAE,UAAU,cAAE,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iCAAQ,EAC3F;QACE,cAAc,IAAI,CAAC,aAAa;aAChC;+BACA;4BACA;QACA,eAAe;+BACf;IACF,GACA,OACA;IAEF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,qCAAO,EAAE;QACrC,GAAG,KAAK;oBACR;IACF;IAEA,IAAI,WAAW,OAAO,aAAa,yBAC/B,0DAAC,CAAA,GAAA,6BAAG,SAAG,YACP;IAEJ,IAAI,qBAAqB,CAAA,GAAA,2CAAa;IAEtC,qBACE,0DAAC,CAAA,GAAA,+BAAQ;QAAE,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBAC5C,0DAAC;QACE,GAAG,CAAA,GAAA,gCAAS,EAAE,aAAa,qBAAqB,CAAC,IAAI,WAAW;QACjE,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL,sBACA;YACE,+GAA+G;YAC/G,cAAc,yBAAyB,aAAa;YACpD,eAAe;YACf,eAAe;YACf,iBAAiB,MAAM,gBAAgB,CAAC,aAAa,KAAK;YAC1D,yFAAyF;YACzF,0EAA0E;YAC1E,cAAc,AAAC,aAAa,CAAC,sBAAwB,aAAa,CAAC;QACrE;qBAEF,0DAAC,CAAA,GAAA,+BAAG;QACF,kBACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAK,GACL;qBAGJ,0DAAC,CAAA,GAAA,oCAAS,uBACR,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAK,CAAC,CAAC,0BAA0B;gBAAE,GAAG,UAAU;YAAA;YACzE,MAAM;gBAAC,MAAM;gBAAK,kBAAkB,CAAA,GAAA,mDAAK,CAAC,CAAC,qBAAqB;YAAA;YAChE,QAAQ;gBAAC,MAAM;gBAAmB,kBAAkB,CAAA,GAAA,mDAAK,CAAC,CAAC,uBAAuB;YAAA;YAClF,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAK,CAAC,CAAC,4BAA4B;gBAAE,GAAG,gBAAgB;YAAA;QAC1F;OACC,UACA,4BACC,0DAAC,CAAA,GAAA,+DAAc;QACb,MAAK;QACL,kBACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAK,GACL;;AAUtB","sources":["packages/@react-spectrum/listbox/src/ListBoxOption.tsx"],"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 CheckmarkMedium from '@spectrum-icons/ui/CheckmarkMedium';\nimport {classNames, ClearSlots, SlotProvider} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible, useHover} from '@react-aria/interactions';\nimport {ListBoxContext} from './ListBoxContext';\nimport {mergeProps} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useOption} from '@react-aria/listbox';\n\ninterface OptionProps<T> {\n  item: Node<T>,\n  shouldSelectOnPressUp?: boolean,\n  shouldFocusOnHover?: boolean,\n  shouldUseVirtualFocus?: boolean\n}\n\n/** @private */\nexport function ListBoxOption<T>(props: OptionProps<T>) {\n  let {\n    item,\n    shouldSelectOnPressUp,\n    shouldFocusOnHover,\n    shouldUseVirtualFocus\n  } = props;\n\n  let {\n    rendered,\n    key\n  } = item;\n  let ElementType: React.ElementType = item.props.href ? 'a' : 'div';\n  let state = useContext(ListBoxContext);\n\n  let ref = useRef<any>();\n  let {optionProps, labelProps, descriptionProps, isSelected, isDisabled, isFocused} = useOption(\n    {\n      'aria-label': item['aria-label'],\n      key,\n      shouldSelectOnPressUp,\n      shouldFocusOnHover,\n      isVirtualized: true,\n      shouldUseVirtualFocus\n    },\n    state,\n    ref\n  );\n  let {hoverProps, isHovered} = useHover({\n    ...props,\n    isDisabled\n  });\n\n  let contents = typeof rendered === 'string'\n    ? <Text>{rendered}</Text>\n    : rendered;\n\n  let isKeyboardModality = isFocusVisible();\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <ElementType\n        {...mergeProps(optionProps, shouldFocusOnHover ? {} : hoverProps)}\n        ref={ref}\n        className={classNames(\n          styles,\n          'spectrum-Menu-item',\n          {\n            // If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality\n            'is-focused': shouldUseVirtualFocus && isFocused && isKeyboardModality,\n            'is-disabled': isDisabled,\n            'is-selected': isSelected,\n            'is-selectable': state.selectionManager.selectionMode !== 'none',\n            // When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.\n            // Otherwise, apply hover styles when focused using non-keyboard modality.\n            'is-hovered': (isHovered && !shouldFocusOnHover) || (isFocused && !isKeyboardModality)\n          }\n        )}>\n        <Grid\n          UNSAFE_className={\n            classNames(\n              styles,\n              'spectrum-Menu-itemGrid'\n            )\n          }>\n          <ClearSlots>\n            <SlotProvider\n              slots={{\n                text: {UNSAFE_className: styles['spectrum-Menu-itemLabel'], ...labelProps},\n                icon: {size: 'S', UNSAFE_className: styles['spectrum-Menu-icon']},\n                avatar: {size: 'avatar-size-100', UNSAFE_className: styles['spectrum-Menu-avatar']},\n                description: {UNSAFE_className: styles['spectrum-Menu-description'], ...descriptionProps}\n              }}>\n              {contents}\n              {isSelected &&\n                <CheckmarkMedium\n                  slot=\"checkmark\"\n                  UNSAFE_className={\n                    classNames(\n                      styles,\n                      'spectrum-Menu-checkmark'\n                    )\n                  } />\n              }\n            </SlotProvider>\n          </ClearSlots>\n        </Grid>\n      </ElementType>\n    </FocusRing>\n  );\n}\n"],"names":[],"version":3,"file":"ListBoxOption.main.js.map"}

package/dist/ListBoxOption.mjs

@@ -0,0 +1,103 @@
+import {ListBoxContext as $0c6f792811e33483$export$7ff8f37d2d81a48d} from "./ListBoxContext.mjs";
+import "./vars.5bf8960a.css";
+import $6TrMC$menu_vars_cssmodulejs from "./menu_vars_css.mjs";
+import $6TrMC$spectrumiconsuiCheckmarkMedium from "@spectrum-icons/ui/CheckmarkMedium";
+import {classNames as $6TrMC$classNames, ClearSlots as $6TrMC$ClearSlots, SlotProvider as $6TrMC$SlotProvider} from "@react-spectrum/utils";
+import {FocusRing as $6TrMC$FocusRing} from "@react-aria/focus";
+import {Grid as $6TrMC$Grid} from "@react-spectrum/layout";
+import {useHover as $6TrMC$useHover, isFocusVisible as $6TrMC$isFocusVisible} from "@react-aria/interactions";
+import {mergeProps as $6TrMC$mergeProps} from "@react-aria/utils";
+import $6TrMC$react, {useContext as $6TrMC$useContext, useRef as $6TrMC$useRef} from "react";
+import {Text as $6TrMC$Text} from "@react-spectrum/text";
+import {useOption as $6TrMC$useOption} from "@react-aria/listbox";
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+/*
+ * 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.
+ */ 
+
+
+
+
+
+
+
+
+
+
+function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
+    let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
+    let { rendered: rendered, key: key } = item;
+    let ElementType = item.props.href ? "a" : "div";
+    let state = (0, $6TrMC$useContext)((0, $0c6f792811e33483$export$7ff8f37d2d81a48d));
+    let ref = (0, $6TrMC$useRef)();
+    let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $6TrMC$useOption)({
+        "aria-label": item["aria-label"],
+        key: key,
+        shouldSelectOnPressUp: shouldSelectOnPressUp,
+        shouldFocusOnHover: shouldFocusOnHover,
+        isVirtualized: true,
+        shouldUseVirtualFocus: shouldUseVirtualFocus
+    }, state, ref);
+    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $6TrMC$useHover)({
+        ...props,
+        isDisabled: isDisabled
+    });
+    let contents = typeof rendered === "string" ? /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Text), null, rendered) : rendered;
+    let isKeyboardModality = (0, $6TrMC$isFocusVisible)();
+    return /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$FocusRing), {
+        focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "focus-ring")
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement(ElementType, {
+        ...(0, $6TrMC$mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
+        ref: ref,
+        className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-item", {
+            // If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
+            "is-focused": shouldUseVirtualFocus && isFocused && isKeyboardModality,
+            "is-disabled": isDisabled,
+            "is-selected": isSelected,
+            "is-selectable": state.selectionManager.selectionMode !== "none",
+            // When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
+            // Otherwise, apply hover styles when focused using non-keyboard modality.
+            "is-hovered": isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
+        })
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Grid), {
+        UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-itemGrid")
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$ClearSlots), null, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$SlotProvider), {
+        slots: {
+            text: {
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-itemLabel"],
+                ...labelProps
+            },
+            icon: {
+                size: "S",
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-icon"]
+            },
+            avatar: {
+                size: "avatar-size-100",
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-avatar"]
+            },
+            description: {
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-description"],
+                ...descriptionProps
+            }
+        }
+    }, contents, isSelected && /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$spectrumiconsuiCheckmarkMedium), {
+        slot: "checkmark",
+        UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-checkmark")
+    }))))));
+}
+
+
+export {$86983ea1fa3f7312$export$feb3b6b552c14a12 as ListBoxOption};
+//# sourceMappingURL=ListBoxOption.mjs.map

package/dist/ListBoxOption.module.js

@@ -0,0 +1,103 @@
+import {ListBoxContext as $0c6f792811e33483$export$7ff8f37d2d81a48d} from "./ListBoxContext.module.js";
+import "./vars.5bf8960a.css";
+import $6TrMC$menu_vars_cssmodulejs from "./menu_vars_css.module.js";
+import $6TrMC$spectrumiconsuiCheckmarkMedium from "@spectrum-icons/ui/CheckmarkMedium";
+import {classNames as $6TrMC$classNames, ClearSlots as $6TrMC$ClearSlots, SlotProvider as $6TrMC$SlotProvider} from "@react-spectrum/utils";
+import {FocusRing as $6TrMC$FocusRing} from "@react-aria/focus";
+import {Grid as $6TrMC$Grid} from "@react-spectrum/layout";
+import {useHover as $6TrMC$useHover, isFocusVisible as $6TrMC$isFocusVisible} from "@react-aria/interactions";
+import {mergeProps as $6TrMC$mergeProps} from "@react-aria/utils";
+import $6TrMC$react, {useContext as $6TrMC$useContext, useRef as $6TrMC$useRef} from "react";
+import {Text as $6TrMC$Text} from "@react-spectrum/text";
+import {useOption as $6TrMC$useOption} from "@react-aria/listbox";
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+/*
+ * 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.
+ */ 
+
+
+
+
+
+
+
+
+
+
+function $86983ea1fa3f7312$export$feb3b6b552c14a12(props) {
+    let { item: item, shouldSelectOnPressUp: shouldSelectOnPressUp, shouldFocusOnHover: shouldFocusOnHover, shouldUseVirtualFocus: shouldUseVirtualFocus } = props;
+    let { rendered: rendered, key: key } = item;
+    let ElementType = item.props.href ? "a" : "div";
+    let state = (0, $6TrMC$useContext)((0, $0c6f792811e33483$export$7ff8f37d2d81a48d));
+    let ref = (0, $6TrMC$useRef)();
+    let { optionProps: optionProps, labelProps: labelProps, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, isFocused: isFocused } = (0, $6TrMC$useOption)({
+        "aria-label": item["aria-label"],
+        key: key,
+        shouldSelectOnPressUp: shouldSelectOnPressUp,
+        shouldFocusOnHover: shouldFocusOnHover,
+        isVirtualized: true,
+        shouldUseVirtualFocus: shouldUseVirtualFocus
+    }, state, ref);
+    let { hoverProps: hoverProps, isHovered: isHovered } = (0, $6TrMC$useHover)({
+        ...props,
+        isDisabled: isDisabled
+    });
+    let contents = typeof rendered === "string" ? /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Text), null, rendered) : rendered;
+    let isKeyboardModality = (0, $6TrMC$isFocusVisible)();
+    return /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$FocusRing), {
+        focusRingClass: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "focus-ring")
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement(ElementType, {
+        ...(0, $6TrMC$mergeProps)(optionProps, shouldFocusOnHover ? {} : hoverProps),
+        ref: ref,
+        className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-item", {
+            // If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality
+            "is-focused": shouldUseVirtualFocus && isFocused && isKeyboardModality,
+            "is-disabled": isDisabled,
+            "is-selected": isSelected,
+            "is-selectable": state.selectionManager.selectionMode !== "none",
+            // When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.
+            // Otherwise, apply hover styles when focused using non-keyboard modality.
+            "is-hovered": isHovered && !shouldFocusOnHover || isFocused && !isKeyboardModality
+        })
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$Grid), {
+        UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-itemGrid")
+    }, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$ClearSlots), null, /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$SlotProvider), {
+        slots: {
+            text: {
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-itemLabel"],
+                ...labelProps
+            },
+            icon: {
+                size: "S",
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-icon"]
+            },
+            avatar: {
+                size: "avatar-size-100",
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-avatar"]
+            },
+            description: {
+                UNSAFE_className: (0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs)))["spectrum-Menu-description"],
+                ...descriptionProps
+            }
+        }
+    }, contents, isSelected && /*#__PURE__*/ (0, $6TrMC$react).createElement((0, $6TrMC$spectrumiconsuiCheckmarkMedium), {
+        slot: "checkmark",
+        UNSAFE_className: (0, $6TrMC$classNames)((0, ($parcel$interopDefault($6TrMC$menu_vars_cssmodulejs))), "spectrum-Menu-checkmark")
+    }))))));
+}
+
+
+export {$86983ea1fa3f7312$export$feb3b6b552c14a12 as ListBoxOption};
+//# sourceMappingURL=ListBoxOption.module.js.map

package/dist/ListBoxOption.module.js.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAuBM,SAAS,0CAAiB,KAAqB;IACpD,IAAI,QACF,IAAI,yBACJ,qBAAqB,sBACrB,kBAAkB,yBAClB,qBAAqB,EACtB,GAAG;IAEJ,IAAI,YACF,QAAQ,OACR,GAAG,EACJ,GAAG;IACJ,IAAI,cAAiC,KAAK,KAAK,CAAC,IAAI,GAAG,MAAM;IAC7D,IAAI,QAAQ,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAa;IAEpC,IAAI,MAAM,CAAA,GAAA,aAAK;IACf,IAAI,eAAC,WAAW,cAAE,UAAU,oBAAE,gBAAgB,cAAE,UAAU,cAAE,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ,EAC3F;QACE,cAAc,IAAI,CAAC,aAAa;aAChC;+BACA;4BACA;QACA,eAAe;+BACf;IACF,GACA,OACA;IAEF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QACrC,GAAG,KAAK;oBACR;IACF;IAEA,IAAI,WAAW,OAAO,aAAa,yBAC/B,gCAAC,CAAA,GAAA,WAAG,SAAG,YACP;IAEJ,IAAI,qBAAqB,CAAA,GAAA,qBAAa;IAEtC,qBACE,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;qBAC5C,gCAAC;QACE,GAAG,CAAA,GAAA,iBAAS,EAAE,aAAa,qBAAqB,CAAC,IAAI,WAAW;QACjE,KAAK;QACL,WAAW,CAAA,GAAA,iBAAS,EAClB,CAAA,GAAA,sDAAK,GACL,sBACA;YACE,+GAA+G;YAC/G,cAAc,yBAAyB,aAAa;YACpD,eAAe;YACf,eAAe;YACf,iBAAiB,MAAM,gBAAgB,CAAC,aAAa,KAAK;YAC1D,yFAAyF;YACzF,0EAA0E;YAC1E,cAAc,AAAC,aAAa,CAAC,sBAAwB,aAAa,CAAC;QACrE;qBAEF,gCAAC,CAAA,GAAA,WAAG;QACF,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,sDAAK,GACL;qBAGJ,gCAAC,CAAA,GAAA,iBAAS,uBACR,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,sDAAK,CAAC,CAAC,0BAA0B;gBAAE,GAAG,UAAU;YAAA;YACzE,MAAM;gBAAC,MAAM;gBAAK,kBAAkB,CAAA,GAAA,sDAAK,CAAC,CAAC,qBAAqB;YAAA;YAChE,QAAQ;gBAAC,MAAM;gBAAmB,kBAAkB,CAAA,GAAA,sDAAK,CAAC,CAAC,uBAAuB;YAAA;YAClF,aAAa;gBAAC,kBAAkB,CAAA,GAAA,sDAAK,CAAC,CAAC,4BAA4B;gBAAE,GAAG,gBAAgB;YAAA;QAC1F;OACC,UACA,4BACC,gCAAC,CAAA,GAAA,qCAAc;QACb,MAAK;QACL,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,sDAAK,GACL;;AAUtB","sources":["packages/@react-spectrum/listbox/src/ListBoxOption.tsx"],"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 CheckmarkMedium from '@spectrum-icons/ui/CheckmarkMedium';\nimport {classNames, ClearSlots, SlotProvider} from '@react-spectrum/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible, useHover} from '@react-aria/interactions';\nimport {ListBoxContext} from './ListBoxContext';\nimport {mergeProps} from '@react-aria/utils';\nimport {Node} from '@react-types/shared';\nimport React, {useContext, useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/menu/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useOption} from '@react-aria/listbox';\n\ninterface OptionProps<T> {\n  item: Node<T>,\n  shouldSelectOnPressUp?: boolean,\n  shouldFocusOnHover?: boolean,\n  shouldUseVirtualFocus?: boolean\n}\n\n/** @private */\nexport function ListBoxOption<T>(props: OptionProps<T>) {\n  let {\n    item,\n    shouldSelectOnPressUp,\n    shouldFocusOnHover,\n    shouldUseVirtualFocus\n  } = props;\n\n  let {\n    rendered,\n    key\n  } = item;\n  let ElementType: React.ElementType = item.props.href ? 'a' : 'div';\n  let state = useContext(ListBoxContext);\n\n  let ref = useRef<any>();\n  let {optionProps, labelProps, descriptionProps, isSelected, isDisabled, isFocused} = useOption(\n    {\n      'aria-label': item['aria-label'],\n      key,\n      shouldSelectOnPressUp,\n      shouldFocusOnHover,\n      isVirtualized: true,\n      shouldUseVirtualFocus\n    },\n    state,\n    ref\n  );\n  let {hoverProps, isHovered} = useHover({\n    ...props,\n    isDisabled\n  });\n\n  let contents = typeof rendered === 'string'\n    ? <Text>{rendered}</Text>\n    : rendered;\n\n  let isKeyboardModality = isFocusVisible();\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <ElementType\n        {...mergeProps(optionProps, shouldFocusOnHover ? {} : hoverProps)}\n        ref={ref}\n        className={classNames(\n          styles,\n          'spectrum-Menu-item',\n          {\n            // If using virtual focus, apply focused styles to the item when the user is interacting with keyboard modality\n            'is-focused': shouldUseVirtualFocus && isFocused && isKeyboardModality,\n            'is-disabled': isDisabled,\n            'is-selected': isSelected,\n            'is-selectable': state.selectionManager.selectionMode !== 'none',\n            // When shouldFocusOnHover is false, apply hover styles both when hovered with the mouse.\n            // Otherwise, apply hover styles when focused using non-keyboard modality.\n            'is-hovered': (isHovered && !shouldFocusOnHover) || (isFocused && !isKeyboardModality)\n          }\n        )}>\n        <Grid\n          UNSAFE_className={\n            classNames(\n              styles,\n              'spectrum-Menu-itemGrid'\n            )\n          }>\n          <ClearSlots>\n            <SlotProvider\n              slots={{\n                text: {UNSAFE_className: styles['spectrum-Menu-itemLabel'], ...labelProps},\n                icon: {size: 'S', UNSAFE_className: styles['spectrum-Menu-icon']},\n                avatar: {size: 'avatar-size-100', UNSAFE_className: styles['spectrum-Menu-avatar']},\n                description: {UNSAFE_className: styles['spectrum-Menu-description'], ...descriptionProps}\n              }}>\n              {contents}\n              {isSelected &&\n                <CheckmarkMedium\n                  slot=\"checkmark\"\n                  UNSAFE_className={\n                    classNames(\n                      styles,\n                      'spectrum-Menu-checkmark'\n                    )\n                  } />\n              }\n            </SlotProvider>\n          </ClearSlots>\n        </Grid>\n      </ElementType>\n    </FocusRing>\n  );\n}\n"],"names":[],"version":3,"file":"ListBoxOption.module.js.map"}