@react-spectrum/tabs 3.0.0-alpha.4 → 3.0.0-nightly-641446f65-240905

package/dist/main.js

@@ -1,427 +1,28 @@
-var {
-  useTabsState
-} = require("@react-stately/tabs");
+var $e8d58e7e32285ba6$exports = require("./Tabs.main.js");
+var $8zXxA$reactstatelycollections = require("@react-stately/collections");
 
-var {
-  useTab,
-  useTabs
-} = require("@react-aria/tabs");
 
-var {
-  useProvider,
-  useProviderProps
-} = require("@react-spectrum/provider");
-
-var {
-  useLocale
-} = require("@react-aria/i18n");
-
-var {
-  useHover
-} = require("@react-aria/interactions");
-
-var {
-  Text
-} = require("@react-spectrum/text");
-
-var _react2 = require("react");
-
-var _react = $parcel$interopDefault(_react2);
-
-var {
-  useCallback,
-  useEffect,
-  useRef,
-  useState
-} = _react2;
-
-var {
-  mergeProps,
-  useId,
-  useLayoutEffect,
-  useResizeObserver
-} = require("@react-aria/utils");
-
-var {
-  Item: _Item,
-  Picker
-} = require("@react-spectrum/picker");
-
-var {
-  FocusRing
-} = require("@react-aria/focus");
-
-var {
-  classNames,
-  SlotProvider,
-  unwrapDOMRef,
-  useDOMRef,
-  useStyleProps,
-  useValueEffect
-} = require("@react-spectrum/utils");
-
-var _babelRuntimeHelpersObjectWithoutPropertiesLoose = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
-var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
-
-var {
-  Item
-} = require("@react-stately/collections");
-
-exports.Item = Item;
-
-require("./main.css");
-
-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});
 }
 
