@react-spectrum/tabs 3.5.3-nightly.3843 → 3.5.3-nightly.3847

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/import.mjs CHANGED
@@ -381,7 +381,7 @@ function $65ab70ddbed1564b$export$e51a686c67fdaa2d(props) {
381
381
  function $65ab70ddbed1564b$export$5dae8d435677f210(props) {
382
382
  const { tabState: tabState , tabProps: tabProps } = (0, $cLzzU$useContext)($65ab70ddbed1564b$var$TabContext);
383
383
  const { tabListState: tabListState } = tabState;
384
- const factory = (nodes)=>new (0, $cLzzU$ListCollection)(nodes);
384
+ const factory = (0, $cLzzU$useCallback)((nodes)=>new (0, $cLzzU$ListCollection)(nodes), []);
385
385
  const collection = (0, $cLzzU$useCollection)({
386
386
  items: tabProps.items,
387
387
  ...props
package/dist/main.js CHANGED
@@ -386,7 +386,7 @@ function $e8d58e7e32285ba6$export$e51a686c67fdaa2d(props) {
386
386
  function $e8d58e7e32285ba6$export$5dae8d435677f210(props) {
387
387
  const { tabState: tabState , tabProps: tabProps } = (0, $8zXxA$react.useContext)($e8d58e7e32285ba6$var$TabContext);
388
388
  const { tabListState: tabListState } = tabState;
389
- const factory = (nodes)=>new (0, $8zXxA$reactstatelylist.ListCollection)(nodes);
389
+ const factory = (0, $8zXxA$react.useCallback)((nodes)=>new (0, $8zXxA$reactstatelylist.ListCollection)(nodes), []);
390
390
  const collection = (0, $8zXxA$reactstatelycollections.useCollection)({
391
391
  items: tabProps.items,
392
392
  ...props
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"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","/*\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} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {\n Key,\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\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, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapsed: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n },\n tabLineState: Array<DOMRect>\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\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\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapsed, setCollapsed] = useState(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n let [tabPositions, setTabPositions] = useState([]);\n let prevTabPositions = useRef(tabPositions);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.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, tabListState?.selectedKey, collapsed, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n if (wrapperRef.current && orientation !== 'vertical') {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let tabDimensions = [...tabs].map(tab => tab.getBoundingClientRect());\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = tabDimensions[tabDimensions.length - 1][end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n setCollapsed(shouldCollapse);\n if (tabDimensions.length !== prevTabPositions.current.length || tabDimensions.some((box, index) => box?.left !== prevTabPositions.current[index]?.left || box?.right !== prevTabPositions.current[index]?.right)) {\n setTabPositions(tabDimensions);\n prevTabPositions.current = tabDimensions;\n }\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapsed, prevTabPositions, setTabPositions]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapsed && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapsed},\n refs: {tablistRef, wrapperRef},\n tabPanelProps,\n tabLineState: tabPositions\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: TabListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state} = props;\n let {key, rendered} = item;\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps, isSelected, isDisabled} = useTab({key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\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\n// @private\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 {direction} = useLocale();\n let {scale} = useProvider();\n let {tabLineState} = useContext(TabContext);\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\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}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, scale, selectedKey, tabLineState]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapsed, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n\n let collapseStyle : React.CSSProperties = collapsed && orientation !== 'vertical' ? {maxWidth: 'calc(100% + 1px)', overflow: 'hidden', visibility: 'hidden', position: 'absolute'} : {maxWidth: 'calc(100% + 1px)'};\n let stylePropsFinal = orientation === 'vertical' ? styleProps : {style: collapseStyle};\n\n if (collapsed && orientation !== 'vertical') {\n tabListProps['aria-hidden'] = true;\n }\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n\n const tabContent = (\n <div\n {...stylePropsFinal}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n <TabPicker {...props} {...tabProps} visible={collapsed} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} />\n {tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: TabListState<T>,\n className?: string,\n visible: boolean\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id,\n visible\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 const style : React.CSSProperties = visible ? {} : {visibility: 'hidden', position: 'absolute'};\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 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}\n style={style}\n aria-hidden={visible ? undefined : true}>\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={!visible || isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}\n UNSAFE_className={classNames(styles, 'spectrum-Tabs-picker')}>\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","/*\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"],"names":[],"version":3,"file":"main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"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","/*\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} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {\n Key,\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\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, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapsed: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n },\n tabLineState: Array<DOMRect>\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\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\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapsed, setCollapsed] = useState(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n let [tabPositions, setTabPositions] = useState([]);\n let prevTabPositions = useRef(tabPositions);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.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, tabListState?.selectedKey, collapsed, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n if (wrapperRef.current && orientation !== 'vertical') {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let tabDimensions = [...tabs].map(tab => tab.getBoundingClientRect());\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = tabDimensions[tabDimensions.length - 1][end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n setCollapsed(shouldCollapse);\n if (tabDimensions.length !== prevTabPositions.current.length || tabDimensions.some((box, index) => box?.left !== prevTabPositions.current[index]?.left || box?.right !== prevTabPositions.current[index]?.right)) {\n setTabPositions(tabDimensions);\n prevTabPositions.current = tabDimensions;\n }\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapsed, prevTabPositions, setTabPositions]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapsed && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapsed},\n refs: {tablistRef, wrapperRef},\n tabPanelProps,\n tabLineState: tabPositions\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: TabListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state} = props;\n let {key, rendered} = item;\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps, isSelected, isDisabled} = useTab({key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\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\n// @private\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 {direction} = useLocale();\n let {scale} = useProvider();\n let {tabLineState} = useContext(TabContext);\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\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}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, scale, selectedKey, tabLineState]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapsed, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n\n let collapseStyle : React.CSSProperties = collapsed && orientation !== 'vertical' ? {maxWidth: 'calc(100% + 1px)', overflow: 'hidden', visibility: 'hidden', position: 'absolute'} : {maxWidth: 'calc(100% + 1px)'};\n let stylePropsFinal = orientation === 'vertical' ? styleProps : {style: collapseStyle};\n\n if (collapsed && orientation !== 'vertical') {\n tabListProps['aria-hidden'] = true;\n }\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n\n const tabContent = (\n <div\n {...stylePropsFinal}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n <TabPicker {...props} {...tabProps} visible={collapsed} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} />\n {tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = useCallback(nodes => new ListCollection(nodes), []);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: TabListState<T>,\n className?: string,\n visible: boolean\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id,\n visible\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 const style : React.CSSProperties = visible ? {} : {visibility: 'hidden', position: 'absolute'};\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 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}\n style={style}\n aria-hidden={visible ? undefined : true}>\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={!visible || isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}\n UNSAFE_className={classNames(styles, 'spectrum-Tabs-picker')}>\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","/*\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"],"names":[],"version":3,"file":"main.js.map"}
package/dist/module.js CHANGED
@@ -381,7 +381,7 @@ function $65ab70ddbed1564b$export$e51a686c67fdaa2d(props) {
381
381
  function $65ab70ddbed1564b$export$5dae8d435677f210(props) {
382
382
  const { tabState: tabState , tabProps: tabProps } = (0, $cLzzU$useContext)($65ab70ddbed1564b$var$TabContext);
383
383
  const { tabListState: tabListState } = tabState;
384
- const factory = (nodes)=>new (0, $cLzzU$ListCollection)(nodes);
384
+ const factory = (0, $cLzzU$useCallback)((nodes)=>new (0, $cLzzU$ListCollection)(nodes), []);
385
385
  const collection = (0, $cLzzU$useCollection)({
386
386
  items: tabProps.items,
387
387
  ...props
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"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","/*\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} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {\n Key,\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\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, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapsed: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n },\n tabLineState: Array<DOMRect>\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\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\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapsed, setCollapsed] = useState(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n let [tabPositions, setTabPositions] = useState([]);\n let prevTabPositions = useRef(tabPositions);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.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, tabListState?.selectedKey, collapsed, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n if (wrapperRef.current && orientation !== 'vertical') {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let tabDimensions = [...tabs].map(tab => tab.getBoundingClientRect());\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = tabDimensions[tabDimensions.length - 1][end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n setCollapsed(shouldCollapse);\n if (tabDimensions.length !== prevTabPositions.current.length || tabDimensions.some((box, index) => box?.left !== prevTabPositions.current[index]?.left || box?.right !== prevTabPositions.current[index]?.right)) {\n setTabPositions(tabDimensions);\n prevTabPositions.current = tabDimensions;\n }\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapsed, prevTabPositions, setTabPositions]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapsed && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapsed},\n refs: {tablistRef, wrapperRef},\n tabPanelProps,\n tabLineState: tabPositions\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: TabListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state} = props;\n let {key, rendered} = item;\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps, isSelected, isDisabled} = useTab({key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\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\n// @private\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 {direction} = useLocale();\n let {scale} = useProvider();\n let {tabLineState} = useContext(TabContext);\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\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}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, scale, selectedKey, tabLineState]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapsed, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n\n let collapseStyle : React.CSSProperties = collapsed && orientation !== 'vertical' ? {maxWidth: 'calc(100% + 1px)', overflow: 'hidden', visibility: 'hidden', position: 'absolute'} : {maxWidth: 'calc(100% + 1px)'};\n let stylePropsFinal = orientation === 'vertical' ? styleProps : {style: collapseStyle};\n\n if (collapsed && orientation !== 'vertical') {\n tabListProps['aria-hidden'] = true;\n }\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n\n const tabContent = (\n <div\n {...stylePropsFinal}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n <TabPicker {...props} {...tabProps} visible={collapsed} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} />\n {tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = nodes => new ListCollection(nodes);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: TabListState<T>,\n className?: string,\n visible: boolean\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id,\n visible\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 const style : React.CSSProperties = visible ? {} : {visibility: 'hidden', position: 'absolute'};\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 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}\n style={style}\n aria-hidden={visible ? undefined : true}>\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={!visible || isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}\n UNSAFE_className={classNames(styles, 'spectrum-Tabs-picker')}>\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","/*\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"],"names":[],"version":3,"file":"module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/tabs/src/index.ts","packages/@react-spectrum/tabs/src/Tabs.tsx","packages/@adobe/spectrum-css-temp/components/tabs/vars.css"],"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","/*\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} from '@react-spectrum/utils';\nimport {DOMProps, DOMRef, Node, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '@react-aria/utils';\nimport {FocusRing} from '@react-aria/focus';\nimport {Item, Picker} from '@react-spectrum/picker';\nimport {ListCollection} from '@react-stately/list';\nimport {mergeProps, useId, useLayoutEffect} from '@react-aria/utils';\nimport React, {\n Key,\n MutableRefObject,\n ReactElement,\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\nimport {SpectrumPickerProps} from '@react-types/select';\nimport {SpectrumTabListProps, SpectrumTabPanelsProps, SpectrumTabsProps} from '@react-types/tabs';\nimport styles from '@adobe/spectrum-css-temp/components/tabs/vars.css';\nimport {TabListState, useTabListState} from '@react-stately/tabs';\nimport {Text} from '@react-spectrum/text';\nimport {useCollection} from '@react-stately/collections';\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, useTabList, useTabPanel} from '@react-aria/tabs';\n\ninterface TabsContext<T> {\n tabProps: SpectrumTabsProps<T>,\n tabState: {\n tabListState: TabListState<T>,\n setTabListState: (state: TabListState<T>) => void,\n selectedTab: HTMLElement,\n collapsed: boolean\n },\n refs: {\n wrapperRef: MutableRefObject<HTMLDivElement>,\n tablistRef: MutableRefObject<HTMLDivElement>\n },\n tabPanelProps: {\n 'aria-labelledby': string\n },\n tabLineState: Array<DOMRect>\n}\n\nconst TabContext = React.createContext<TabsContext<any>>(null);\n\nfunction Tabs<T extends object>(props: SpectrumTabsProps<T>, ref: DOMRef<HTMLDivElement>) {\n props = useProviderProps(props);\n let {\n orientation = 'horizontal' as Orientation,\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\n let {direction} = useLocale();\n let {styleProps} = useStyleProps(otherProps);\n let [collapsed, setCollapsed] = useState(false);\n let [selectedTab, setSelectedTab] = useState<HTMLElement>();\n const [tabListState, setTabListState] = useState<TabListState<T>>(null);\n let [tabPositions, setTabPositions] = useState([]);\n let prevTabPositions = useRef(tabPositions);\n\n useEffect(() => {\n if (tablistRef.current) {\n let selectedTab: HTMLElement = tablistRef.current.querySelector(`[data-key=\"${tabListState?.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, tabListState?.selectedKey, collapsed, tablistRef]);\n\n let checkShouldCollapse = useCallback(() => {\n if (wrapperRef.current && orientation !== 'vertical') {\n let tabsComponent = wrapperRef.current;\n let tabs = tablistRef.current.querySelectorAll('[role=\"tab\"]');\n let tabDimensions = [...tabs].map(tab => tab.getBoundingClientRect());\n\n let end = direction === 'rtl' ? 'left' : 'right';\n let farEdgeTabList = tabsComponent.getBoundingClientRect()[end];\n let farEdgeLastTab = tabDimensions[tabDimensions.length - 1][end];\n let shouldCollapse = direction === 'rtl' ? farEdgeLastTab < farEdgeTabList : farEdgeTabList < farEdgeLastTab;\n setCollapsed(shouldCollapse);\n if (tabDimensions.length !== prevTabPositions.current.length || tabDimensions.some((box, index) => box?.left !== prevTabPositions.current[index]?.left || box?.right !== prevTabPositions.current[index]?.right)) {\n setTabPositions(tabDimensions);\n prevTabPositions.current = tabDimensions;\n }\n }\n }, [tablistRef, wrapperRef, direction, orientation, setCollapsed, prevTabPositions, setTabPositions]);\n\n useEffect(() => {\n checkShouldCollapse();\n }, [children, checkShouldCollapse]);\n\n useResizeObserver({ref: wrapperRef, onResize: checkShouldCollapse});\n\n let tabPanelProps = {\n 'aria-labelledby': undefined\n };\n\n // When the tabs are collapsed, the tabPanel should be labelled by the Picker button element.\n let collapsibleTabListId = useId();\n if (collapsed && orientation !== 'vertical') {\n tabPanelProps['aria-labelledby'] = collapsibleTabListId;\n }\n return (\n <TabContext.Provider\n value={{\n tabProps: {...props, orientation, density},\n tabState: {tabListState, setTabListState, selectedTab, collapsed},\n refs: {tablistRef, wrapperRef},\n tabPanelProps,\n tabLineState: tabPositions\n }}>\n <div\n {...filterDOMProps(otherProps)}\n {...styleProps}\n ref={domRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel',\n `spectrum-TabsPanel--${orientation}`,\n styleProps.className\n )}>\n {props.children}\n </div>\n </TabContext.Provider>\n );\n}\n\ninterface TabProps<T> extends DOMProps {\n item: Node<T>,\n state: TabListState<T>,\n isDisabled?: boolean,\n orientation?: Orientation\n}\n\n// @private\nfunction Tab<T>(props: TabProps<T>) {\n let {item, state} = props;\n let {key, rendered} = item;\n\n let ref = useRef<HTMLDivElement>();\n let {tabProps, isSelected, isDisabled} = useTab({key}, state, ref);\n\n let {hoverProps, isHovered} = useHover({\n ...props\n });\n let domProps = filterDOMProps(item.props);\n delete domProps.id;\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div\n {...mergeProps(tabProps, hoverProps, domProps)}\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\n// @private\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 {direction} = useLocale();\n let {scale} = useProvider();\n let {tabLineState} = useContext(TabContext);\n\n let [style, setStyle] = useState({\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\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}px)`\n : `translateX(${offset}px)`;\n\n if (orientation === 'horizontal') {\n styleObj.width = `${selectedTab.offsetWidth}px`;\n } else {\n styleObj.height = `${selectedTab.offsetHeight}px`;\n }\n setStyle(styleObj);\n }\n }, [direction, setStyle, selectedTab, orientation]);\n\n useLayoutEffect(() => {\n onResize();\n }, [onResize, scale, selectedKey, tabLineState]);\n\n return <div className={classNames(styles, 'spectrum-Tabs-selectionIndicator')} role=\"presentation\" style={style} />;\n}\n\n/**\n * A TabList is used within Tabs to group tabs that a user can switch between.\n * The keys of the items within the <TabList> must match up with a corresponding item inside the <TabPanels>.\n */\nexport function TabList<T>(props: SpectrumTabListProps<T>) {\n const tabContext = useContext(TabContext);\n const {refs, tabState, tabProps, tabPanelProps} = tabContext;\n const {isQuiet, density, isEmphasized, orientation} = tabProps;\n const {selectedTab, collapsed, setTabListState} = tabState;\n const {tablistRef, wrapperRef} = refs;\n // Pass original Tab props but override children to create the collection.\n const state = useTabListState({...tabProps, children: props.children});\n\n let {styleProps} = useStyleProps(props);\n const {tabListProps} = useTabList({...tabProps, ...props}, state, tablistRef);\n\n useEffect(() => {\n // Passing back to root as useTabPanel needs the TabListState\n setTabListState(state);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [state.disabledKeys, state.selectedItem, state.selectedKey, props.children]);\n\n let collapseStyle : React.CSSProperties = collapsed && orientation !== 'vertical' ? {maxWidth: 'calc(100% + 1px)', overflow: 'hidden', visibility: 'hidden', position: 'absolute'} : {maxWidth: 'calc(100% + 1px)'};\n let stylePropsFinal = orientation === 'vertical' ? styleProps : {style: collapseStyle};\n\n if (collapsed && orientation !== 'vertical') {\n tabListProps['aria-hidden'] = true;\n }\n\n let tabListclassName = classNames(styles, 'spectrum-TabsPanel-tabs');\n\n const tabContent = (\n <div\n {...stylePropsFinal}\n {...tabListProps}\n ref={tablistRef}\n className={classNames(\n styles,\n 'spectrum-Tabs',\n `spectrum-Tabs--${orientation}`,\n tabListclassName,\n {\n 'spectrum-Tabs--quiet': isQuiet,\n 'spectrum-Tabs--emphasized': isEmphasized,\n ['spectrum-Tabs--compact']: density === 'compact'\n },\n orientation === 'vertical' && styleProps.className\n )\n }>\n {[...state.collection].map((item) => (\n <Tab key={item.key} item={item} state={state} orientation={orientation} />\n ))}\n <TabLine orientation={orientation} selectedTab={selectedTab} />\n </div>\n );\n\n\n if (orientation === 'vertical') {\n return tabContent;\n } else {\n return (\n <div\n {...styleProps}\n ref={wrapperRef}\n className={classNames(\n styles,\n 'spectrum-TabsPanel-collapseWrapper',\n styleProps.className\n )}>\n <TabPicker {...props} {...tabProps} visible={collapsed} id={tabPanelProps['aria-labelledby']} state={state} className={tabListclassName} />\n {tabContent}\n </div>\n );\n }\n}\n\n/**\n * TabPanels is used within Tabs as a container for the content of each tab.\n * The keys of the items within the <TabPanels> must match up with a corresponding item inside the <TabList>.\n */\nexport function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabProps} = useContext(TabContext);\n const {tabListState} = tabState;\n\n const factory = useCallback(nodes => new ListCollection(nodes), []);\n const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});\n const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;\n\n return (\n <TabPanel {...props} key={tabListState?.selectedKey}>\n {selectedItem && selectedItem.props.children}\n </TabPanel>\n );\n}\n\n// @private\nfunction TabPanel<T>(props: SpectrumTabPanelsProps<T>) {\n const {tabState, tabPanelProps: ctxTabPanelProps} = useContext(TabContext);\n const {tabListState} = tabState;\n let ref = useRef();\n const {tabPanelProps} = useTabPanel(props, tabListState, ref);\n let {styleProps} = useStyleProps(props);\n\n if (ctxTabPanelProps['aria-labelledby']) {\n tabPanelProps['aria-labelledby'] = ctxTabPanelProps['aria-labelledby'];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n <div {...styleProps} {...tabPanelProps} ref={ref} className={classNames(styles, 'spectrum-TabsPanel-tabpanel', styleProps.className)}>\n {props.children}\n </div>\n </FocusRing>\n );\n}\n\ninterface TabPickerProps<T> extends Omit<SpectrumPickerProps<T>, 'children'> {\n density?: 'compact' | 'regular',\n isEmphasized?: boolean,\n state: TabListState<T>,\n className?: string,\n visible: boolean\n}\n\nfunction TabPicker<T>(props: TabPickerProps<T>) {\n let {\n isDisabled,\n isEmphasized,\n isQuiet,\n state,\n 'aria-labelledby': ariaLabeledBy,\n 'aria-label': ariaLabel,\n density,\n className,\n id,\n visible\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 const style : React.CSSProperties = visible ? {} : {visibility: 'hidden', position: 'absolute'};\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 'spectrum-Tabs--emphasized': isEmphasized\n },\n className\n )}\n style={style}\n aria-hidden={visible ? undefined : true}>\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={!visible || isDisabled}\n selectedKey={state.selectedKey}\n disabledKeys={state.disabledKeys}\n onSelectionChange={state.setSelectedKey}\n UNSAFE_className={classNames(styles, 'spectrum-Tabs-picker')}>\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","/*\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"],"names":[],"version":3,"file":"module.js.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-spectrum/tabs",
3
- "version": "3.5.3-nightly.3843+f6e686fe9",
3
+ "version": "3.5.3-nightly.3847+76932d319",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,27 +36,27 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/focus": "3.0.0-nightly.2141+f6e686fe9",
40
- "@react-aria/i18n": "3.0.0-nightly.2141+f6e686fe9",
41
- "@react-aria/interactions": "3.0.0-nightly.2141+f6e686fe9",
42
- "@react-aria/tabs": "3.5.1-nightly.3843+f6e686fe9",
43
- "@react-aria/utils": "3.0.0-nightly.2141+f6e686fe9",
44
- "@react-spectrum/button": "3.0.0-nightly.2141+f6e686fe9",
45
- "@react-spectrum/menu": "3.11.1-nightly.3843+f6e686fe9",
46
- "@react-spectrum/picker": "3.10.3-nightly.3843+f6e686fe9",
47
- "@react-spectrum/text": "3.4.2-nightly.3843+f6e686fe9",
48
- "@react-spectrum/utils": "3.0.0-nightly.2141+f6e686fe9",
49
- "@react-stately/collections": "3.0.0-nightly.2141+f6e686fe9",
50
- "@react-stately/list": "3.8.1-nightly.3843+f6e686fe9",
51
- "@react-stately/tabs": "3.0.0-nightly.2141+f6e686fe9",
52
- "@react-types/select": "3.8.1-nightly.3843+f6e686fe9",
53
- "@react-types/shared": "3.0.0-nightly.2141+f6e686fe9",
54
- "@react-types/tabs": "3.2.2-nightly.3843+f6e686fe9",
55
- "@spectrum-icons/workflow": "3.0.0-nightly.2141+f6e686fe9",
39
+ "@react-aria/focus": "3.0.0-nightly.2145+76932d319",
40
+ "@react-aria/i18n": "3.0.0-nightly.2145+76932d319",
41
+ "@react-aria/interactions": "3.0.0-nightly.2145+76932d319",
42
+ "@react-aria/tabs": "3.5.1-nightly.3847+76932d319",
43
+ "@react-aria/utils": "3.0.0-nightly.2145+76932d319",
44
+ "@react-spectrum/button": "3.0.0-nightly.2145+76932d319",
45
+ "@react-spectrum/menu": "3.11.1-nightly.3847+76932d319",
46
+ "@react-spectrum/picker": "3.10.3-nightly.3847+76932d319",
47
+ "@react-spectrum/text": "3.4.2-nightly.3847+76932d319",
48
+ "@react-spectrum/utils": "3.0.0-nightly.2145+76932d319",
49
+ "@react-stately/collections": "3.0.0-nightly.2145+76932d319",
50
+ "@react-stately/list": "3.8.1-nightly.3847+76932d319",
51
+ "@react-stately/tabs": "3.0.0-nightly.2145+76932d319",
52
+ "@react-types/select": "3.8.1-nightly.3847+76932d319",
53
+ "@react-types/shared": "3.0.0-nightly.2145+76932d319",
54
+ "@react-types/tabs": "3.2.2-nightly.3847+76932d319",
55
+ "@spectrum-icons/workflow": "3.0.0-nightly.2145+76932d319",
56
56
  "@swc/helpers": "^0.4.14"
57
57
  },
58
58
  "devDependencies": {
59
- "@adobe/spectrum-css-temp": "3.0.0-nightly.2141+f6e686fe9"
59
+ "@adobe/spectrum-css-temp": "3.0.0-nightly.2145+76932d319"
60
60
  },
61
61
  "peerDependencies": {
62
62
  "@react-spectrum/provider": "^3.0.0",
@@ -66,5 +66,5 @@
66
66
  "publishConfig": {
67
67
  "access": "public"
68
68
  },
69
- "gitHead": "f6e686fe9d3b983d48650980c1ecfdde320bc62f"
69
+ "gitHead": "76932d319e22640720934f8823ea8acdc28bcc80"
70
70
  }
package/src/Tabs.tsx CHANGED
@@ -337,7 +337,7 @@ export function TabPanels<T>(props: SpectrumTabPanelsProps<T>) {
337
337
  const {tabState, tabProps} = useContext(TabContext);
338
338
  const {tabListState} = tabState;
339
339
 
340
- const factory = nodes => new ListCollection(nodes);
340
+ const factory = useCallback(nodes => new ListCollection(nodes), []);
341
341
  const collection = useCollection({items: tabProps.items, ...props}, factory, {suppressTextValueWarning: true});
342
342
  const selectedItem = tabListState ? collection.getItem(tabListState.selectedKey) : null;
343
343