@react-spectrum/s2 3.0.0-nightly-4b8b33a02-250211 → 3.0.0-nightly-260eb700f-250213
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/Accordion.cjs +3 -3
- package/dist/Accordion.cjs.map +1 -1
- package/dist/Accordion.css +2 -2
- package/dist/Accordion.css.map +1 -1
- package/dist/Accordion.mjs +3 -3
- package/dist/Accordion.mjs.map +1 -1
- package/dist/ActionBar.cjs +47 -47
- package/dist/ActionBar.css +51 -51
- package/dist/ActionBar.mjs +47 -47
- package/dist/ActionButton.cjs +97 -97
- package/dist/ActionButton.cjs.map +1 -1
- package/dist/ActionButton.css +96 -96
- package/dist/ActionButton.css.map +1 -1
- package/dist/ActionButton.mjs +97 -97
- package/dist/ActionButton.mjs.map +1 -1
- package/dist/ActionButtonGroup.cjs +11 -11
- package/dist/ActionButtonGroup.css +9 -9
- package/dist/ActionButtonGroup.mjs +11 -11
- package/dist/ActionMenu.cjs.map +1 -1
- package/dist/ActionMenu.mjs.map +1 -1
- package/dist/AlertDialog.cjs +3 -3
- package/dist/AlertDialog.css +3 -3
- package/dist/AlertDialog.mjs +3 -3
- package/dist/Avatar.cjs +17 -17
- package/dist/Avatar.cjs.map +1 -1
- package/dist/Avatar.css +14 -14
- package/dist/Avatar.css.map +1 -1
- package/dist/Avatar.mjs +17 -17
- package/dist/Avatar.mjs.map +1 -1
- package/dist/AvatarGroup.cjs +100 -100
- package/dist/AvatarGroup.cjs.map +1 -1
- package/dist/AvatarGroup.css +34 -34
- package/dist/AvatarGroup.css.map +1 -1
- package/dist/AvatarGroup.mjs +100 -100
- package/dist/AvatarGroup.mjs.map +1 -1
- package/dist/Badge.cjs +68 -92
- package/dist/Badge.cjs.map +1 -1
- package/dist/Badge.css +92 -164
- package/dist/Badge.css.map +1 -1
- package/dist/Badge.mjs +68 -92
- package/dist/Badge.mjs.map +1 -1
- package/dist/Breadcrumbs.cjs +115 -115
- package/dist/Breadcrumbs.cjs.map +1 -1
- package/dist/Breadcrumbs.css +89 -89
- package/dist/Breadcrumbs.css.map +1 -1
- package/dist/Breadcrumbs.mjs +115 -115
- package/dist/Breadcrumbs.mjs.map +1 -1
- package/dist/Button.cjs +152 -236
- package/dist/Button.cjs.map +1 -1
- package/dist/Button.css +165 -309
- package/dist/Button.css.map +1 -1
- package/dist/Button.mjs +152 -236
- package/dist/Button.mjs.map +1 -1
- package/dist/ButtonGroup.cjs +19 -19
- package/dist/ButtonGroup.cjs.map +1 -1
- package/dist/ButtonGroup.css +15 -15
- package/dist/ButtonGroup.css.map +1 -1
- package/dist/ButtonGroup.mjs +19 -19
- package/dist/ButtonGroup.mjs.map +1 -1
- package/dist/Card.cjs +261 -264
- package/dist/Card.cjs.map +1 -1
- package/dist/Card.css +198 -210
- package/dist/Card.css.map +1 -1
- package/dist/Card.mjs +261 -264
- package/dist/Card.mjs.map +1 -1
- package/dist/CardView.cjs +15 -15
- package/dist/CardView.cjs.map +1 -1
- package/dist/CardView.css +18 -18
- package/dist/CardView.css.map +1 -1
- package/dist/CardView.mjs +15 -15
- package/dist/CardView.mjs.map +1 -1
- package/dist/CenterBaseline.cjs +1 -1
- package/dist/CenterBaseline.css +2 -2
- package/dist/CenterBaseline.mjs +1 -1
- package/dist/Checkbox.cjs +73 -124
- package/dist/Checkbox.cjs.map +1 -1
- package/dist/Checkbox.css +81 -201
- package/dist/Checkbox.css.map +1 -1
- package/dist/Checkbox.mjs +73 -124
- package/dist/Checkbox.mjs.map +1 -1
- package/dist/CheckboxGroup.cjs +49 -49
- package/dist/CheckboxGroup.cjs.map +1 -1
- package/dist/CheckboxGroup.css +41 -41
- package/dist/CheckboxGroup.css.map +1 -1
- package/dist/CheckboxGroup.mjs +49 -49
- package/dist/CheckboxGroup.mjs.map +1 -1
- package/dist/ClearButton.cjs +15 -15
- package/dist/ClearButton.css +17 -17
- package/dist/ClearButton.mjs +15 -15
- package/dist/CloseButton.cjs +35 -35
- package/dist/CloseButton.cjs.map +1 -1
- package/dist/CloseButton.css +33 -33
- package/dist/CloseButton.css.map +1 -1
- package/dist/CloseButton.mjs +35 -35
- package/dist/CloseButton.mjs.map +1 -1
- package/dist/ColorArea.cjs +22 -22
- package/dist/ColorArea.cjs.map +1 -1
- package/dist/ColorArea.css +15 -15
- package/dist/ColorArea.css.map +1 -1
- package/dist/ColorArea.mjs +22 -22
- package/dist/ColorArea.mjs.map +1 -1
- package/dist/ColorField.cjs +38 -38
- package/dist/ColorField.cjs.map +1 -1
- package/dist/ColorField.css +32 -32
- package/dist/ColorField.css.map +1 -1
- package/dist/ColorField.mjs +38 -38
- package/dist/ColorField.mjs.map +1 -1
- package/dist/ColorHandle.cjs +21 -27
- package/dist/ColorHandle.cjs.map +1 -1
- package/dist/ColorHandle.css +45 -93
- package/dist/ColorHandle.css.map +1 -1
- package/dist/ColorHandle.mjs +21 -27
- package/dist/ColorHandle.mjs.map +1 -1
- package/dist/ColorSlider.cjs +52 -52
- package/dist/ColorSlider.cjs.map +1 -1
- package/dist/ColorSlider.css +51 -51
- package/dist/ColorSlider.css.map +1 -1
- package/dist/ColorSlider.mjs +52 -52
- package/dist/ColorSlider.mjs.map +1 -1
- package/dist/ColorSwatch.cjs +24 -27
- package/dist/ColorSwatch.cjs.map +1 -1
- package/dist/ColorSwatch.css +29 -41
- package/dist/ColorSwatch.css.map +1 -1
- package/dist/ColorSwatch.mjs +24 -27
- package/dist/ColorSwatch.mjs.map +1 -1
- package/dist/ColorSwatchPicker.cjs +23 -23
- package/dist/ColorSwatchPicker.css +48 -60
- package/dist/ColorSwatchPicker.css.map +1 -1
- package/dist/ColorSwatchPicker.mjs +23 -23
- package/dist/ColorWheel.cjs +22 -22
- package/dist/ColorWheel.cjs.map +1 -1
- package/dist/ColorWheel.css +16 -16
- package/dist/ColorWheel.css.map +1 -1
- package/dist/ColorWheel.mjs +22 -22
- package/dist/ColorWheel.mjs.map +1 -1
- package/dist/ComboBox.cjs +80 -80
- package/dist/ComboBox.css +88 -88
- package/dist/ComboBox.mjs +80 -80
- package/dist/Content.cjs.map +1 -1
- package/dist/Content.mjs.map +1 -1
- package/dist/ContextualHelp.cjs +5 -5
- package/dist/ContextualHelp.cjs.map +1 -1
- package/dist/ContextualHelp.css +38 -38
- package/dist/ContextualHelp.css.map +1 -1
- package/dist/ContextualHelp.mjs +5 -5
- package/dist/ContextualHelp.mjs.map +1 -1
- package/dist/CustomDialog.cjs +31 -31
- package/dist/CustomDialog.css +25 -25
- package/dist/CustomDialog.mjs +31 -31
- package/dist/Dialog.cjs +17 -17
- package/dist/Dialog.css +64 -64
- package/dist/Dialog.mjs +17 -17
- package/dist/Disclosure.cjs +108 -111
- package/dist/Disclosure.cjs.map +1 -1
- package/dist/Disclosure.css +112 -124
- package/dist/Disclosure.css.map +1 -1
- package/dist/Disclosure.mjs +108 -111
- package/dist/Disclosure.mjs.map +1 -1
- package/dist/Divider.cjs +26 -26
- package/dist/Divider.cjs.map +1 -1
- package/dist/Divider.css +16 -16
- package/dist/Divider.css.map +1 -1
- package/dist/Divider.mjs +26 -26
- package/dist/Divider.mjs.map +1 -1
- package/dist/DropZone.cjs +47 -56
- package/dist/DropZone.cjs.map +1 -1
- package/dist/DropZone.css +56 -80
- package/dist/DropZone.css.map +1 -1
- package/dist/DropZone.mjs +47 -56
- package/dist/DropZone.mjs.map +1 -1
- package/dist/Field.cjs +150 -204
- package/dist/Field.cjs.map +1 -1
- package/dist/Field.css +150 -246
- package/dist/Field.css.map +1 -1
- package/dist/Field.mjs +150 -204
- package/dist/Field.mjs.map +1 -1
- package/dist/Form.cjs +10 -10
- package/dist/Form.cjs.map +1 -1
- package/dist/Form.css +9 -9
- package/dist/Form.css.map +1 -1
- package/dist/Form.mjs +10 -10
- package/dist/Form.mjs.map +1 -1
- package/dist/FullscreenDialog.cjs +5 -5
- package/dist/FullscreenDialog.css +72 -72
- package/dist/FullscreenDialog.mjs +5 -5
- package/dist/IllustratedMessage.cjs +134 -134
- package/dist/IllustratedMessage.cjs.map +1 -1
- package/dist/IllustratedMessage.css +69 -69
- package/dist/IllustratedMessage.css.map +1 -1
- package/dist/IllustratedMessage.mjs +134 -134
- package/dist/IllustratedMessage.mjs.map +1 -1
- package/dist/Image.cjs +12 -12
- package/dist/Image.cjs.map +1 -1
- package/dist/Image.css +13 -13
- package/dist/Image.css.map +1 -1
- package/dist/Image.mjs +12 -12
- package/dist/Image.mjs.map +1 -1
- package/dist/InlineAlert.cjs +77 -104
- package/dist/InlineAlert.cjs.map +1 -1
- package/dist/InlineAlert.css +77 -149
- package/dist/InlineAlert.css.map +1 -1
- package/dist/InlineAlert.mjs +77 -104
- package/dist/InlineAlert.mjs.map +1 -1
- package/dist/Link.cjs +31 -31
- package/dist/Link.cjs.map +1 -1
- package/dist/Link.css +30 -30
- package/dist/Link.css.map +1 -1
- package/dist/Link.mjs +31 -31
- package/dist/Link.mjs.map +1 -1
- package/dist/Menu.cjs +269 -268
- package/dist/Menu.cjs.map +1 -1
- package/dist/Menu.css +158 -154
- package/dist/Menu.css.map +1 -1
- package/dist/Menu.mjs +269 -268
- package/dist/Menu.mjs.map +1 -1
- package/dist/Meter.cjs +85 -85
- package/dist/Meter.cjs.map +1 -1
- package/dist/Meter.css +81 -81
- package/dist/Meter.css.map +1 -1
- package/dist/Meter.mjs +85 -85
- package/dist/Meter.mjs.map +1 -1
- package/dist/Modal.cjs +48 -48
- package/dist/Modal.css +46 -46
- package/dist/Modal.mjs +48 -48
- package/dist/NumberField.cjs +115 -115
- package/dist/NumberField.cjs.map +1 -1
- package/dist/NumberField.css +114 -114
- package/dist/NumberField.css.map +1 -1
- package/dist/NumberField.mjs +115 -115
- package/dist/NumberField.mjs.map +1 -1
- package/dist/Picker.cjs +177 -194
- package/dist/Picker.cjs.map +1 -1
- package/dist/Picker.css +167 -223
- package/dist/Picker.css.map +1 -1
- package/dist/Picker.mjs +177 -194
- package/dist/Picker.mjs.map +1 -1
- package/dist/Popover.cjs +79 -85
- package/dist/Popover.cjs.map +1 -1
- package/dist/Popover.css +65 -89
- package/dist/Popover.css.map +1 -1
- package/dist/Popover.mjs +79 -85
- package/dist/Popover.mjs.map +1 -1
- package/dist/ProgressBar.cjs +98 -98
- package/dist/ProgressBar.cjs.map +1 -1
- package/dist/ProgressBar.css +92 -92
- package/dist/ProgressBar.css.map +1 -1
- package/dist/ProgressBar.mjs +98 -98
- package/dist/ProgressBar.mjs.map +1 -1
- package/dist/ProgressCircle.cjs +17 -17
- package/dist/ProgressCircle.cjs.map +1 -1
- package/dist/ProgressCircle.css +15 -15
- package/dist/ProgressCircle.css.map +1 -1
- package/dist/ProgressCircle.mjs +17 -17
- package/dist/ProgressCircle.mjs.map +1 -1
- package/dist/Provider.cjs +4 -4
- package/dist/Provider.css +5 -5
- package/dist/Provider.mjs +4 -4
- package/dist/Radio.cjs +80 -152
- package/dist/Radio.cjs.map +1 -1
- package/dist/Radio.css +96 -240
- package/dist/Radio.css.map +1 -1
- package/dist/Radio.mjs +80 -152
- package/dist/Radio.mjs.map +1 -1
- package/dist/RadioGroup.cjs +47 -47
- package/dist/RadioGroup.cjs.map +1 -1
- package/dist/RadioGroup.css +41 -41
- package/dist/RadioGroup.css.map +1 -1
- package/dist/RadioGroup.mjs +47 -47
- package/dist/RadioGroup.mjs.map +1 -1
- package/dist/RangeSlider.cjs.map +1 -1
- package/dist/RangeSlider.mjs.map +1 -1
- package/dist/SearchField.cjs +42 -42
- package/dist/SearchField.cjs.map +1 -1
- package/dist/SearchField.css +47 -47
- package/dist/SearchField.css.map +1 -1
- package/dist/SearchField.mjs +42 -42
- package/dist/SearchField.mjs.map +1 -1
- package/dist/SegmentedControl.cjs +89 -101
- package/dist/SegmentedControl.cjs.map +1 -1
- package/dist/SegmentedControl.css +92 -140
- package/dist/SegmentedControl.css.map +1 -1
- package/dist/SegmentedControl.mjs +89 -101
- package/dist/SegmentedControl.mjs.map +1 -1
- package/dist/Slider.cjs +196 -229
- package/dist/Slider.cjs.map +1 -1
- package/dist/Slider.css +149 -221
- package/dist/Slider.css.map +1 -1
- package/dist/Slider.mjs +196 -229
- package/dist/Slider.mjs.map +1 -1
- package/dist/StatusLight.cjs +56 -56
- package/dist/StatusLight.cjs.map +1 -1
- package/dist/StatusLight.css +59 -59
- package/dist/StatusLight.css.map +1 -1
- package/dist/StatusLight.mjs +56 -56
- package/dist/StatusLight.mjs.map +1 -1
- package/dist/Switch.cjs +74 -107
- package/dist/Switch.cjs.map +1 -1
- package/dist/Switch.css +69 -141
- package/dist/Switch.css.map +1 -1
- package/dist/Switch.mjs +74 -107
- package/dist/Switch.mjs.map +1 -1
- package/dist/TableView.cjs +253 -280
- package/dist/TableView.cjs.map +1 -1
- package/dist/TableView.css +163 -199
- package/dist/TableView.css.map +1 -1
- package/dist/TableView.mjs +253 -280
- package/dist/TableView.mjs.map +1 -1
- package/dist/Tabs.cjs +112 -124
- package/dist/Tabs.cjs.map +1 -1
- package/dist/Tabs.css +84 -108
- package/dist/Tabs.css.map +1 -1
- package/dist/Tabs.mjs +112 -124
- package/dist/Tabs.mjs.map +1 -1
- package/dist/TabsPicker.cjs +105 -105
- package/dist/TabsPicker.css +111 -111
- package/dist/TabsPicker.mjs +105 -105
- package/dist/TagGroup.cjs +148 -148
- package/dist/TagGroup.cjs.map +1 -1
- package/dist/TagGroup.css +134 -134
- package/dist/TagGroup.css.map +1 -1
- package/dist/TagGroup.mjs +148 -148
- package/dist/TagGroup.mjs.map +1 -1
- package/dist/TextField.cjs +59 -59
- package/dist/TextField.cjs.map +1 -1
- package/dist/TextField.css +62 -62
- package/dist/TextField.css.map +1 -1
- package/dist/TextField.mjs +59 -59
- package/dist/TextField.mjs.map +1 -1
- package/dist/ToggleButton.cjs +3 -3
- package/dist/ToggleButton.cjs.map +1 -1
- package/dist/ToggleButton.css +12 -12
- package/dist/ToggleButton.css.map +1 -1
- package/dist/ToggleButton.mjs +3 -3
- package/dist/ToggleButton.mjs.map +1 -1
- package/dist/ToggleButtonGroup.cjs.map +1 -1
- package/dist/ToggleButtonGroup.mjs.map +1 -1
- package/dist/Tooltip.cjs +57 -60
- package/dist/Tooltip.cjs.map +1 -1
- package/dist/Tooltip.css +71 -83
- package/dist/Tooltip.css.map +1 -1
- package/dist/Tooltip.mjs +57 -60
- package/dist/Tooltip.mjs.map +1 -1
- package/dist/TreeView.cjs +217 -244
- package/dist/TreeView.cjs.map +1 -1
- package/dist/TreeView.css +166 -190
- package/dist/TreeView.css.map +1 -1
- package/dist/TreeView.mjs +220 -244
- package/dist/TreeView.mjs.map +1 -1
- package/dist/main.cjs +1 -0
- package/dist/main.cjs.map +1 -1
- package/dist/module.mjs +2 -2
- package/dist/module.mjs.map +1 -1
- package/dist/types.d.ts +77 -72
- package/dist/types.d.ts.map +1 -1
- package/icons/Icon.cjs.map +1 -1
- package/icons/Icon.mjs.map +1 -1
- package/icons/Skeleton.cjs +2 -2
- package/icons/Skeleton.cjs.map +1 -1
- package/icons/Skeleton.css +5 -5
- package/icons/Skeleton.css.map +1 -1
- package/icons/Skeleton.mjs +2 -2
- package/icons/Skeleton.mjs.map +1 -1
- package/package.json +21 -21
- package/src/Accordion.tsx +1 -1
- package/src/ActionButton.tsx +2 -2
- package/src/ActionMenu.tsx +1 -1
- package/src/Avatar.tsx +1 -1
- package/src/AvatarGroup.tsx +1 -1
- package/src/Breadcrumbs.tsx +4 -4
- package/src/Button.tsx +4 -4
- package/src/ButtonGroup.tsx +1 -1
- package/src/CardView.tsx +1 -1
- package/src/Checkbox.tsx +1 -1
- package/src/CheckboxGroup.tsx +2 -2
- package/src/CloseButton.tsx +1 -1
- package/src/ColorArea.tsx +1 -1
- package/src/ColorField.tsx +1 -1
- package/src/ColorSlider.tsx +1 -1
- package/src/ColorSwatch.tsx +1 -1
- package/src/ColorWheel.tsx +1 -1
- package/src/Content.tsx +7 -7
- package/src/ContextualHelp.tsx +2 -2
- package/src/Disclosure.tsx +1 -1
- package/src/Divider.tsx +1 -1
- package/src/DropZone.tsx +2 -2
- package/src/Field.tsx +1 -1
- package/src/Form.tsx +2 -2
- package/src/Icon.tsx +2 -2
- package/src/IllustratedMessage.tsx +1 -1
- package/src/Image.tsx +1 -1
- package/src/Link.tsx +2 -2
- package/src/Menu.tsx +4 -3
- package/src/Meter.tsx +1 -1
- package/src/NumberField.tsx +1 -1
- package/src/Picker.tsx +2 -1
- package/src/ProgressBar.tsx +1 -1
- package/src/ProgressCircle.tsx +1 -1
- package/src/RadioGroup.tsx +2 -2
- package/src/RangeSlider.tsx +1 -1
- package/src/SearchField.tsx +1 -1
- package/src/SegmentedControl.tsx +2 -2
- package/src/Skeleton.tsx +1 -1
- package/src/Slider.tsx +1 -1
- package/src/StatusLight.tsx +2 -2
- package/src/Switch.tsx +1 -1
- package/src/TableView.tsx +1 -1
- package/src/Tabs.tsx +16 -16
- package/src/TagGroup.tsx +2 -2
- package/src/TextField.tsx +2 -2
- package/src/ToggleButton.tsx +2 -2
- package/src/ToggleButtonGroup.tsx +1 -1
- package/src/Tooltip.tsx +3 -3
- package/src/TreeView.tsx +97 -144
- package/src/index.ts +1 -1
- package/style/__tests__/style-macro.test.js +18 -18
- package/style/dist/spectrum-theme.cjs +10 -20
- package/style/dist/spectrum-theme.cjs.map +1 -1
- package/style/dist/spectrum-theme.mjs +10 -20
- package/style/dist/spectrum-theme.mjs.map +1 -1
- package/style/dist/types.d.ts +0 -4
- package/style/dist/types.d.ts.map +1 -1
- package/style/spectrum-theme.ts +11 -19
package/dist/Tabs.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n TabListProps as AriaTabListProps,\n TabPanel as AriaTabPanel,\n TabPanelProps as AriaTabPanelProps,\n TabProps as AriaTabProps,\n TabsProps as AriaTabsProps,\n ContextValue,\n Group,\n Provider,\n Tab as RACTab,\n TabList as RACTabList,\n Tabs as RACTabs,\n TabListStateContext\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {Collection, DOMRef, DOMRefValue, Key, Node, Orientation, RefObject} from '@react-types/shared';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {createContext, forwardRef, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {focusRing, size, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {Picker, PickerItem} from './TabsPicker';\nimport {Text, TextContext} from './Content';\nimport {useControlledState} from '@react-stately/utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useId, useLabels, useLayoutEffect, useResizeObserver} from '@react-aria/utils';\nimport {useHasTabbableChild} from '@react-aria/focus';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TabsProps extends Omit<AriaTabsProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tabs. */\n children?: ReactNode,\n /**\n * The amount of space between the tabs.\n * @default 'regular'\n */\n density?: 'compact' | 'regular',\n /**\n * Defines if the text within the tabs should be hidden and only the icon should be shown.\n * The text is always visible when the item is collapsed into a picker.\n * @default 'show'\n */\n labelBehavior?: 'show' | 'hide'\n}\n\nexport interface TabProps extends Omit<AriaTabProps, 'children' | 'style' | 'className'>, StyleProps {\n /** The content to display in the tab. */\n children: ReactNode\n}\n\nexport interface TabListProps<T> extends Omit<AriaTabListProps<T>, 'style' | 'className' | 'aria-label' | 'aria-labelledby'>, StyleProps {}\n\nexport interface TabPanelProps extends Omit<AriaTabPanelProps, 'children' | 'style' | 'className'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tab panels. */\n children?: ReactNode\n}\n\nexport const TabsContext = createContext<ContextValue<TabsProps, DOMRefValue<HTMLDivElement>>>(null);\nconst InternalTabsContext = createContext<TabsProps>({});\nconst CollapseContext = createContext({\n showTabs: true,\n menuId: '',\n valueId: ''\n});\n\nconst tabs = style({\n position: 'relative',\n display: 'flex',\n flexShrink: 0,\n font: 'ui',\n flexDirection: {\n orientation: {\n horizontal: 'column'\n }\n }\n}, getAllowedOverrides({height: true}));\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 */\nexport const Tabs = forwardRef(function Tabs(props: TabsProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, TabsContext);\n let {\n density = 'regular',\n isDisabled,\n disabledKeys,\n orientation = 'horizontal',\n labelBehavior = 'show'\n } = props;\n let domRef = useDOMRef(ref);\n let [value, setValue] = useControlledState(props.selectedKey, props.defaultSelectedKey ?? null!, props.onSelectionChange);\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n throw new Error('An aria-label or aria-labelledby prop is required on Tabs for accessibility.');\n }\n\n return (\n <Provider\n values={[\n [InternalTabsContext, {\n density,\n isDisabled,\n orientation,\n disabledKeys,\n selectedKey: value,\n onSelectionChange: setValue,\n labelBehavior,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby']\n }]\n ]}>\n <CollectionBuilder content={props.children}>\n {collection => (\n <CollapsingTabs\n {...props}\n selectedKey={value}\n onSelectionChange={setValue}\n collection={collection}\n containerRef={domRef} />\n )}\n </CollectionBuilder>\n </Provider>\n );\n});\n\nconst tablist = style({\n display: 'flex',\n gap: {\n orientation: {\n horizontal: {\n density: {\n compact: 24,\n regular: 32\n },\n labelBehavior: {\n hide: {\n density: {\n compact: 16,\n regular: 24\n }\n }\n }\n }\n }\n },\n flexDirection: {\n orientation: {\n vertical: 'column'\n }\n },\n paddingEnd: {\n orientation: {\n vertical: 20\n }\n },\n paddingStart: {\n orientation: {\n vertical: 12\n }\n },\n flexShrink: 0,\n flexBasis: '[0%]'\n});\n\nexport function TabList<T extends object>(props: TabListProps<T>) {\n let {showTabs} = useContext(CollapseContext) ?? {};\n\n if (showTabs) {\n return <TabListInner {...props} />;\n }\n}\n\nfunction TabListInner<T extends object>(props: TabListProps<T>) {\n let {density, isDisabled, disabledKeys, orientation, labelBehavior, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy} = useContext(InternalTabsContext) ?? {};\n let state = useContext(TabListStateContext);\n let [selectedTab, setSelectedTab] = useState<HTMLElement | undefined>(undefined);\n let tablistRef = useRef<HTMLDivElement>(null);\n\n useLayoutEffect(() => {\n if (tablistRef?.current) {\n let tab: HTMLElement | null = tablistRef.current.querySelector('[role=tab][data-selected=true]');\n\n if (tab != null) {\n setSelectedTab(tab);\n }\n }\n }, [tablistRef, state?.selectedItem?.key]);\n\n return (\n <div\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({position: 'relative'}, getAllowedOverrides())(null, props.styles)}>\n {orientation === 'vertical' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n <RACTabList\n {...props}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n ref={tablistRef}\n className={renderProps => tablist({...renderProps, labelBehavior, density})} />\n {orientation === 'horizontal' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n </div>\n );\n}\n\ninterface TabLineProps {\n disabledKeys: Iterable<Key> | undefined,\n isDisabled: boolean | undefined,\n selectedTab: HTMLElement | undefined,\n orientation?: Orientation,\n density?: 'compact' | 'regular'\n}\n\nconst selectedIndicator = style({\n position: 'absolute',\n backgroundColor: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n height: {\n orientation: {\n horizontal: '[2px]'\n }\n },\n width: {\n orientation: {\n vertical: '[2px]'\n }\n },\n bottom: {\n orientation: {\n horizontal: 0\n }\n },\n borderStyle: 'none',\n borderRadius: 'full',\n transitionDuration: 130,\n transitionTimingFunction: 'in-out'\n});\n\nfunction TabLine(props: TabLineProps) {\n let {\n disabledKeys,\n isDisabled: isTabsDisabled,\n selectedTab,\n orientation,\n density\n } = props;\n let {direction} = useLocale();\n let state = useContext(TabListStateContext);\n\n // We want to add disabled styling to the selection indicator only if all the Tabs are disabled\n let [isDisabled, setIsDisabled] = useState<boolean>(false);\n useEffect(() => {\n let isDisabled = isTabsDisabled || isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set(null));\n setIsDisabled(isDisabled);\n }, [state?.collection, disabledKeys, isTabsDisabled, setIsDisabled]);\n\n let [style, setStyle] = useState<{transform: string | undefined, width: string | undefined, height: string | undefined}>({\n transform: undefined,\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\n if (selectedTab) {\n let styleObj: { transform: string | undefined, width: string | undefined, height: string | undefined } = {\n transform: undefined,\n width: undefined,\n height: undefined\n };\n\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, state?.selectedItem?.key, density, direction, orientation]);\n\n return (\n <div style={{...style}} className={selectedIndicator({isDisabled, orientation})} />\n );\n}\n\nconst tab = style({\n ...focusRing(),\n display: 'flex',\n color: {\n default: 'neutral-subdued',\n isSelected: 'neutral',\n isHovered: 'neutral-subdued',\n isDisabled: 'disabled',\n forcedColors: {\n isSelected: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'sm',\n gap: 'text-to-visual',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n },\n alignItems: 'center',\n position: 'relative',\n cursor: 'default',\n flexShrink: 0,\n transition: 'default',\n paddingX: {\n labelBehavior: {\n hide: size(6)\n }\n }\n}, getAllowedOverrides());\n\nconst icon = style({\n display: 'block',\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nexport function Tab(props: TabProps) {\n let {density, labelBehavior} = useContext(InternalTabsContext) ?? {};\n\n let contentId = useId();\n let ariaLabelledBy = props['aria-labelledby'] || '';\n return (\n <RACTab\n {...props}\n // @ts-ignore\n originalProps={props}\n aria-labelledby={`${labelBehavior === 'hide' ? contentId : ''} ${ariaLabelledBy}`}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + tab({...renderProps, density, labelBehavior}, props.styles)}>\n {({\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return props.children;\n } else {\n return (\n <Provider\n values={[\n [TextContext, {\n id: contentId,\n styles:\n style({\n order: 1,\n display: {\n labelBehavior: {\n hide: 'none'\n }\n }\n })({labelBehavior})\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: icon\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n );\n }\n }}\n </RACTab>\n );\n}\n\nconst tabPanel = style({\n ...focusRing(),\n display: 'flex',\n marginTop: 4,\n marginX: -4,\n paddingX: 4,\n color: 'gray-800',\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: '[0%]',\n minHeight: 0,\n minWidth: 0,\n overflow: 'auto'\n}, getAllowedOverrides({height: true}));\n\nexport function TabPanel(props: TabPanelProps) {\n let {showTabs} = useContext(CollapseContext);\n let {selectedKey} = useContext(InternalTabsContext);\n if (showTabs) {\n return (\n <AriaTabPanel\n {...props}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className ?? '') + tabPanel(renderProps, props.styles)} />\n );\n }\n\n if (props.id !== selectedKey) {\n return null;\n }\n\n return <CollapsedTabPanel {...props} />;\n}\n\nfunction CollapsedTabPanel(props: TabPanelProps) {\n let {UNSAFE_style, UNSAFE_className = '', ...otherProps} = props;\n let {menuId, valueId} = useContext(CollapseContext);\n let ref = useRef(null);\n let tabIndex = useHasTabbableChild(ref) ? undefined : 0;\n\n return (\n <Group\n {...otherProps}\n ref={ref}\n aria-labelledby={menuId + ' ' + valueId}\n tabIndex={tabIndex}\n style={UNSAFE_style}\n className={renderProps => UNSAFE_className + tabPanel(renderProps, props.styles)} />\n );\n}\n\nfunction isAllTabsDisabled<T>(collection: Collection<Node<T>> | undefined, disabledKeys: Set<Key>) {\n let testKey: Key | null = null;\n if (collection && collection.size > 0) {\n testKey = collection.getFirstKey();\n\n let index = 0;\n while (testKey && index < collection.size) {\n // We have to check if the item in the collection has a key in disabledKeys or has the isDisabled prop set directly on it\n if (!disabledKeys.has(testKey) && !collection.getItem(testKey)?.props?.isDisabled) {\n return false;\n }\n\n testKey = collection.getKeyAfter(testKey);\n index++;\n }\n return true;\n }\n return false;\n}\n\nlet HiddenTabs = function (props: {\n listRef: RefObject<HTMLDivElement | null>,\n items: Array<Node<any>>,\n size?: string,\n density?: 'compact' | 'regular'\n}) {\n let {listRef, items, size, density} = props;\n\n return (\n <div\n // @ts-ignore\n inert=\"true\"\n ref={listRef}\n className={style({\n display: '[inherit]',\n flexDirection: '[inherit]',\n gap: '[inherit]',\n flexWrap: '[inherit]',\n position: 'absolute',\n inset: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-tab\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, density})}>\n {item.props.children({size, density})}\n </div>\n );\n })}\n </div>\n );\n};\n\nlet TabsMenu = (props: {valueId: string, items: Array<Node<any>>, onSelectionChange: TabsProps['onSelectionChange']} & TabsProps) => {\n let {id, items, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, valueId} = props;\n let {density, onSelectionChange, selectedKey, isDisabled, disabledKeys, labelBehavior} = useContext(InternalTabsContext);\n let state = useContext(TabListStateContext);\n let allKeysDisabled = useMemo(() => {\n return isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set());\n }, [state?.collection, disabledKeys]);\n let labelProps = useLabels({\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy\n });\n\n return (\n <div\n className={style({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n }})({density})}>\n <Picker\n id={id}\n valueId={valueId}\n {...labelProps}\n aria-describedby={props['aria-describedby']}\n aria-details={props['aria-details']}\n isDisabled={isDisabled || allKeysDisabled}\n density={density!}\n labelBehavior={labelBehavior}\n items={items}\n disabledKeys={disabledKeys}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}>\n {(item: Node<any>) => {\n return (\n <PickerItem\n {...item.props.originalProps}\n isDisabled={isDisabled || allKeysDisabled}\n key={item.key}>\n {item.props.children({density, isMenu: true})}\n </PickerItem>\n );\n }}\n </Picker>\n </div>\n );\n};\n\nlet CollapsingTabs = ({collection, containerRef, ...props}: {collection: Collection<Node<unknown>>, containerRef: any} & TabsProps) => {\n let {density = 'regular', orientation = 'horizontal', labelBehavior = 'show', onSelectionChange} = props;\n let [showItems, _setShowItems] = useState(true);\n showItems = orientation === 'vertical' ? true : showItems;\n let setShowItems = useCallback((value: boolean) => {\n if (orientation === 'vertical') {\n // if orientation is vertical, we always show the items\n _setShowItems(true);\n } else {\n _setShowItems(value);\n }\n }, [orientation]);\n\n let {direction} = useLocale();\n\n let children = useMemo(() => [...collection], [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useEffectEvent(() => {\n if (orientation === 'vertical' || !listRef.current || !containerRef?.current) {\n return;\n }\n let container = listRef.current;\n let containerRect = container.getBoundingClientRect();\n let tabs = container.querySelectorAll('[data-hidden-tab]');\n let lastTab = tabs[tabs.length - 1];\n let lastTabRect = lastTab.getBoundingClientRect();\n if (direction === 'ltr') {\n setShowItems?.(lastTabRect.right <= containerRect.right);\n } else {\n setShowItems?.(lastTabRect.left >= containerRect.left);\n }\n });\n\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n let prevOrientation = useRef(orientation);\n useLayoutEffect(() => {\n if (collection.size > 0 && prevOrientation.current !== orientation) {\n updateOverflow();\n }\n prevOrientation.current = orientation;\n }, [collection.size, updateOverflow, orientation]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n let menuId = useId();\n let valueId = useId();\n\n let contents: ReactNode;\n if (showItems) {\n contents = (\n <RACTabs\n {...props}\n style={{display: 'contents'}}>\n {props.children}\n </RACTabs>\n );\n } else {\n contents = (\n <>\n <TabsMenu\n id={menuId}\n valueId={valueId}\n items={children}\n onSelectionChange={onSelectionChange}\n aria-label={props['aria-label']}\n aria-describedby={props['aria-labelledby']} />\n <CollapseContext.Provider value={{showTabs: false, menuId, valueId}}>\n {props.children}\n </CollapseContext.Provider>\n </>\n );\n }\n\n return (\n <div style={props.UNSAFE_style} className={(props.UNSAFE_className || '') + tabs({orientation}, props.styles)} ref={containerRef}>\n <div className={tablist({orientation, labelBehavior, density})}>\n <HiddenTabs items={children} density={density} listRef={listRef} />\n </div>\n <CollapseContext.Provider value={{showTabs: true, menuId, valueId}}>\n {contents}\n </CollapseContext.Provider>\n </div>\n );\n};\n"],"names":[],"version":3,"file":"Tabs.cjs.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/s2/src/Tabs.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 {\n TabListProps as AriaTabListProps,\n TabPanel as AriaTabPanel,\n TabPanelProps as AriaTabPanelProps,\n TabProps as AriaTabProps,\n TabsProps as AriaTabsProps,\n ContextValue,\n Group,\n Provider,\n Tab as RACTab,\n TabList as RACTabList,\n Tabs as RACTabs,\n TabListStateContext\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {Collection, DOMRef, DOMRefValue, Key, Node, Orientation, RefObject} from '@react-types/shared';\nimport {CollectionBuilder} from '@react-aria/collections';\nimport {createContext, forwardRef, ReactNode, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport {focusRing, size, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {inertValue, useEffectEvent, useId, useLabels, useLayoutEffect, useResizeObserver} from '@react-aria/utils';\nimport {Picker, PickerItem} from './TabsPicker';\nimport {Text, TextContext} from './Content';\nimport {useControlledState} from '@react-stately/utils';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useHasTabbableChild} from '@react-aria/focus';\nimport {useLocale} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TabsProps extends Omit<AriaTabsProps, 'className' | 'style' | 'children'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tabs. */\n children: ReactNode,\n /**\n * The amount of space between the tabs.\n * @default 'regular'\n */\n density?: 'compact' | 'regular',\n /**\n * Defines if the text within the tabs should be hidden and only the icon should be shown.\n * The text is always visible when the item is collapsed into a picker.\n * @default 'show'\n */\n labelBehavior?: 'show' | 'hide'\n}\n\nexport interface TabProps extends Omit<AriaTabProps, 'children' | 'style' | 'className'>, StyleProps {\n /** The content to display in the tab. */\n children: ReactNode\n}\n\nexport interface TabListProps<T> extends Omit<AriaTabListProps<T>, 'style' | 'className' | 'aria-label' | 'aria-labelledby'>, StyleProps {\n /** The content to display in the tablist. */\n children: ReactNode | ((item: T) => ReactNode)\n}\n\nexport interface TabPanelProps extends Omit<AriaTabPanelProps, 'children' | 'style' | 'className'>, UnsafeStyles {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /** The content to display in the tab panels. */\n children: ReactNode\n}\n\nexport const TabsContext = createContext<ContextValue<Partial<TabsProps>, DOMRefValue<HTMLDivElement>>>(null);\nconst InternalTabsContext = createContext<Partial<TabsProps>>({});\nconst CollapseContext = createContext({\n showTabs: true,\n menuId: '',\n valueId: ''\n});\n\nconst tabs = style({\n position: 'relative',\n display: 'flex',\n flexShrink: 0,\n font: 'ui',\n flexDirection: {\n orientation: {\n horizontal: 'column'\n }\n }\n}, getAllowedOverrides({height: true}));\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 */\nexport const Tabs = forwardRef(function Tabs(props: TabsProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, TabsContext);\n let {\n density = 'regular',\n isDisabled,\n disabledKeys,\n orientation = 'horizontal',\n labelBehavior = 'show'\n } = props;\n let domRef = useDOMRef(ref);\n let [value, setValue] = useControlledState(props.selectedKey, props.defaultSelectedKey ?? null!, props.onSelectionChange);\n\n if (!props['aria-label'] && !props['aria-labelledby']) {\n throw new Error('An aria-label or aria-labelledby prop is required on Tabs for accessibility.');\n }\n\n return (\n <Provider\n values={[\n [InternalTabsContext, {\n density,\n isDisabled,\n orientation,\n disabledKeys,\n selectedKey: value,\n onSelectionChange: setValue,\n labelBehavior,\n 'aria-label': props['aria-label'],\n 'aria-labelledby': props['aria-labelledby']\n }]\n ]}>\n <CollectionBuilder content={props.children}>\n {collection => (\n <CollapsingTabs\n {...props}\n selectedKey={value}\n onSelectionChange={setValue}\n collection={collection}\n containerRef={domRef} />\n )}\n </CollectionBuilder>\n </Provider>\n );\n});\n\nconst tablist = style({\n display: 'flex',\n gap: {\n orientation: {\n horizontal: {\n density: {\n compact: 24,\n regular: 32\n },\n labelBehavior: {\n hide: {\n density: {\n compact: 16,\n regular: 24\n }\n }\n }\n }\n }\n },\n flexDirection: {\n orientation: {\n vertical: 'column'\n }\n },\n paddingEnd: {\n orientation: {\n vertical: 20\n }\n },\n paddingStart: {\n orientation: {\n vertical: 12\n }\n },\n flexShrink: 0,\n flexBasis: '[0%]'\n});\n\nexport function TabList<T extends object>(props: TabListProps<T>) {\n let {showTabs} = useContext(CollapseContext) ?? {};\n\n if (showTabs) {\n return <TabListInner {...props} />;\n }\n}\n\nfunction TabListInner<T extends object>(props: TabListProps<T>) {\n let {density, isDisabled, disabledKeys, orientation, labelBehavior, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy} = useContext(InternalTabsContext) ?? {};\n let state = useContext(TabListStateContext);\n let [selectedTab, setSelectedTab] = useState<HTMLElement | undefined>(undefined);\n let tablistRef = useRef<HTMLDivElement>(null);\n\n useLayoutEffect(() => {\n if (tablistRef?.current) {\n let tab: HTMLElement | null = tablistRef.current.querySelector('[role=tab][data-selected=true]');\n\n if (tab != null) {\n setSelectedTab(tab);\n }\n }\n }, [tablistRef, state?.selectedItem?.key]);\n\n return (\n <div\n style={props.UNSAFE_style}\n className={(props.UNSAFE_className || '') + style({position: 'relative'}, getAllowedOverrides())(null, props.styles)}>\n {orientation === 'vertical' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n <RACTabList\n {...props}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n ref={tablistRef}\n className={renderProps => tablist({...renderProps, labelBehavior, density})} />\n {orientation === 'horizontal' &&\n <TabLine disabledKeys={disabledKeys} isDisabled={isDisabled} selectedTab={selectedTab} orientation={orientation} density={density} />}\n </div>\n );\n}\n\ninterface TabLineProps {\n disabledKeys: Iterable<Key> | undefined,\n isDisabled: boolean | undefined,\n selectedTab: HTMLElement | undefined,\n orientation?: Orientation,\n density?: 'compact' | 'regular'\n}\n\nconst selectedIndicator = style({\n position: 'absolute',\n backgroundColor: {\n default: 'neutral',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n height: {\n orientation: {\n horizontal: '[2px]'\n }\n },\n width: {\n orientation: {\n vertical: '[2px]'\n }\n },\n bottom: {\n orientation: {\n horizontal: 0\n }\n },\n borderStyle: 'none',\n borderRadius: 'full',\n transitionDuration: 130,\n transitionTimingFunction: 'in-out'\n});\n\nfunction TabLine(props: TabLineProps) {\n let {\n disabledKeys,\n isDisabled: isTabsDisabled,\n selectedTab,\n orientation,\n density\n } = props;\n let {direction} = useLocale();\n let state = useContext(TabListStateContext);\n\n // We want to add disabled styling to the selection indicator only if all the Tabs are disabled\n let [isDisabled, setIsDisabled] = useState<boolean>(false);\n useEffect(() => {\n let isDisabled = isTabsDisabled || isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set(null));\n setIsDisabled(isDisabled);\n }, [state?.collection, disabledKeys, isTabsDisabled, setIsDisabled]);\n\n let [style, setStyle] = useState<{transform: string | undefined, width: string | undefined, height: string | undefined}>({\n transform: undefined,\n width: undefined,\n height: undefined\n });\n\n let onResize = useCallback(() => {\n if (selectedTab) {\n let styleObj: { transform: string | undefined, width: string | undefined, height: string | undefined } = {\n transform: undefined,\n width: undefined,\n height: undefined\n };\n\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, state?.selectedItem?.key, density, direction, orientation]);\n\n return (\n <div style={{...style}} className={selectedIndicator({isDisabled, orientation})} />\n );\n}\n\nconst tab = style({\n ...focusRing(),\n display: 'flex',\n color: {\n default: 'neutral-subdued',\n isSelected: 'neutral',\n isHovered: 'neutral-subdued',\n isDisabled: 'disabled',\n forcedColors: {\n isSelected: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n borderRadius: 'sm',\n gap: 'text-to-visual',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n },\n alignItems: 'center',\n position: 'relative',\n cursor: 'default',\n flexShrink: 0,\n transition: 'default',\n paddingX: {\n labelBehavior: {\n hide: size(6)\n }\n },\n disableTapHighlight: true\n}, getAllowedOverrides());\n\nconst icon = style({\n display: 'block',\n flexShrink: 0,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nexport function Tab(props: TabProps) {\n let {density, labelBehavior} = useContext(InternalTabsContext) ?? {};\n\n let contentId = useId();\n let ariaLabelledBy = props['aria-labelledby'] || '';\n return (\n <RACTab\n {...props}\n // @ts-ignore\n originalProps={props}\n aria-labelledby={`${labelBehavior === 'hide' ? contentId : ''} ${ariaLabelledBy}`}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className || '') + tab({...renderProps, density, labelBehavior}, props.styles)}>\n {({\n // @ts-ignore\n isMenu\n }) => {\n if (isMenu) {\n return props.children;\n } else {\n return (\n <Provider\n values={[\n [TextContext, {\n id: contentId,\n styles:\n style({\n order: 1,\n display: {\n labelBehavior: {\n hide: 'none'\n }\n }\n })({labelBehavior})\n }],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n styles: icon\n }]\n ]}>\n {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n </Provider>\n );\n }\n }}\n </RACTab>\n );\n}\n\nconst tabPanel = style({\n ...focusRing(),\n marginTop: 4,\n color: 'gray-800',\n flexGrow: 1,\n flexBasis: '[0%]',\n minHeight: 0,\n minWidth: 0\n}, getAllowedOverrides({height: true}));\n\nexport function TabPanel(props: TabPanelProps) {\n let {showTabs} = useContext(CollapseContext);\n let {selectedKey} = useContext(InternalTabsContext);\n if (showTabs) {\n return (\n <AriaTabPanel\n {...props}\n style={props.UNSAFE_style}\n className={renderProps => (props.UNSAFE_className ?? '') + tabPanel(renderProps, props.styles)} />\n );\n }\n\n if (props.id !== selectedKey) {\n return null;\n }\n\n return <CollapsedTabPanel {...props} />;\n}\n\nfunction CollapsedTabPanel(props: TabPanelProps) {\n let {UNSAFE_style, UNSAFE_className = '', ...otherProps} = props;\n let {menuId, valueId} = useContext(CollapseContext);\n let ref = useRef(null);\n let tabIndex = useHasTabbableChild(ref) ? undefined : 0;\n\n return (\n <Group\n {...otherProps}\n ref={ref}\n aria-labelledby={menuId + ' ' + valueId}\n tabIndex={tabIndex}\n style={UNSAFE_style}\n className={renderProps => UNSAFE_className + tabPanel(renderProps, props.styles)} />\n );\n}\n\nfunction isAllTabsDisabled<T>(collection: Collection<Node<T>> | undefined, disabledKeys: Set<Key>) {\n let testKey: Key | null = null;\n if (collection && collection.size > 0) {\n testKey = collection.getFirstKey();\n\n let index = 0;\n while (testKey && index < collection.size) {\n // We have to check if the item in the collection has a key in disabledKeys or has the isDisabled prop set directly on it\n if (!disabledKeys.has(testKey) && !collection.getItem(testKey)?.props?.isDisabled) {\n return false;\n }\n\n testKey = collection.getKeyAfter(testKey);\n index++;\n }\n return true;\n }\n return false;\n}\n\nlet HiddenTabs = function (props: {\n listRef: RefObject<HTMLDivElement | null>,\n items: Array<Node<any>>,\n size?: string,\n density?: 'compact' | 'regular'\n}) {\n let {listRef, items, size, density} = props;\n\n return (\n <div\n // @ts-ignore\n inert={inertValue(true)}\n ref={listRef}\n className={style({\n display: '[inherit]',\n flexDirection: '[inherit]',\n gap: '[inherit]',\n flexWrap: '[inherit]',\n position: 'absolute',\n inset: 0,\n visibility: 'hidden',\n overflow: 'hidden',\n opacity: 0\n })}>\n {items.map((item) => {\n // pull off individual props as an allow list, don't want refs or other props getting through\n return (\n <div\n data-hidden-tab\n style={item.props.UNSAFE_style}\n key={item.key}\n className={item.props.className({size, density})}>\n {item.props.children({size, density})}\n </div>\n );\n })}\n </div>\n );\n};\n\nlet TabsMenu = (props: {valueId: string, items: Array<Node<any>>, onSelectionChange: TabsProps['onSelectionChange']} & Omit<TabsProps, 'children'>) => {\n let {id, items, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, valueId} = props;\n let {density, onSelectionChange, selectedKey, isDisabled, disabledKeys, labelBehavior} = useContext(InternalTabsContext);\n let state = useContext(TabListStateContext);\n let allKeysDisabled = useMemo(() => {\n return isAllTabsDisabled(state?.collection, disabledKeys ? new Set(disabledKeys) : new Set());\n }, [state?.collection, disabledKeys]);\n let labelProps = useLabels({\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy\n });\n\n return (\n <div\n className={style({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n height: {\n density: {\n compact: 32,\n regular: 48\n }\n }})({density})}>\n <Picker\n id={id}\n valueId={valueId}\n {...labelProps}\n aria-describedby={props['aria-describedby']}\n aria-details={props['aria-details']}\n isDisabled={isDisabled || allKeysDisabled}\n density={density!}\n labelBehavior={labelBehavior}\n items={items}\n disabledKeys={disabledKeys}\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}>\n {(item: Node<any>) => {\n return (\n <PickerItem\n {...item.props.originalProps}\n isDisabled={isDisabled || allKeysDisabled}\n key={item.key}>\n {item.props.children({density, isMenu: true})}\n </PickerItem>\n );\n }}\n </Picker>\n </div>\n );\n};\n\nlet CollapsingTabs = ({collection, containerRef, ...props}: {collection: Collection<Node<unknown>>, containerRef: any} & TabsProps) => {\n let {density = 'regular', orientation = 'horizontal', labelBehavior = 'show', onSelectionChange} = props;\n let [showItems, _setShowItems] = useState(true);\n showItems = orientation === 'vertical' ? true : showItems;\n let setShowItems = useCallback((value: boolean) => {\n if (orientation === 'vertical') {\n // if orientation is vertical, we always show the items\n _setShowItems(true);\n } else {\n _setShowItems(value);\n }\n }, [orientation]);\n\n let {direction} = useLocale();\n\n let children = useMemo(() => [...collection], [collection]);\n\n let listRef = useRef<HTMLDivElement | null>(null);\n let updateOverflow = useEffectEvent(() => {\n if (orientation === 'vertical' || !listRef.current || !containerRef?.current) {\n return;\n }\n let container = listRef.current;\n let containerRect = container.getBoundingClientRect();\n let tabs = container.querySelectorAll('[data-hidden-tab]');\n let lastTab = tabs[tabs.length - 1];\n let lastTabRect = lastTab.getBoundingClientRect();\n if (direction === 'ltr') {\n setShowItems?.(lastTabRect.right <= containerRect.right);\n } else {\n setShowItems?.(lastTabRect.left >= containerRect.left);\n }\n });\n\n useResizeObserver({ref: containerRef, onResize: updateOverflow});\n\n useLayoutEffect(() => {\n if (collection.size > 0) {\n queueMicrotask(updateOverflow);\n }\n }, [collection.size, updateOverflow]);\n\n // start with null so that the first render won't have a flicker\n let prevOrientation = useRef<Orientation | null>(null);\n useLayoutEffect(() => {\n if (collection.size > 0 && prevOrientation.current !== orientation) {\n updateOverflow();\n }\n prevOrientation.current = orientation;\n }, [collection.size, updateOverflow, orientation]);\n\n useEffect(() => {\n // Recalculate visible tags when fonts are loaded.\n document.fonts?.ready.then(() => updateOverflow());\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n let menuId = useId();\n let valueId = useId();\n\n let contents: ReactNode;\n if (showItems) {\n contents = (\n <RACTabs\n {...props}\n style={{display: 'contents'}}>\n {props.children}\n </RACTabs>\n );\n } else {\n contents = (\n <>\n <TabsMenu\n id={menuId}\n valueId={valueId}\n items={children}\n onSelectionChange={onSelectionChange}\n aria-label={props['aria-label']}\n aria-describedby={props['aria-labelledby']} />\n <CollapseContext.Provider value={{showTabs: false, menuId, valueId}}>\n {props.children}\n </CollapseContext.Provider>\n </>\n );\n }\n\n return (\n <div style={props.UNSAFE_style} className={(props.UNSAFE_className || '') + tabs({orientation}, props.styles)} ref={containerRef}>\n <div className={tablist({orientation, labelBehavior, density})}>\n <HiddenTabs items={children} density={density} listRef={listRef} />\n </div>\n <CollapseContext.Provider value={{showTabs: true, menuId, valueId}}>\n {contents}\n </CollapseContext.Provider>\n </div>\n );\n};\n"],"names":[],"version":3,"file":"Tabs.cjs.map"}
|
package/dist/Tabs.css
CHANGED
|
@@ -1,55 +1,55 @@
|
|
|
1
1
|
@layer _.a {
|
|
2
|
-
.
|
|
2
|
+
._da {
|
|
3
3
|
font-family: adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
|
|
4
4
|
}
|
|
5
5
|
|
|
6
|
-
.
|
|
6
|
+
._ee {
|
|
7
7
|
font-size: .875rem;
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
.
|
|
10
|
+
._fb {
|
|
11
11
|
font-variation-settings: "wght" 400;
|
|
12
12
|
font-synthesis-weight: none;
|
|
13
13
|
font-weight: 400;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
.
|
|
16
|
+
._ga {
|
|
17
17
|
line-height: 1.3;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
.
|
|
20
|
+
.ij {
|
|
21
21
|
row-gap: 2rem;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
.
|
|
24
|
+
.if {
|
|
25
25
|
row-gap: 1rem;
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
.
|
|
28
|
+
.ih {
|
|
29
29
|
row-gap: 1.5rem;
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
.
|
|
32
|
+
.jj {
|
|
33
33
|
column-gap: 2rem;
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
.
|
|
36
|
+
.jf {
|
|
37
37
|
column-gap: 1rem;
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
-
.
|
|
40
|
+
.jh {
|
|
41
41
|
column-gap: 1.5rem;
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
-
.
|
|
44
|
+
._7b {
|
|
45
45
|
flex-direction: column;
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
.
|
|
48
|
+
.Dg {
|
|
49
49
|
padding-inline-end: 1.25rem;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
.
|
|
52
|
+
.Ce {
|
|
53
53
|
padding-inline-start: .75rem;
|
|
54
54
|
}
|
|
55
55
|
|
|
@@ -65,35 +65,35 @@
|
|
|
65
65
|
background-color: var(--lightningcss-light, #e9e9e9) var(--lightningcss-dark, #2c2c2c);
|
|
66
66
|
}
|
|
67
67
|
|
|
68
|
-
.
|
|
68
|
+
.k-375zlr {
|
|
69
69
|
height: 2px;
|
|
70
70
|
}
|
|
71
71
|
|
|
72
|
-
.
|
|
72
|
+
.l-375zlr {
|
|
73
73
|
width: 2px;
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
.
|
|
76
|
+
.wf {
|
|
77
77
|
border-style: none;
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
-
.
|
|
80
|
+
._wf {
|
|
81
81
|
border-start-start-radius: 9999px;
|
|
82
82
|
}
|
|
83
83
|
|
|
84
|
-
.
|
|
84
|
+
._xf {
|
|
85
85
|
border-start-end-radius: 9999px;
|
|
86
86
|
}
|
|
87
87
|
|
|
88
|
-
.
|
|
88
|
+
._yf {
|
|
89
89
|
border-end-start-radius: 9999px;
|
|
90
90
|
}
|
|
91
91
|
|
|
92
|
-
.
|
|
92
|
+
._zf {
|
|
93
93
|
border-end-end-radius: 9999px;
|
|
94
94
|
}
|
|
95
95
|
|
|
96
|
-
.
|
|
96
|
+
._R-375x5l {
|
|
97
97
|
transition-duration: .13s;
|
|
98
98
|
}
|
|
99
99
|
|
|
@@ -109,284 +109,260 @@
|
|
|
109
109
|
color: var(--lightningcss-light, #c6c6c6) var(--lightningcss-dark, #444);
|
|
110
110
|
}
|
|
111
111
|
|
|
112
|
-
.
|
|
112
|
+
._wb {
|
|
113
113
|
border-start-start-radius: .25rem;
|
|
114
114
|
}
|
|
115
115
|
|
|
116
|
-
.
|
|
116
|
+
._xb {
|
|
117
117
|
border-start-end-radius: .25rem;
|
|
118
118
|
}
|
|
119
119
|
|
|
120
|
-
.
|
|
120
|
+
._yb {
|
|
121
121
|
border-end-start-radius: .25rem;
|
|
122
122
|
}
|
|
123
123
|
|
|
124
|
-
.
|
|
124
|
+
._zb {
|
|
125
125
|
border-end-end-radius: .25rem;
|
|
126
126
|
}
|
|
127
127
|
|
|
128
|
-
.
|
|
128
|
+
.iG {
|
|
129
129
|
row-gap: .428571em;
|
|
130
130
|
}
|
|
131
131
|
|
|
132
|
-
.
|
|
132
|
+
.jG {
|
|
133
133
|
column-gap: .428571em;
|
|
134
134
|
}
|
|
135
135
|
|
|
136
|
-
.
|
|
136
|
+
.Vc {
|
|
137
137
|
position: relative;
|
|
138
138
|
}
|
|
139
139
|
|
|
140
|
-
.
|
|
140
|
+
.__Ib {
|
|
141
141
|
cursor: default;
|
|
142
142
|
}
|
|
143
143
|
|
|
144
|
-
.
|
|
144
|
+
._Pa {
|
|
145
145
|
transition-property: color, background-color, var(--gp), border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter;
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
.
|
|
148
|
+
._R-375x7f {
|
|
149
149
|
transition-duration: .15s;
|
|
150
150
|
}
|
|
151
151
|
|
|
152
|
-
.
|
|
152
|
+
._Sa {
|
|
153
153
|
transition-timing-function: cubic-bezier(.45, 0, .4, 1);
|
|
154
154
|
}
|
|
155
155
|
|
|
156
|
-
.
|
|
156
|
+
.C-ve8p9e {
|
|
157
157
|
padding-inline-start: calc(.375rem * var(--s2-scale));
|
|
158
158
|
}
|
|
159
159
|
|
|
160
|
-
.
|
|
160
|
+
.D-ve8p9e {
|
|
161
161
|
padding-inline-end: calc(.375rem * var(--s2-scale));
|
|
162
162
|
}
|
|
163
163
|
|
|
164
|
-
.
|
|
164
|
+
.__S-yksgrp {
|
|
165
|
+
-webkit-tap-highlight-color: #0000;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
._0a {
|
|
165
169
|
display: block;
|
|
166
170
|
}
|
|
167
171
|
|
|
168
|
-
.-
|
|
172
|
+
.-rwx0fg_e-b {
|
|
169
173
|
--iconPrimary: currentColor;
|
|
170
174
|
}
|
|
171
175
|
|
|
172
|
-
.
|
|
176
|
+
.__B-3t1y {
|
|
173
177
|
order: 1;
|
|
174
178
|
}
|
|
175
179
|
|
|
176
|
-
.
|
|
180
|
+
._0j {
|
|
177
181
|
display: none;
|
|
178
182
|
}
|
|
179
183
|
|
|
180
|
-
.
|
|
184
|
+
.__B-3t1x {
|
|
181
185
|
order: 0;
|
|
182
186
|
}
|
|
183
187
|
|
|
184
|
-
.
|
|
188
|
+
._Ma {
|
|
185
189
|
outline-style: none;
|
|
186
190
|
}
|
|
187
191
|
|
|
188
|
-
.
|
|
192
|
+
._Mb {
|
|
189
193
|
outline-style: solid;
|
|
190
194
|
}
|
|
191
195
|
|
|
192
|
-
.
|
|
196
|
+
.dx {
|
|
193
197
|
outline-color: var(--lightningcss-light, #4b75ff) var(--lightningcss-dark, #4069fd);
|
|
194
198
|
}
|
|
195
199
|
|
|
196
|
-
.
|
|
200
|
+
._Oc {
|
|
197
201
|
outline-width: 2px;
|
|
198
202
|
}
|
|
199
203
|
|
|
200
|
-
.
|
|
204
|
+
._N-3t1z {
|
|
201
205
|
outline-offset: 2px;
|
|
202
206
|
}
|
|
203
207
|
|
|
204
|
-
.
|
|
208
|
+
.Ac {
|
|
205
209
|
margin-top: .25rem;
|
|
206
210
|
}
|
|
207
211
|
|
|
208
|
-
.BK {
|
|
209
|
-
margin-inline-start: -.25rem;
|
|
210
|
-
}
|
|
211
|
-
|
|
212
|
-
.CK {
|
|
213
|
-
margin-inline-end: -.25rem;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
.Fc {
|
|
217
|
-
padding-inline-start: .25rem;
|
|
218
|
-
}
|
|
219
|
-
|
|
220
|
-
.Gc {
|
|
221
|
-
padding-inline-end: .25rem;
|
|
222
|
-
}
|
|
223
|
-
|
|
224
212
|
.an {
|
|
225
213
|
color: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
|
|
226
214
|
}
|
|
227
215
|
|
|
228
|
-
.
|
|
216
|
+
.__a-3t1y {
|
|
229
217
|
flex-grow: 1;
|
|
230
218
|
}
|
|
231
219
|
|
|
232
|
-
.
|
|
233
|
-
flex-shrink: 1;
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
.g-3hmsa {
|
|
220
|
+
.h-3hmsa {
|
|
237
221
|
flex-basis: 0%;
|
|
238
222
|
}
|
|
239
223
|
|
|
240
|
-
.
|
|
224
|
+
.oo {
|
|
241
225
|
min-height: 0;
|
|
242
226
|
}
|
|
243
227
|
|
|
244
|
-
.
|
|
228
|
+
.qo {
|
|
245
229
|
min-width: 0;
|
|
246
230
|
}
|
|
247
231
|
|
|
248
|
-
.
|
|
249
|
-
overflow-x: auto;
|
|
250
|
-
}
|
|
251
|
-
|
|
252
|
-
.__Aa {
|
|
253
|
-
overflow-y: auto;
|
|
254
|
-
}
|
|
255
|
-
|
|
256
|
-
._3-17zqamw {
|
|
232
|
+
._0-17zqamw {
|
|
257
233
|
display: inherit;
|
|
258
234
|
}
|
|
259
235
|
|
|
260
|
-
.
|
|
236
|
+
._7-17zqamw {
|
|
261
237
|
flex-direction: inherit;
|
|
262
238
|
}
|
|
263
239
|
|
|
264
|
-
.
|
|
240
|
+
.i-17zqamw {
|
|
265
241
|
row-gap: inherit;
|
|
266
242
|
}
|
|
267
243
|
|
|
268
|
-
.
|
|
244
|
+
.j-17zqamw {
|
|
269
245
|
column-gap: inherit;
|
|
270
246
|
}
|
|
271
247
|
|
|
272
|
-
.
|
|
248
|
+
._8-17zqamw {
|
|
273
249
|
flex-wrap: inherit;
|
|
274
250
|
}
|
|
275
251
|
|
|
276
|
-
.
|
|
252
|
+
.Va {
|
|
277
253
|
position: absolute;
|
|
278
254
|
}
|
|
279
255
|
|
|
280
|
-
.
|
|
256
|
+
.Ya {
|
|
281
257
|
top: 0;
|
|
282
258
|
}
|
|
283
259
|
|
|
284
|
-
.
|
|
260
|
+
._aa {
|
|
285
261
|
bottom: 0;
|
|
286
262
|
}
|
|
287
263
|
|
|
288
|
-
.
|
|
264
|
+
.Wa {
|
|
289
265
|
inset-inline-start: 0;
|
|
290
266
|
}
|
|
291
267
|
|
|
292
|
-
.
|
|
268
|
+
.Xa {
|
|
293
269
|
inset-inline-end: 0;
|
|
294
270
|
}
|
|
295
271
|
|
|
296
|
-
.
|
|
272
|
+
.__Fb {
|
|
297
273
|
visibility: hidden;
|
|
298
274
|
}
|
|
299
275
|
|
|
300
|
-
.
|
|
276
|
+
.__wb {
|
|
301
277
|
overflow-x: hidden;
|
|
302
278
|
}
|
|
303
279
|
|
|
304
|
-
.
|
|
280
|
+
.__xb {
|
|
305
281
|
overflow-y: hidden;
|
|
306
282
|
}
|
|
307
283
|
|
|
308
|
-
.
|
|
284
|
+
._L-3t1x {
|
|
309
285
|
opacity: 0;
|
|
310
286
|
}
|
|
311
287
|
|
|
312
|
-
.
|
|
288
|
+
._0d {
|
|
313
289
|
display: flex;
|
|
314
290
|
}
|
|
315
291
|
|
|
316
|
-
.
|
|
292
|
+
._9-3t1x {
|
|
317
293
|
flex-shrink: 0;
|
|
318
294
|
}
|
|
319
295
|
|
|
320
|
-
.
|
|
296
|
+
._2c {
|
|
321
297
|
align-items: center;
|
|
322
298
|
}
|
|
323
299
|
|
|
324
|
-
.
|
|
300
|
+
.kU {
|
|
325
301
|
height: calc(2rem * var(--s2-scale));
|
|
326
302
|
}
|
|
327
303
|
|
|
328
|
-
.
|
|
304
|
+
.k_a {
|
|
329
305
|
height: calc(3rem * var(--s2-scale));
|
|
330
306
|
}
|
|
331
307
|
}
|
|
332
308
|
|
|
333
309
|
@layer _.b {
|
|
334
|
-
.
|
|
310
|
+
._d-enzrfpb:lang(ar) {
|
|
335
311
|
font-family: myriad-arabic, ui-sans-serif, system-ui, sans-serif;
|
|
336
312
|
}
|
|
337
313
|
|
|
338
|
-
.
|
|
314
|
+
._g-1x99dlob:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
|
|
339
315
|
line-height: 1.5;
|
|
340
316
|
}
|
|
341
317
|
}
|
|
342
318
|
|
|
343
319
|
@layer _.c {
|
|
344
|
-
.
|
|
320
|
+
._d-enzwzjc:lang(he) {
|
|
345
321
|
font-family: myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
|
|
346
322
|
}
|
|
347
323
|
}
|
|
348
324
|
|
|
349
325
|
@layer _.d {
|
|
350
|
-
.
|
|
326
|
+
._d-enzykdd:lang(ja) {
|
|
351
327
|
font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, MS Pゴシック, MS PGothic, sans-serif;
|
|
352
328
|
}
|
|
353
329
|
}
|
|
354
330
|
|
|
355
331
|
@layer _.e {
|
|
356
|
-
.
|
|
332
|
+
._d-enzzrge:lang(ko) {
|
|
357
333
|
font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
|
|
358
334
|
}
|
|
359
335
|
}
|
|
360
336
|
|
|
361
337
|
@layer _.f {
|
|
362
|
-
.
|
|
338
|
+
._d-eo0c6sf:lang(zh) {
|
|
363
339
|
font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
|
|
364
340
|
}
|
|
365
341
|
}
|
|
366
342
|
|
|
367
343
|
@layer _.g {
|
|
368
|
-
.
|
|
344
|
+
._d-1uotwbwg:lang(zh-hant) {
|
|
369
345
|
font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
|
|
370
346
|
}
|
|
371
347
|
}
|
|
372
348
|
|
|
373
349
|
@layer _.h {
|
|
374
|
-
.
|
|
350
|
+
._d-bc1l9oh:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
|
|
375
351
|
font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
|
|
376
352
|
}
|
|
377
353
|
}
|
|
378
354
|
|
|
379
355
|
@layer _.b.b {
|
|
380
356
|
@media not ((hover: hover) and (pointer: fine)) {
|
|
381
|
-
.
|
|
357
|
+
._ebf {
|
|
382
358
|
font-size: 1.0625rem;
|
|
383
359
|
}
|
|
384
360
|
|
|
385
|
-
.
|
|
361
|
+
.ibH {
|
|
386
362
|
row-gap: .470588em;
|
|
387
363
|
}
|
|
388
364
|
|
|
389
|
-
.
|
|
365
|
+
.jbH {
|
|
390
366
|
column-gap: .470588em;
|
|
391
367
|
}
|
|
392
368
|
}
|
|
@@ -410,7 +386,7 @@
|
|
|
410
386
|
color: graytext;
|
|
411
387
|
}
|
|
412
388
|
|
|
413
|
-
.
|
|
389
|
+
.da_____M {
|
|
414
390
|
outline-color: highlight;
|
|
415
391
|
}
|
|
416
392
|
}
|