-// ASSET: /Users/govett/dev/react-spectrum-v3/node_modules/@adobe/spectrum-css-temp/components/tabs/vars.css
-var $a221257d7bd2e9d0c131cda7c75f4f5$exports = {};
-$a221257d7bd2e9d0c131cda7c75f4f5$exports = {
-  "spectrum-TabsPanel": "_spectrum-TabsPanel_0248f",
-  "spectrum-TabsPanel--horizontal": "_spectrum-TabsPanel--horizontal_0248f",
-  "spectrum-TabsPanel--vertical": "_spectrum-TabsPanel--vertical_0248f",
-  "spectrum-Tabs": "_spectrum-Tabs_0248f",
-  "spectrum-Tabs-item": "_spectrum-Tabs-item_0248f",
-  "is-disabled": "_is-disabled_0248f",
-  "spectrum-Tabs-itemLabel": "_spectrum-Tabs-itemLabel_0248f",
-  "spectrum-Icon": "_spectrum-Icon_0248f",
-  "spectrum-Tabs-selectionIndicator": "_spectrum-Tabs-selectionIndicator_0248f",
-  "spectrum-Tabs--horizontal": "_spectrum-Tabs--horizontal_0248f",
-  "spectrum-Tabs--compact": "_spectrum-Tabs--compact_0248f",
-  "spectrum-Tabs--isCollapsed": "_spectrum-Tabs--isCollapsed_0248f",
-  "spectrum-Tabs--quiet": "_spectrum-Tabs--quiet_0248f",
-  "spectrum-Tabs--vertical": "_spectrum-Tabs--vertical_0248f",
-  "spectrum-TabsPanel-collapseWrapper": "_spectrum-TabsPanel-collapseWrapper_0248f",
-  "spectrum-TabsPanel-tabs": "_spectrum-TabsPanel-tabs_0248f",
-  "spectrum-TabsPanel-tabpanel": "_spectrum-TabsPanel-tabpanel_0248f",
-  "focus-ring": "_focus-ring_0248f",
-  "is-hovered": "_is-hovered_0248f",
-  "is-selected": "_is-selected_0248f"
-};
-var $a221257d7bd2e9d0c131cda7c75f4f5$$interop$default = $parcel$interopDefault($a221257d7bd2e9d0c131cda7c75f4f5$exports);
-
-function $a016f96d614f365ec6ad3cd2df19b52$var$Tabs(props, ref) {
-  props = useProviderProps(props);
-
-  let {
-    orientation = 'horizontal',
-    isDisabled,
-    isQuiet,
-    density = 'regular',
-    children
-  } = props,
-      otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(props, ["orientation", "isDisabled", "isQuiet", "density", "children"]);
-
-  let domRef = useDOMRef(ref);
-  let tablistRef = useRef();
-  let wrapperRef = useRef();
-  let state = useTabsState(props);
-  let {
-    direction
-  } = useLocale();
-  let {
-    styleProps
-  } = useStyleProps(otherProps);
-  let {
-    tabListProps,
-    tabPanelProps
-  } = useTabs(props, state, tablistRef);
-  let [collapse, setCollapse] = useValueEffect(false);
-  let [selectedTab, setSelectedTab] = useState();
-  useEffect(() => {
-    if (tablistRef.current) {
-      let selectedTab = tablistRef.current.querySelector("[data-key=\"" + state.selectedKey + "\"]");
-
-      if (selectedTab != null) {
-        setSelectedTab(selectedTab);
-      }
-    } // collapse is in the dep array so selectedTab can be updated for TabLine positioning
-
-  }, [children, state.selectedKey, collapse, tablistRef]);
-  let checkShouldCollapse = useCallback(() => {
-    let computeShouldCollapse = () => {
-      if (wrapperRef.current) {
-        let tabsComponent = wrapperRef.current;
-        let tabs = tablistRef.current.querySelectorAll('[role="tab"]');
-        let lastTab = tabs[tabs.length - 1];
-        let end = direction === 'rtl' ? 'left' : 'right';
-        let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];
-        let farEdgeLastTab = lastTab == null ? void 0 : lastTab.getBoundingClientRect()[end];
-        let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;
-        return shouldCollapse;
-      }
-    };
+$parcel$export(module.exports, "TabList", () => $e8d58e7e32285ba6$exports.TabList);
+$parcel$export(module.exports, "TabPanels", () => $e8d58e7e32285ba6$exports.TabPanels);
+$parcel$export(module.exports, "Tabs", () => $e8d58e7e32285ba6$exports.Tabs);
+$parcel$export(module.exports, "Item", () => $8zXxA$reactstatelycollections.Item);
+/*
+ * 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.
+ */ /// <reference types="css-module-types" />
 
-    if (orientation !== 'vertical') {
-      setCollapse(function* () {
-        // Make Tabs render in non-collapsed state
-        yield false; // Compute if Tabs should collapse and update
-
-        yield computeShouldCollapse();
-      });
-    }
-  }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);
-  useEffect(() => {
-    checkShouldCollapse();
-  }, [children, checkShouldCollapse]);
-  useResizeObserver({
-    ref: wrapperRef,
-    onResize: checkShouldCollapse
-  }); // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.
-
-  let collapsibleTabListId = useId();
-
-  if (collapse && orientation !== 'vertical') {
-    tabPanelProps['aria-labelledby'] = collapsibleTabListId;
-  }
-
-  return /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, styleProps, {
-    ref: domRef,
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-TabsPanel', "spectrum-TabsPanel--" + orientation, styleProps.className)
-  }), orientation === 'vertical' && /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$TabList, _babelRuntimeHelpersExtends({}, tabListProps, {
-    ref: tablistRef,
-    orientation: orientation,
-    density: density,
-    isQuiet: isQuiet,
-    isDisabled: isDisabled,
-    state: state,
-    selectedTab: selectedTab
-  })), orientation !== 'vertical' && /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$CollapsibleTabList, _babelRuntimeHelpersExtends({}, props, {
-    id: collapsibleTabListId,
-    wrapperRef: wrapperRef,
-    collapse: collapse,
-    tabListProps: tabListProps,
-    state: state,
-    selectedTab: selectedTab,
-    ref: tablistRef
-  })), /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, tabPanelProps, {
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-TabsPanel-tabpanel')
-  }), state.selectedItem && state.selectedItem.props.children));
-}
-
-function Tab(props) {
-  let {
-    item,
-    state,
-    isDisabled: propsDisabled
-  } = props;
-  let {
-    key,
-    rendered
-  } = item;
-  let isDisabled = propsDisabled || state.disabledKeys.has(key);
-  let ref = useRef();
-  let {
-    tabProps
-  } = useTab({
-    item,
-    isDisabled
-  }, state, ref);
-  let {
-    hoverProps,
-    isHovered
-  } = useHover(_babelRuntimeHelpersExtends({}, props));
-  let isSelected = state.selectedKey === key;
-  return /*#__PURE__*/_react.createElement(FocusRing, {
-    focusRingClass: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'focus-ring')
-  }, /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, mergeProps(tabProps, hoverProps), {
-    ref: ref,
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Tabs-item', {
-      'is-selected': isSelected,
-      'is-disabled': isDisabled,
-      'is-hovered': isHovered
-    })
-  }), /*#__PURE__*/_react.createElement(SlotProvider, {
-    slots: {
-      icon: {
-        size: 'S',
-        UNSAFE_className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Icon')
-      },
-      text: {
-        UNSAFE_className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Tabs-itemLabel')
-      }
-    }
-  }, typeof rendered === 'string' ? /*#__PURE__*/_react.createElement(Text, null, rendered) : rendered)));
-}
-
-exports.Tab = Tab;
-
-function $a016f96d614f365ec6ad3cd2df19b52$var$TabLine(props) {
-  let {
-    orientation,
-    // Is either the tab node (non-collapsed) or the picker node (collapsed)
-    selectedTab,
-    // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change
-    selectedKey
-  } = props;
-  let verticalSelectionIndicatorOffset = 12;
-  let {
-    direction
-  } = useLocale();
-  let {
-    scale
-  } = useProvider();
-  let [style, setStyle] = useState({
-    width: undefined,
-    height: undefined
-  });
-  useLayoutEffect(() => {
-    if (selectedTab) {
-      var _ref;
-
-      let styleObj = {
-        transform: undefined,
-        width: undefined,
-        height: undefined
-      }; // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes
-
-      let offset = direction === 'rtl' ? -1 * (((_ref = selectedTab.offsetParent) == null ? void 0 : _ref.offsetWidth) - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;
-      styleObj.transform = orientation === 'vertical' ? "translateY(" + (selectedTab.offsetTop + verticalSelectionIndicatorOffset / 2) + "px)" : "translateX(" + offset + "px)";
-
-      if (orientation === 'horizontal') {
-        styleObj.width = selectedTab.offsetWidth + "px";
-      } else {
-        styleObj.height = selectedTab.offsetHeight - verticalSelectionIndicatorOffset + "px";
-      }
-
-      setStyle(styleObj);
-    }
-  }, [direction, setStyle, selectedTab, orientation, scale, verticalSelectionIndicatorOffset, selectedKey]);
-  return /*#__PURE__*/_react.createElement("div", {
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Tabs-selectionIndicator'),
-    role: "presentation",
-    style: style
-  });
-}
-
-const $a016f96d614f365ec6ad3cd2df19b52$var$CollapsibleTabList = _react.forwardRef(function (props, ref) {
-  let {
-    tabListProps,
-    density,
-    isQuiet,
-    isDisabled,
-    state,
-    selectedTab,
-    wrapperRef,
-    collapse
-  } = props;
-  let tabListclassName = classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-TabsPanel-tabs');
-  return /*#__PURE__*/_react.createElement("div", {
-    ref: wrapperRef,
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-TabsPanel-collapseWrapper')
-  }, collapse && /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$TabPicker, _babelRuntimeHelpersExtends({}, props, {
-    className: tabListclassName
-  })), !collapse && /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$TabList, _babelRuntimeHelpersExtends({}, tabListProps, {
-    density: density,
-    isQuiet: isQuiet,
-    isDisabled: isDisabled,
-    state: state,
-    selectedTab: selectedTab,
-    ref: ref,
-    orientation: "horizontal",
-    className: tabListclassName
-  })));
-});
-
-const $a016f96d614f365ec6ad3cd2df19b52$var$TabList = _react.forwardRef(function (props, ref) {
-  let {
-    isQuiet,
-    density,
-    state,
-    isDisabled,
-    orientation,
-    selectedTab,
-    className
-  } = props,
-      otherProps = _babelRuntimeHelpersObjectWithoutPropertiesLoose(props, ["isQuiet", "density", "state", "isDisabled", "orientation", "selectedTab", "className"]);
-
-  return /*#__PURE__*/_react.createElement("div", _babelRuntimeHelpersExtends({}, otherProps, {
-    ref: ref,
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Tabs', "spectrum-Tabs--" + orientation, {
-      'spectrum-Tabs--quiet': isQuiet,
-      ['spectrum-Tabs--compact']: density === 'compact'
-    }, className)
-  }), [...state.collection].map(item => /*#__PURE__*/_react.createElement(Tab, {
-    key: item.key,
-    item: item,
-    state: state,
-    isDisabled: isDisabled,
-    orientation: orientation
-  })), /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$TabLine, {
-    orientation: orientation,
-    selectedTab: selectedTab
-  }));
-});
-
-function $a016f96d614f365ec6ad3cd2df19b52$var$TabPicker(props) {
-  let {
-    isDisabled,
-    isQuiet,
-    state,
-    'aria-labelledby': ariaLabeledBy,
-    'aria-label': ariaLabel,
-    density,
-    className,
-    id
-  } = props;
-  let ref = useRef();
-  let [pickerNode, setPickerNode] = useState(null);
-  useEffect(() => {
-    let node = unwrapDOMRef(ref);
-    setPickerNode(node.current);
-  }, [ref]);
-  let items = [...state.collection].map(item => ({
-    rendered: item.rendered,
-    textValue: item.textValue,
-    id: item.key
-  }));
-  let pickerProps = {
-    'aria-labelledby': ariaLabeledBy,
-    'aria-label': ariaLabel
-  }; // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it
-
-  return /*#__PURE__*/_react.createElement("div", {
-    className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Tabs', 'spectrum-Tabs--horizontal', 'spectrum-Tabs--isCollapsed', {
-      'spectrum-Tabs--quiet': isQuiet,
-      ['spectrum-Tabs--compact']: density === 'compact'
-    }, className)
-  }, /*#__PURE__*/_react.createElement(SlotProvider, {
-    slots: {
-      icon: {
-        size: 'S',
-        UNSAFE_className: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'spectrum-Icon')
-      },
-      button: {
-        focusRingClass: classNames($a221257d7bd2e9d0c131cda7c75f4f5$$interop$default, 'focus-ring')
-      }
-    }
-  }, /*#__PURE__*/_react.createElement(Picker, _babelRuntimeHelpersExtends({}, pickerProps, {
-    id: id,
-    items: items,
-    ref: ref,
-    isQuiet: true,
-    isDisabled: isDisabled,
-    selectedKey: state.selectedKey,
-    disabledKeys: state.disabledKeys,
-    onSelectionChange: state.setSelectedKey
-  }), item => /*#__PURE__*/_react.createElement(_Item, {
-    textValue: item.textValue
-  }, item.rendered)), pickerNode && /*#__PURE__*/_react.createElement($a016f96d614f365ec6ad3cd2df19b52$var$TabLine, {
-    orientation: "horizontal",
-    selectedTab: pickerNode,
-    selectedKey: state.selectedKey
-  })));
-}
-/**
- * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.
- */
-// 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 Tabs = _react.forwardRef($a016f96d614f365ec6ad3cd2df19b52$var$Tabs);
 
-exports.Tabs = Tabs;
 //# sourceMappingURL=main.js.map

package/dist/main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./node_modules/@adobe/spectrum-css-temp/components/tabs/vars.css","./packages/@react-spectrum/tabs/src/Tabs.tsx"],"sourcesContent":["function $parcel$interopDefault(a) {\n  return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n  Object.keys(source).forEach(function(key) {\n    if (key === 'default' || key === '__esModule') {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function get() {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n}\n\nfunction $parcel$missingModule(name) {\n  var err = new Error(\"Cannot find module '\" + name + \"'\");\n  err.code = 'MODULE_NOT_FOUND';\n  throw err;\n}\n\nvar $parcel$global =\n  typeof globalThis !== 'undefined'\n    ? globalThis\n    : typeof self !== 'undefined'\n    ? self\n    : typeof window !== 'undefined'\n    ? window\n    : typeof global !== 'undefined'\n    ? global\n    : {};\n","/*\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\n@import './index.css';\n@import './skin.css';\n","/*\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 {classNames, SlotProvider, unwrapDOMRef, useDOMRef, useStyleProps, useValueEffect} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {HTMLAttributes, Key, MutableRefObject, ReactElement, useCallback, useEffect, useRef, useState} from 'react';\nimport {SingleSelectListState} from '@react-stately/list';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useHover} from '@react-aria/interactions';\nimport {useLocale} from '@react-aria/i18n';\nimport {useProvider, useProviderProps} from '@react-spectrum/provider';\nimport {useResizeObserver} from '@react-aria/utils';\nimport {useTab, useTabs} from '@react-aria/tabs';\nimport {useTabsState} from '@react-stately/tabs';\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {\n    orientation = 'horizontal' as Orientation,\n    isDisabled,\n    isQuiet,\n    density = 'regular',\n    children,\n    ...otherProps\n  } = props;\n\n  let domRef = useDOMRef(ref);\n  let tablistRef = useRef<HTMLDivElement>();\n  let wrapperRef = useRef<HTMLDivElement>();\n  let state = useTabsState(props);\n\n  let {direction} = useLocale();\n  let {styleProps} = useStyleProps(otherProps);\n  let {tabListProps, tabPanelProps} = useTabs(props, state, tablistRef);\n  let [collapse, setCollapse] = useValueEffect(false);\n  let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n\n  useEffect(() => {\n    if (tablistRef.current) {\n      let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${state.selectedKey}\"]`);\n\n      if (selectedTab != null) {\n        setSelectedTab(selectedTab);\n      }\n    }\n    // collapse is in the dep array so selectedTab can be updated for TabLine positioning\n  }, [children, state.selectedKey, collapse, tablistRef]);\n\n  let checkShouldCollapse = useCallback(() => {\n    let computeShouldCollapse = () => {\n      if (wrapperRef.current) {\n        let tabsComponent = wrapperRef.current;\n        let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n        let lastTab = tabs[tabs.length - 1];\n\n        let end = direction === 'rtl' ? 'left' : 'right';\n        let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n        let farEdgeLastTab = lastTab?.getBoundingClientRect()[end];\n        let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n\n        return shouldCollapse;\n      }\n    };\n\n    if (orientation !== 'vertical') {\n      setCollapse(function* () {\n        // Make Tabs render in non-collapsed state\n        yield false;\n\n        // Compute if Tabs should collapse and update\n        yield computeShouldCollapse();\n      });\n    }\n  }, [tablistRef, wrapperRef, direction, orientation, setCollapse]);\n\n  useEffect(() => {\n    checkShouldCollapse();\n  }, [children, checkShouldCollapse]);\n\n  useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n  // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n  let collapsibleTabListId = useId();\n  if (collapse && orientation !== 'vertical') {\n    tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n  }\n\n  return (\n    <div\n      {...styleProps}\n      ref={domRef}\n      className={classNames(\n        styles,\n        'spectrum-TabsPanel',\n        `spectrum-TabsPanel--${orientation}`,\n        styleProps.className\n      )}>\n      {orientation === 'vertical' &&\n        <TabList\n          {...tabListProps}\n          ref={tablistRef}\n          orientation={orientation}\n          density={density}\n          isQuiet={isQuiet}\n          isDisabled={isDisabled}\n          state={state}\n          selectedTab={selectedTab} />\n      }\n      {orientation !== 'vertical' &&\n        <CollapsibleTabList\n          {...props}\n          id={collapsibleTabListId}\n          wrapperRef={wrapperRef}\n          collapse={collapse}\n          tabListProps={tabListProps}\n          state={state}\n          selectedTab={selectedTab}\n          ref={tablistRef} />\n      }\n      <div {...tabPanelProps} className={classNames(styles, 'spectrum-TabsPanel-tabpanel')}>\n        {state.selectedItem && state.selectedItem.props.children}\n      </div>\n    </div>\n  );\n}\n\ninterface TabProps<T> extends DOMProps {\n  item: Node<T>,\n  state: SingleSelectListState<T>,\n  isDisabled?: boolean,\n  orientation?: Orientation\n}\n\nexport function Tab<T>(props: TabProps<T>) {\n  let {item, state, isDisabled: propsDisabled} = props;\n  let {key, rendered} = item;\n  let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n  let ref = useRef<HTMLDivElement>();\n  let {tabProps} = useTab({item, isDisabled}, state, ref);\n\n  let {hoverProps, isHovered} = useHover({\n    ...props\n  });\n  let isSelected = state.selectedKey === key;\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <div\n        {...mergeProps(tabProps, hoverProps)}\n        ref={ref}\n        className={classNames(\n          styles,\n          'spectrum-Tabs-item',\n          {\n            'is-selected': isSelected,\n            'is-disabled': isDisabled,\n            'is-hovered': isHovered\n          }\n        )}>\n        <SlotProvider\n          slots={{\n            icon: {\n              size: 'S',\n              UNSAFE_className: classNames(styles, 'spectrum-Icon')\n            },\n            text: {\n              UNSAFE_className: classNames(styles, 'spectrum-Tabs-itemLabel')\n            }\n          }}>\n          {typeof rendered === 'string'\n            ? <Text>{rendered}</Text>\n            : rendered}\n        </SlotProvider>\n      </div>\n    </FocusRing>\n  );\n}\n\ninterface TabLineProps {\n  orientation?: Orientation,\n  selectedTab?: HTMLElement,\n  selectedKey?: Key\n}\n\nfunction TabLine(props: TabLineProps) {\n  let {\n    orientation,\n    // Is either the tab node (non-collapsed) or the picker node (collapsed)\n    selectedTab,\n    // selectedKey is provided so that the TabLine styles are updated when the TabPicker's width updates from a selection change\n    selectedKey\n  } = props;\n\n  let verticalSelectionIndicatorOffset = 12;\n  let {direction} = useLocale();\n  let {scale} = useProvider();\n\n  let [style, setStyle] = useState({\n    width: undefined,\n    height: undefined\n  });\n\n  useLayoutEffect(() => {\n    if (selectedTab) {\n      let styleObj = {transform: undefined, width: undefined, height: undefined};\n      // In RTL, calculate the transform from the right edge of the tablist so that resizing the window doesn't break the Tabline position due to offsetLeft changes\n      let offset = direction === 'rtl' ? -1 * ((selectedTab.offsetParent as HTMLElement)?.offsetWidth - selectedTab.offsetWidth - selectedTab.offsetLeft) : selectedTab.offsetLeft;\n      styleObj.transform = orientation === 'vertical'\n        ? `translateY(${selectedTab.offsetTop + verticalSelectionIndicatorOffset / 2}px)`\n        : `translateX(${offset}px)`;\n\n      if (orientation === 'horizontal') {\n        styleObj.width = `${selectedTab.offsetWidth}px`;\n      } else {\n        styleObj.height = `${selectedTab.offsetHeight - verticalSelectionIndicatorOffset}px`;\n      }\n      setStyle(styleObj);\n    }\n\n  }, [direction, setStyle, selectedTab, orientation, scale, verticalSelectionIndicatorOffset, selectedKey]);\n\n  return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\ninterface CollapsibleTabListProps<T> extends TabListProps<T>, TabPickerProps<T> {\n  tabListProps?: HTMLAttributes<HTMLElement>,\n  wrapperRef: MutableRefObject<HTMLDivElement>,\n  collapse?: boolean,\n  tabListclassName?: string\n}\n\nconst CollapsibleTabList = React.forwardRef(function <T> (props: CollapsibleTabListProps<T>, ref: MutableRefObject<HTMLDivElement>) {\n  let {\n    tabListProps,\n    density,\n    isQuiet,\n    isDisabled,\n    state,\n    selectedTab,\n    wrapperRef,\n    collapse\n  } = props;\n\n  let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n\n  return (\n    <div\n      ref={wrapperRef}\n      className={classNames(\n        styles,\n        'spectrum-TabsPanel-collapseWrapper'\n      )}>\n      {collapse && <TabPicker {...props} className={tabListclassName} />}\n      {!collapse && (\n        <TabList\n          {...tabListProps}\n          density={density}\n          isQuiet={isQuiet}\n          isDisabled={isDisabled}\n          state={state}\n          selectedTab={selectedTab}\n          ref={ref}\n          orientation=\"horizontal\"\n          className={tabListclassName} />\n      )}\n    </div>\n  );\n});\n\ninterface TabListProps<T> {\n  isQuiet?: boolean,\n  density?: 'compact' | 'regular',\n  isDisabled?: boolean,\n  orientation?: Orientation,\n  state: SingleSelectListState<T>,\n  selectedTab: HTMLElement,\n  className?: string\n}\n\nconst TabList = React.forwardRef(function <T> (props: TabListProps<T>, ref: MutableRefObject<HTMLDivElement>) {\n  let {\n    isQuiet,\n    density,\n    state,\n    isDisabled,\n    orientation,\n    selectedTab,\n    className,\n    ...otherProps\n  } = props;\n\n  return (\n    <div\n      {...otherProps}\n      ref={ref}\n      className={classNames(\n        styles,\n        'spectrum-Tabs',\n        `spectrum-Tabs--${orientation}`,\n        {\n          'spectrum-Tabs--quiet': isQuiet,\n          ['spectrum-Tabs--compact']: density === 'compact'\n        },\n        className\n      )}>\n      {[...state.collection].map((item) => (\n        <Tab key={item.key} item={item} state={state} isDisabled={isDisabled} orientation={orientation} />\n      ))}\n      <TabLine orientation={orientation} selectedTab={selectedTab} />\n    </div>\n  );\n});\n\ninterface TabPickerProps<T> extends SpectrumPickerProps<T> {\n  density?: 'compact' | 'regular',\n  state: SingleSelectListState<T>,\n  className?: string\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n  let {\n    isDisabled,\n    isQuiet,\n    state,\n    'aria-labelledby': ariaLabeledBy,\n    'aria-label': ariaLabel,\n    density,\n    className,\n    id\n  } = props;\n\n  let ref = useRef();\n  let [pickerNode, setPickerNode] = useState(null);\n\n  useEffect(() => {\n    let node = unwrapDOMRef(ref);\n    setPickerNode(node.current);\n  }, [ref]);\n\n  let items = [...state.collection].map((item) => ({\n    rendered: item.rendered,\n    textValue: item.textValue,\n    id: item.key\n  }));\n\n  let pickerProps = {\n    'aria-labelledby': ariaLabeledBy,\n    'aria-label': ariaLabel\n  };\n\n  // TODO: Figure out if tabListProps should go onto the div here, v2 doesn't do it\n  return (\n    <div\n      className={classNames(\n        styles,\n        'spectrum-Tabs',\n        'spectrum-Tabs--horizontal',\n        'spectrum-Tabs--isCollapsed',\n        {\n          'spectrum-Tabs--quiet': isQuiet,\n          ['spectrum-Tabs--compact']: density === 'compact'\n        },\n        className\n      )}>\n      <SlotProvider\n        slots={{\n          icon: {\n            size: 'S',\n            UNSAFE_className: classNames(styles, 'spectrum-Icon')\n          },\n          button: {\n            focusRingClass: classNames(styles, 'focus-ring')\n          }\n        }}>\n        <Picker\n          {...pickerProps}\n          id={id}\n          items={items}\n          ref={ref}\n          isQuiet\n          isDisabled={isDisabled}\n          selectedKey={state.selectedKey}\n          disabledKeys={state.disabledKeys}\n          onSelectionChange={state.setSelectedKey}>\n          {item => <Item textValue={item.textValue}>{item.rendered}</Item>}\n        </Picker>\n        {pickerNode && <TabLine orientation=\"horizontal\" selectedTab={pickerNode} selectedKey={state.selectedKey} />}\n      </SlotProvider>\n    </div>\n  );\n}\n\n/**\n * Tabs organize content into multiple sections and allow users to navigate between them. The content under the set of tabs should be related and form a coherent unit.\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 _Tabs = React.forwardRef(Tabs) as <T>(props: SpectrumTabsProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_Tabs as Tabs};\n"],"names":["$parcel$interopDefault","a","__esModule","default","Tabs","props","ref","useProviderProps","orientation","isDisabled","isQuiet","density","children","otherProps","domRef","useDOMRef","tablistRef","useRef","wrapperRef","state","useTabsState","direction","useLocale","styleProps","useStyleProps","tabListProps","tabPanelProps","useTabs","collapse","setCollapse","useValueEffect","selectedTab","setSelectedTab","useState","useEffect","current","querySelector","selectedKey","checkShouldCollapse","useCallback","computeShouldCollapse","tabsComponent","tabs","querySelectorAll","lastTab","length","end","farEdgeTabList","getBoundingClientRect","farEdgeLastTab","shouldCollapse","useResizeObserver","onResize","collapsibleTabListId","useId","classNames","className","selectedItem","Tab","item","propsDisabled","key","rendered","disabledKeys","has","tabProps","useTab","hoverProps","isHovered","useHover","isSelected","mergeProps","icon","size","UNSAFE_className","text","TabLine","verticalSelectionIndicatorOffset","scale","useProvider","style","setStyle","width","undefined","height","useLayoutEffect","styleObj","transform","offset","offsetParent","offsetWidth","offsetLeft","offsetTop","offsetHeight","CollapsibleTabList","React","forwardRef","tabListclassName","TabList","collection","map","TabPicker","ariaLabeledBy","ariaLabel","id","pickerNode","setPickerNode","node","unwrapDOMRef","items","textValue","pickerProps","button","focusRingClass","setSelectedKey","_Tabs"],"version":3,"file":"main.js.map"}
+{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC,GAED,0CAA0C","sources":["packages/@react-spectrum/tabs/src/index.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {TabList, TabPanels, Tabs} from './Tabs';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumTabsProps, SpectrumTabListProps, SpectrumTabPanelsProps} from '@react-types/tabs';\n"],"names":[],"version":3,"file":"main.js.map"}