@oracle/oraclejet-preact 20.0.0 → 20.0.2
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/amd/BaseCardView-16fda4c3.js +2 -0
- package/amd/{BaseCardView-b8119561.js.map → BaseCardView-16fda4c3.js.map} +1 -1
- package/amd/BaseTabBarItem-d7c2922b.js +2 -0
- package/amd/BaseTabBarItem-d7c2922b.js.map +1 -0
- package/amd/CardFlexView-d3eb7373.js +2 -0
- package/amd/{CardFlexView-aa2f3de8.js.map → CardFlexView-d3eb7373.js.map} +1 -1
- package/amd/CardGridView-842f70cd.js +2 -0
- package/amd/{CardGridView-85f90c75.js.map → CardGridView-842f70cd.js.map} +1 -1
- package/amd/CheckboxSetContext-2e486ea8.js +2 -0
- package/{cjs/CheckboxSetContext-c62db26d.js.map → amd/CheckboxSetContext-2e486ea8.js.map} +1 -1
- package/amd/{CollapsibleNavigationList-f0072c90.js → CollapsibleNavigationList-fdeccbfb.js} +2 -2
- package/amd/{CollapsibleNavigationList-f0072c90.js.map → CollapsibleNavigationList-fdeccbfb.js.map} +1 -1
- package/amd/{DatePicker-88c5bbcd.js → DatePicker-bf521b1c.js} +2 -2
- package/amd/{DatePicker-88c5bbcd.js.map → DatePicker-bf521b1c.js.map} +1 -1
- package/amd/ExpandableList-a9a86ad8.js +2 -0
- package/amd/{ExpandableList-233c279e.js.map → ExpandableList-a9a86ad8.js.map} +1 -1
- package/amd/{FlatTreeView-9ecf2be6.js → FlatTreeView-15edd439.js} +2 -2
- package/amd/{FlatTreeView-9ecf2be6.js.map → FlatTreeView-15edd439.js.map} +1 -1
- package/amd/{InlineSelectSingle-f4438110.js → InlineSelectSingle-7c1cc5b5.js} +2 -2
- package/amd/{InlineSelectSingle-f4438110.js.map → InlineSelectSingle-7c1cc5b5.js.map} +1 -1
- package/amd/InputDatePicker-7227a858.js +2 -0
- package/amd/{InputDatePicker-48633486.js.map → InputDatePicker-7227a858.js.map} +1 -1
- package/amd/ListView-6d21e8f9.js +2 -0
- package/amd/{ListView-2678b2af.js.map → ListView-6d21e8f9.js.map} +1 -1
- package/amd/{MonthView-ea883c49.js → MonthView-96fafba4.js} +2 -2
- package/amd/{MonthView-ea883c49.js.map → MonthView-96fafba4.js.map} +1 -1
- package/amd/{OverflowTabBar-b142f8d4.js → OverflowTabBar-5ff68da7.js} +2 -2
- package/amd/{OverflowTabBar-b142f8d4.js.map → OverflowTabBar-5ff68da7.js.map} +1 -1
- package/amd/{OverflowTabBarItem-49a82149.js → OverflowTabBarItem-926b0c8a.js} +2 -2
- package/amd/{OverflowTabBarItem-49a82149.js.map → OverflowTabBarItem-926b0c8a.js.map} +1 -1
- package/amd/PRIVATE_BaseCardView.js +1 -1
- package/amd/PRIVATE_CollapsibleNavigationList.js +1 -1
- package/amd/PRIVATE_MonthView.js +1 -1
- package/amd/PRIVATE_MonthYearGridView.js +1 -1
- package/amd/PRIVATE_SelectCommon.js +1 -1
- package/amd/PRIVATE_StyledDatePickerButton.js +1 -1
- package/amd/PRIVATE_TableList.js +1 -1
- package/amd/{RemovableTabBarItem-e1bee7fa.js → RemovableTabBarItem-9ae273fe.js} +2 -2
- package/amd/{RemovableTabBarItem-e1bee7fa.js.map → RemovableTabBarItem-9ae273fe.js.map} +1 -1
- package/amd/ReorderableTabBar-0c69bfd4.js +2 -0
- package/amd/{ReorderableTabBar-46683bcb.js.map → ReorderableTabBar-0c69bfd4.js.map} +1 -1
- package/amd/{SelectMobileFieldInput-83f56b22.js → SelectMobileFieldInput-d499ef86.js} +2 -2
- package/amd/{SelectMobileFieldInput-83f56b22.js.map → SelectMobileFieldInput-d499ef86.js.map} +1 -1
- package/amd/{SelectMultiple-cb5fdd20.js → SelectMultiple-cc9bffc6.js} +2 -2
- package/amd/{SelectMultiple-cb5fdd20.js.map → SelectMultiple-cc9bffc6.js.map} +1 -1
- package/amd/{SelectSingle-02e85b6e.js → SelectSingle-2bb35b67.js} +2 -2
- package/amd/{SelectSingle-02e85b6e.js.map → SelectSingle-2bb35b67.js.map} +1 -1
- package/amd/StyledDatePickerButton-bceb62e1.js +2 -0
- package/amd/StyledDatePickerButton-bceb62e1.js.map +1 -0
- package/amd/StyledDatePickerButtonStyles.styles.css +17 -0
- package/amd/TabBar-de723fbc.js +2 -0
- package/amd/{TabBar-fcebb560.js.map → TabBar-de723fbc.js.map} +1 -1
- package/amd/TabBarItem-a39c5de3.js +2 -0
- package/amd/{TabBarItem-224bc6b3.js.map → TabBarItem-a39c5de3.js.map} +1 -1
- package/amd/TabBarLinkItem-944b1e8d.js +2 -0
- package/amd/{TabBarLinkItem-57587dbd.js.map → TabBarLinkItem-944b1e8d.js.map} +1 -1
- package/amd/TabBarMixed-cfd346bf.js +2 -0
- package/amd/{TabBarMixed-8cc4b4ed.js.map → TabBarMixed-cfd346bf.js.map} +1 -1
- package/amd/Theme-redwood/theme.css +201 -201
- package/amd/Theme-stable/theme.css +218 -218
- package/amd/UNSAFE_CardFlexView.js +1 -1
- package/amd/UNSAFE_CardGridView.js +1 -1
- package/amd/UNSAFE_CheckboxItem.js +1 -1
- package/amd/UNSAFE_CheckboxItem.js.map +1 -1
- package/amd/UNSAFE_CheckboxSet.js +1 -1
- package/amd/UNSAFE_CheckboxSet.js.map +1 -1
- package/amd/UNSAFE_DatePicker.js +1 -1
- package/amd/UNSAFE_ExpandableList.js +1 -1
- package/amd/UNSAFE_FlatTreeView.js +1 -1
- package/amd/UNSAFE_InlineSelectSingle.js +1 -1
- package/amd/UNSAFE_InputDatePicker.js +1 -1
- package/amd/UNSAFE_ListView.js +1 -1
- package/amd/UNSAFE_OverflowTabBar.js +1 -1
- package/amd/UNSAFE_ReorderableTabBar.js +1 -1
- package/amd/UNSAFE_RichCheckboxSet.js +1 -1
- package/amd/UNSAFE_RichCheckboxSet.js.map +1 -1
- package/amd/UNSAFE_RichSelectionItem.js +1 -1
- package/amd/UNSAFE_RichSelectionItem.js.map +1 -1
- package/amd/UNSAFE_SelectMultiple.js +1 -1
- package/amd/UNSAFE_SelectSingle.js +1 -1
- package/amd/UNSAFE_TabBar.js +1 -1
- package/amd/UNSAFE_TabBarCommon.js +1 -1
- package/amd/UNSAFE_TabBarMixed.js +1 -1
- package/amd/UNSAFE_VirtualizedListView.js +1 -1
- package/amd/VirtualizedListView-1ae7151d.js +2 -0
- package/amd/{VirtualizedListView-a0f338c2.js.map → VirtualizedListView-1ae7151d.js.map} +1 -1
- package/amd/{YearsGridView-4aa7bc66.js → YearsGridView-561c3074.js} +2 -2
- package/amd/{YearsGridView-4aa7bc66.js.map → YearsGridView-561c3074.js.map} +1 -1
- package/amd/{useDisplayValue-e70c76d8.js → useDisplayValue-0e90bf4c.js} +2 -2
- package/amd/{useDisplayValue-e70c76d8.js.map → useDisplayValue-0e90bf4c.js.map} +1 -1
- package/amd/useSelectCommon-a02ddf3c.js +2 -0
- package/amd/useSelectCommon-a02ddf3c.js.map +1 -0
- package/cjs/{Chart-13a198f3.js → Chart-966da017.js} +2 -2
- package/cjs/{Chart-13a198f3.js.map → Chart-966da017.js.map} +1 -1
- package/cjs/CheckboxSet-6865f4fd.js +55 -0
- package/{amd/CheckboxSet-f000e5c2.js.map → cjs/CheckboxSet-6865f4fd.js.map} +1 -1
- package/cjs/{ColorPalette-9f041744.js → ColorPalette-b14114d8.js} +2 -2
- package/cjs/{ColorPalette-9f041744.js.map → ColorPalette-b14114d8.js.map} +1 -1
- package/cjs/{ColorPicker-9af6707c.js → ColorPicker-8f0b6000.js} +2 -2
- package/cjs/{ColorPicker-9af6707c.js.map → ColorPicker-8f0b6000.js.map} +1 -1
- package/cjs/{DatePicker-48c602ff.js → DatePicker-b60f8a7e.js} +3 -3
- package/cjs/{DatePicker-48c602ff.js.map → DatePicker-b60f8a7e.js.map} +1 -1
- package/cjs/{MonthView-59452edc.js → MonthView-a2661a58.js} +2 -2
- package/cjs/{MonthView-59452edc.js.map → MonthView-a2661a58.js.map} +1 -1
- package/cjs/{OverflowTabBarItem-2c967a89.js → OverflowTabBarItem-abcd2327.js} +6 -3
- package/cjs/OverflowTabBarItem-abcd2327.js.map +1 -0
- package/cjs/PRIVATE_Chart.js +4 -4
- package/cjs/PRIVATE_MonthView.js +2 -3
- package/cjs/PRIVATE_MonthView.js.map +1 -1
- package/cjs/PRIVATE_MonthYearGridView.js +2 -3
- package/cjs/PRIVATE_MonthYearGridView.js.map +1 -1
- package/cjs/PRIVATE_SelectCommon.js +2 -2
- package/cjs/PRIVATE_StyledDatePickerButton.js +1 -2
- package/cjs/PRIVATE_StyledDatePickerButton.js.map +1 -1
- package/cjs/SegmentStyles.styles.css +12 -9
- package/cjs/SegmentStyles.styles2.css +9 -12
- package/cjs/{SelectMobileFieldInput-111a95a5.js → SelectMobileFieldInput-cbf57541.js} +2 -2
- package/cjs/{SelectMobileFieldInput-111a95a5.js.map → SelectMobileFieldInput-cbf57541.js.map} +1 -1
- package/cjs/{StyledDatePickerButton-cf4e4dc0.js → StyledDatePickerButton-becd2a7d.js} +2 -8
- package/cjs/StyledDatePickerButton-becd2a7d.js.map +1 -0
- package/cjs/StyledDatePickerButtonStyles.styles.css +17 -0
- package/cjs/{TabBarLinkItem-42785eb3.js → TabBarLinkItem-b0c4b100.js} +2 -2
- package/cjs/{TabBarLinkItem-42785eb3.js.map → TabBarLinkItem-b0c4b100.js.map} +1 -1
- package/cjs/Theme-redwood/theme.css +117 -117
- package/cjs/Theme-stable/theme.css +224 -224
- package/cjs/UNSAFE_BarChart.js +4 -4
- package/cjs/UNSAFE_CheckboxItem.js +117 -56
- package/cjs/UNSAFE_CheckboxItem.js.map +1 -1
- package/cjs/UNSAFE_CheckboxSet.js +21 -50
- package/cjs/UNSAFE_CheckboxSet.js.map +1 -1
- package/cjs/UNSAFE_ColorPalette.js +80 -80
- package/cjs/UNSAFE_ColorPicker.js +60 -60
- package/cjs/UNSAFE_ComboChart.js +4 -4
- package/cjs/UNSAFE_DatePicker.js +4 -4
- package/cjs/UNSAFE_InlineSelectSingle.js +2 -2
- package/cjs/UNSAFE_InputColor.js +11 -11
- package/cjs/UNSAFE_InputDatePicker.js +96 -96
- package/cjs/UNSAFE_LineAreaChart.js +4 -4
- package/cjs/UNSAFE_OverflowTabBar.js +2 -2
- package/cjs/UNSAFE_RichCheckboxSet.js +46 -42
- package/cjs/UNSAFE_RichCheckboxSet.js.map +1 -1
- package/cjs/UNSAFE_RichSelectionItem.js +154 -91
- package/cjs/UNSAFE_RichSelectionItem.js.map +1 -1
- package/cjs/UNSAFE_ScatterChart.js +4 -4
- package/cjs/UNSAFE_SelectMultiple.js +2 -2
- package/cjs/UNSAFE_SelectSingle.js +3 -3
- package/cjs/UNSAFE_TabBar.js +2 -2
- package/cjs/UNSAFE_TabBarCommon.js +4 -4
- package/cjs/UNSAFE_TabBarMixed.js +3 -3
- package/cjs/{YearsGridView-b56f7f42.js → YearsGridView-d0d4e8e1.js} +2 -2
- package/cjs/{YearsGridView-b56f7f42.js.map → YearsGridView-d0d4e8e1.js.map} +1 -1
- package/cjs/{useDisplayValue-60dbe1c3.js → useDisplayValue-4ace417c.js} +2 -2
- package/cjs/{useDisplayValue-60dbe1c3.js.map → useDisplayValue-4ace417c.js.map} +1 -1
- package/cjs/{useSelectCommon-b0d7feb3.js → useSelectCommon-27afecfa.js} +8 -3
- package/cjs/useSelectCommon-27afecfa.js.map +1 -0
- package/es/{BaseCardView-85b9a71e.js → BaseCardView-b3d8bae0.js} +4 -1
- package/es/{BaseCardView-85b9a71e.js.map → BaseCardView-b3d8bae0.js.map} +1 -1
- package/es/{DatePicker-2ab05fbe.js → DatePicker-7287f0f9.js} +3 -3
- package/es/{DatePicker-2ab05fbe.js.map → DatePicker-7287f0f9.js.map} +1 -1
- package/es/{MonthView-097171eb.js → MonthView-4b2b483a.js} +2 -2
- package/es/{MonthView-097171eb.js.map → MonthView-4b2b483a.js.map} +1 -1
- package/es/{NavigationListItem-dbd29973.js → NavigationListItem-340ab770.js} +19 -1
- package/es/{NavigationListItem-dbd29973.js.map → NavigationListItem-340ab770.js.map} +1 -1
- package/es/{OverflowTabBarItem-6966fbc7.js → OverflowTabBarItem-aa0ce915.js} +7 -4
- package/es/OverflowTabBarItem-aa0ce915.js.map +1 -0
- package/es/PRIVATE_BaseCardView.js +1 -1
- package/es/PRIVATE_CollapsibleNavigationList.js +25 -25
- package/es/PRIVATE_MonthView.js +2 -3
- package/es/PRIVATE_MonthView.js.map +1 -1
- package/es/PRIVATE_MonthYearGridView.js +2 -3
- package/es/PRIVATE_MonthYearGridView.js.map +1 -1
- package/es/PRIVATE_SelectCommon.js +2 -2
- package/es/PRIVATE_StyledDatePickerButton.js +1 -2
- package/es/PRIVATE_StyledDatePickerButton.js.map +1 -1
- package/es/PRIVATE_TableList.js +4 -4
- package/es/RadioIconVariants.styles.css +3 -3
- package/es/RadioIconVariants.styles2.css +3 -3
- package/es/SegmentStyles.styles.css +9 -12
- package/es/SegmentStyles.styles2.css +12 -9
- package/es/{SelectMobileFieldInput-0a7c968c.js → SelectMobileFieldInput-345c4d45.js} +2 -2
- package/es/{SelectMobileFieldInput-0a7c968c.js.map → SelectMobileFieldInput-345c4d45.js.map} +1 -1
- package/es/{StyledDatePickerButton-f3971567.js → StyledDatePickerButton-78f2f6e8.js} +2 -8
- package/es/StyledDatePickerButton-78f2f6e8.js.map +1 -0
- package/es/StyledDatePickerButtonStyles.styles.css +17 -0
- package/es/{TabBar-10488830.js → TabBar-67ca442c.js} +3 -1
- package/es/{TabBar-10488830.js.map → TabBar-67ca442c.js.map} +1 -1
- package/es/{TabBarLinkItem-a9c1072b.js → TabBarLinkItem-e7be54fa.js} +2 -2
- package/es/{TabBarLinkItem-a9c1072b.js.map → TabBarLinkItem-e7be54fa.js.map} +1 -1
- package/es/Theme-redwood/theme.css +442 -442
- package/es/Theme-stable/theme.css +507 -507
- package/es/TrainVariants.styles.css +6 -6
- package/es/TrainVariants.styles2.css +6 -6
- package/es/UNSAFE_CardFlexView.js +1 -1
- package/es/UNSAFE_CardGridView.js +1 -1
- package/es/UNSAFE_DatePicker.js +4 -4
- package/es/UNSAFE_FlatTreeView.js +14 -14
- package/es/UNSAFE_InlineSelectSingle.js +2 -2
- package/es/UNSAFE_InputDateMask/themes/SegmentStyles.css.js +1 -1
- package/es/UNSAFE_InputDateMask.js +1 -1
- package/es/UNSAFE_InputDatePicker.js +5 -5
- package/es/UNSAFE_InputTimeMask/themes/SegmentStyles.css.js +1 -1
- package/es/UNSAFE_InputTimeMask.js +1 -1
- package/es/UNSAFE_ListView.js +53 -53
- package/es/UNSAFE_NavigationList.js +13 -13
- package/es/UNSAFE_OverflowTabBar.js +13 -13
- package/es/UNSAFE_RadioItem/themes/redwood/RadioIconTheme.js +1 -1
- package/es/UNSAFE_RadioItem/themes/redwood/RadioIconVariants.css.js +1 -1
- package/es/UNSAFE_RadioItem/themes/stable/RadioIconTheme.js +1 -1
- package/es/UNSAFE_RadioItem/themes/stable/RadioIconVariants.css.js +1 -1
- package/es/UNSAFE_RadioItem.js +1 -1
- package/es/UNSAFE_ReorderableTabBar.js +12 -12
- package/es/UNSAFE_RichSelectionItem.js +1 -1
- package/es/UNSAFE_SelectMultiple.js +2 -2
- package/es/UNSAFE_SelectSingle.js +3 -3
- package/es/UNSAFE_TabBar.js +13 -13
- package/es/UNSAFE_TabBarCommon.js +5 -5
- package/es/UNSAFE_TabBarMixed.js +12 -12
- package/es/UNSAFE_TextArea.js +226 -106
- package/es/UNSAFE_TextArea.js.map +1 -1
- package/es/UNSAFE_TextAreaAutosize.js +1 -1
- package/es/UNSAFE_Train/themes/redwood/TrainTheme.js +1 -1
- package/es/UNSAFE_Train/themes/redwood/TrainVariants.css.js +1 -1
- package/es/UNSAFE_Train/themes/stable/TrainTheme.js +1 -1
- package/es/UNSAFE_Train/themes/stable/TrainVariants.css.js +1 -1
- package/es/UNSAFE_Train.js +1 -1
- package/es/{YearsGridView-cac4710a.js → YearsGridView-6c18094a.js} +2 -2
- package/es/{YearsGridView-cac4710a.js.map → YearsGridView-6c18094a.js.map} +1 -1
- package/es/{useDisplayValue-5bbf2830.js → useDisplayValue-65bbc74e.js} +2 -2
- package/es/{useDisplayValue-5bbf2830.js.map → useDisplayValue-65bbc74e.js.map} +1 -1
- package/es/{useSelectCommon-309d0f07.js → useSelectCommon-a3c69d60.js} +8 -3
- package/es/useSelectCommon-a3c69d60.js.map +1 -0
- package/es/useTextAreaAltEnter-ac460f4c.js +61 -0
- package/es/useTextAreaAltEnter-ac460f4c.js.map +1 -0
- package/package.json +2 -2
- package/amd/BaseCardView-b8119561.js +0 -2
- package/amd/BaseTabBarItem-03c91d3f.js +0 -2
- package/amd/BaseTabBarItem-03c91d3f.js.map +0 -1
- package/amd/CardFlexView-aa2f3de8.js +0 -2
- package/amd/CardGridView-85f90c75.js +0 -2
- package/amd/CheckboxSet-f000e5c2.js +0 -2
- package/amd/ExpandableList-233c279e.js +0 -2
- package/amd/InputDatePicker-48633486.js +0 -2
- package/amd/ListView-2678b2af.js +0 -2
- package/amd/ReorderableTabBar-46683bcb.js +0 -2
- package/amd/StyledDatePickerButton-b664f4f0.js +0 -2
- package/amd/StyledDatePickerButton-b664f4f0.js.map +0 -1
- package/amd/TabBar-fcebb560.js +0 -2
- package/amd/TabBarItem-224bc6b3.js +0 -2
- package/amd/TabBarLinkItem-57587dbd.js +0 -2
- package/amd/TabBarMixed-8cc4b4ed.js +0 -2
- package/amd/VirtualizedListView-a0f338c2.js +0 -2
- package/amd/useSelectCommon-28307b63.js +0 -2
- package/amd/useSelectCommon-28307b63.js.map +0 -1
- package/cjs/CheckboxSetContext-c62db26d.js +0 -12
- package/cjs/OverflowTabBarItem-2c967a89.js.map +0 -1
- package/cjs/StyledDatePickerButton-cf4e4dc0.js.map +0 -1
- package/cjs/useSelectCommon-b0d7feb3.js.map +0 -1
- package/es/OverflowTabBarItem-6966fbc7.js.map +0 -1
- package/es/StyledDatePickerButton-f3971567.js.map +0 -1
- package/es/TextArea-93ce78a7.js +0 -225
- package/es/TextArea-93ce78a7.js.map +0 -1
- package/es/useSelectCommon-309d0f07.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBar-
|
|
1
|
+
{"version":3,"file":"TabBar-de723fbc.js","sources":["../../src/UNSAFE_TabBar/TabBar.tsx"],"sourcesContent":["import type { ComponentChildren, Ref, RefObject } from 'preact';\nimport { HiddenAccessible } from '../UNSAFE_HiddenAccessible';\nimport { LiveRegion } from '../UNSAFE_LiveRegion';\nimport { TabBarContext, TabBarLayout, TabBarContextMenuConfig } from '../UNSAFE_TabBarCommon';\nimport { styles } from './themes/TabBarStyles.css';\nimport { TestIdProps } from '../hooks/UNSAFE_useTestId';\nimport { useTabBar } from '../hooks/PRIVATE_useTabBar';\nimport { forwardRef } from 'preact/compat';\nimport { TabBarContextMenu } from './TabBarContextMenu';\nexport {\n TabBarItem,\n RemovableTabBarItem,\n OverflowTabBarItem,\n TabBarContext,\n useTabBarContext,\n TabBarLayout,\n useProgressiveTruncation,\n TabBarLinkItem\n} from '../UNSAFE_TabBarCommon';\n\n/**\n * type for payload of current key change event handler\n */\nexport type CurrentKeyDetail<K> = {\n value: K;\n};\n\n/**\n * type for payload of selection change event handler\n */\ntype SelectionDetail<K> = {\n value: K;\n};\n\n/**\n * type for payload of remove event handler\n */\ntype RemoveDetail<K> = {\n value: K;\n};\n\ntype DisplayProps =\n | {\n /**\n * Controls the content layout of the TabBarItem: 'standard' lays out the contents horizontally,\n *'icons' hides the label,\n */\n display?: 'standard' | 'icons';\n /**\n * The size indicates how tall the TabBarItem is rendered.\n * Note: It is not possible to specify 'size' when 'display=\"stacked\".\n */\n size?: 'md' | 'lg';\n }\n | {\n /**\n *'stacked' stacks the icon on top of the label.\n * Note: It is not possible to specify 'size' when 'display=\"stacked\".\n */\n display?: 'stacked';\n size?: 'never';\n };\n\nexport type TabBarProps<K extends string | number> = DisplayProps & {\n /**\n * A set of TabBarItem(s) that TabBar will hold\n */\n children: ComponentChildren;\n /**\n * Whether to stretch the tab bar items to occupy available space or to condense items\n */\n layout?: 'stretch' | 'condense';\n /**\n * The position of the TabBar. Valid Values: top and bottom.\n * 'top' is used when TabBar is placed on top of content section and the selection\n * indicator would be placed below the TabBarItem.\n * 'bottom' is used when TabBar is placed on bottom of content section and the selection\n * indicator would be placed above the TabBarItem.\n */\n edge?: 'top' | 'bottom';\n /**\n * Key of the selected item.\n */\n selection?: K;\n /**\n * Callback function to handle when user selects a tab.\n * The callback is also invoked when a user selects a tab that is already selected.\n */\n onSelect?: <K extends string | number>(detail: SelectionDetail<K>) => void;\n /**\n * Callback function to handle remove\n */\n onRemove?: <K extends string | number>(detail: RemoveDetail<K>) => void;\n /**\n * Accepts the ID of an element that provides instructions for interaction with the TabBar.\n */\n 'aria-describedby'?: string;\n /**\n * An aria-label which defines a string value that labels this TabBar.\n * Either aria-label or aria-labelledby should be specified in order to make TabBar accessible.\n */\n 'aria-label'?: string;\n\n /**\n * An aria-labelledby which identifies the element(s) that labels this TabBar.\n * Either aria-label or aria-labelledby should be specified in order to make TabBar accessible.\n */\n 'aria-labelledby'?: string;\n\n /**\n * Configuration used to specify a context menu.\n */\n contextMenuConfig?: TabBarContextMenuConfig<K>;\n};\n/**\n * A tab bar allows navigation between different content sections.\n */\nexport const TabBar = forwardRef(\n <K extends string | number>(\n {\n children,\n layout = 'stretch',\n display = 'standard',\n size = 'md',\n edge = 'top',\n selection,\n onSelect,\n onRemove,\n 'aria-describedby': ariaDescribedBy,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n contextMenuConfig\n }: TabBarProps<K> & TestIdProps,\n ref?: Ref<HTMLDivElement>\n ) => {\n const rootRef = ref as RefObject<HTMLDivElement>;\n\n const {\n rootProps,\n tabBarContext,\n menuProps,\n contextMenuContext,\n contextMenuDescription,\n contextMenuDescriptionId,\n accStatusInfo\n } = useTabBar({\n class: styles.tabBarBase,\n edge: edge,\n onRemove,\n onSelect,\n ref: rootRef,\n selection,\n size,\n children,\n contextMenuConfig\n });\n\n const isContextMenuAvailable = contextMenuConfig != null;\n\n return (\n <>\n <TabBarContext.Provider value={tabBarContext}>\n <div\n {...rootProps}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n aria-haspopup={contextMenuConfig != null ? true : false}\n aria-describedby={\n isContextMenuAvailable && contextMenuDescriptionId\n ? ariaDescribedBy\n ? `${ariaDescribedBy} ${contextMenuDescriptionId}`\n : contextMenuDescriptionId\n : ariaDescribedBy\n }>\n <TabBarLayout layout={layout} display={display}>\n {children}\n </TabBarLayout>\n </div>\n </TabBarContext.Provider>\n {isContextMenuAvailable && contextMenuDescriptionId && (\n <span id={contextMenuDescriptionId}>\n <HiddenAccessible>{contextMenuDescription}</HiddenAccessible>\n </span>\n )}\n {isContextMenuAvailable && accStatusInfo && <LiveRegion>{accStatusInfo}</LiveRegion>}\n {isContextMenuAvailable && (\n <TabBarContextMenu\n {...menuProps}\n contextMenuConfig={contextMenuConfig}\n contextMenuContext={contextMenuContext!}\n />\n )}\n </>\n );\n }\n);\n"],"names":["TabBar","forwardRef","children","layout","display","size","edge","selection","onSelect","onRemove","ariaDescribedBy","ariaLabel","ariaLabelledby","contextMenuConfig","ref","rootRef","rootProps","tabBarContext","menuProps","contextMenuContext","contextMenuDescription","contextMenuDescriptionId","accStatusInfo","useTabBar","class","styles","tabBarBase","isContextMenuAvailable","_jsxs","jsxs","_Fragment","Fragment","_jsx","TabBarContext","Provider","value","jsx","TabBarLayout","id","HiddenAccessible","LiveRegion","TabBarContextMenu"],"mappings":"ihDAqHa,MAAAA,EAASC,EAAUA,YAC9B,EAEIC,WACAC,SAAS,UACTC,UAAU,WACVC,OAAO,KACPC,OAAO,MACPC,YACAC,WACAC,WACA,mBAAoBC,EACpB,aAAcC,EACd,kBAAmBC,EACnBC,qBAEFC,KAEA,MAAMC,EAAUD,GAEVE,UACJA,EAASC,cACTA,EAAaC,UACbA,EAASC,mBACTA,EAAkBC,uBAClBA,EAAsBC,yBACtBA,EAAwBC,cACxBA,GACEC,YAAU,CACZC,MAAOC,EAAMA,OAACC,WACdpB,KAAMA,EACNG,WACAD,WACAM,IAAKC,EACLR,YACAF,OACAH,WACAW,sBAGIc,EAA8C,MAArBd,EAE/B,OACEe,EAAAC,KAAAC,EAAAC,SAAA,CAAA7B,SAAA,CACE8B,EAAAA,IAACC,EAAAA,cAAcC,SAAQ,CAACC,MAAOlB,EAAaf,SAC1C8B,EACMI,IAAA,MAAA,IAAApB,eACQL,EAAS,kBACJC,EAAc,gBACK,MAArBC,EAEb,mBAAAc,GAA0BN,EACtBX,EACE,GAAGA,KAAmBW,IACtBA,EACFX,EAENR,SAAA8B,MAACK,EAAAA,aAAY,CAAClC,OAAQA,EAAQC,QAASA,EACpCF,SAAAA,QAINyB,GAA0BN,GACzBW,MAAM,OAAA,CAAAM,GAAIjB,EACRnB,SAAA8B,EAAAA,IAACO,EAAAA,iBAAkB,CAAArC,SAAAkB,MAGtBO,GAA0BL,GAAiBU,EAACI,IAAAI,aAAY,CAAAtC,SAAAoB,IACxDK,GACCK,EAAAA,IAACS,EAAiBA,kBACZ,IAAAvB,EACJL,kBAAmBA,EACnBM,mBAAoBA,MAI1B"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
define(['exports', 'preact/jsx-runtime', './BaseTabBarItem-d7c2922b'], (function(e,a,t){"use strict";e.TabBarItem=function({itemKey:e,label:i,icon:r,badge:n,metadata:s,severity:b,labelMaxWidth:l,"aria-controls":c}){return a.jsx(t.BaseTabBarItem,{"aria-controls":c,itemKey:e,label:i,icon:r,badge:n,metadata:s,severity:b,labelMaxWidth:l})}}));
|
|
2
|
+
//# sourceMappingURL=TabBarItem-a39c5de3.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarItem-
|
|
1
|
+
{"version":3,"file":"TabBarItem-a39c5de3.js","sources":["../../src/UNSAFE_TabBarCommon/TabBarItem.tsx"],"sourcesContent":["import { BaseTabBarItem, BaseTabBarItemProps } from './BaseTabBarItem';\n\nexport type TabBarItemProps<K extends string | number> = Pick<\n BaseTabBarItemProps<K>,\n | 'itemKey'\n | 'label'\n | 'icon'\n | 'badge'\n | 'metadata'\n | 'severity'\n | 'aria-controls'\n | 'labelMaxWidth'\n>;\n/**\n * TabBarItem content can be created by using labels or icons or both.\n */\nexport function TabBarItem<K extends string | number>({\n itemKey,\n label,\n icon,\n badge,\n metadata,\n severity,\n labelMaxWidth,\n 'aria-controls': ariaControls\n}: TabBarItemProps<K>) {\n return (\n <BaseTabBarItem\n aria-controls={ariaControls}\n itemKey={itemKey}\n label={label}\n icon={icon}\n badge={badge}\n metadata={metadata}\n severity={severity}\n labelMaxWidth={labelMaxWidth}\n />\n );\n}\n"],"names":["itemKey","label","icon","badge","metadata","severity","labelMaxWidth","ariaControls","_jsx","jsx","BaseTabBarItem"],"mappings":"+GAgBM,UAAgDA,QACpDA,EAAOC,MACPA,EAAKC,KACLA,EAAIC,MACJA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,cACRA,EACA,gBAAiBC,IAEjB,OACEC,EAAAC,IAACC,EAAcA,eAAA,CAAA,gBACEH,EACfP,QAASA,EACTC,MAAOA,EACPC,KAAMA,EACNC,MAAOA,EACPC,SAAUA,EACVC,SAAUA,EACVC,cAAeA,GAGrB"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
define(['exports', 'preact/jsx-runtime', './BaseTabBarItem-d7c2922b'], (function(e,a,t){"use strict";e.TabBarLinkItem=function({itemKey:e,icon:r,badge:i,metadata:n,severity:s,labelMaxWidth:b,href:l,label:c,"aria-controls":o}){return a.jsx(t.BaseTabBarItem,{"aria-controls":o,itemKey:e,label:c,icon:r,badge:i,metadata:n,severity:s,labelMaxWidth:b,href:l})}}));
|
|
2
|
+
//# sourceMappingURL=TabBarLinkItem-944b1e8d.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarLinkItem-
|
|
1
|
+
{"version":3,"file":"TabBarLinkItem-944b1e8d.js","sources":["../../src/UNSAFE_TabBarCommon/TabBarLinkItem.tsx"],"sourcesContent":["import { BaseTabBarItem, BaseTabBarItemProps } from './BaseTabBarItem';\n\ntype Link = {\n /**\n * Sets the URL that the hyperlink points to. If there is no valid URL use \"#\" for href value to navigate to the top of the page. \n */\n href: string;\n /**\n * Label of the TabBarLinkItem. For truncated labels this is the content\n * for tooltip text of the Tab.\n */\n label: string;\n};\nexport type TabBarLinkItemProps<K extends string | number> = Link &\n Pick<\n BaseTabBarItemProps<K>,\n 'itemKey' | 'icon' | 'badge' | 'metadata' | 'severity' | 'aria-controls' | 'labelMaxWidth'\n >;\n/**\n * TabBarLinkItem is used to render links in a TabBar. It allows to view the browser's built in link context menu to open the link in new browser tab.\n */\nexport function TabBarLinkItem<K extends string | number>({\n itemKey,\n icon,\n badge,\n metadata,\n severity,\n labelMaxWidth,\n href,\n label,\n 'aria-controls': ariaControls\n}: TabBarLinkItemProps<K>) {\n return (\n <BaseTabBarItem\n aria-controls={ariaControls}\n itemKey={itemKey}\n label={label}\n icon={icon}\n badge={badge}\n metadata={metadata}\n severity={severity}\n labelMaxWidth={labelMaxWidth}\n href={href}></BaseTabBarItem>\n );\n}\n"],"names":["itemKey","icon","badge","metadata","severity","labelMaxWidth","href","label","ariaControls","_jsx","jsx","BaseTabBarItem"],"mappings":"mHAqBM,UAAoDA,QACxDA,EAAOC,KACPA,EAAIC,MACJA,EAAKC,SACLA,EAAQC,SACRA,EAAQC,cACRA,EAAaC,KACbA,EAAIC,MACJA,EACA,gBAAiBC,IAEjB,OACEC,EAACC,IAAAC,iBACgB,CAAA,gBAAAH,EACfR,QAASA,EACTO,MAAOA,EACPN,KAAMA,EACNC,MAAOA,EACPC,SAAUA,EACVC,SAAUA,EACVC,cAAeA,EACfC,KAAMA,GAEZ"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
define(['exports', 'preact/jsx-runtime', 'preact/hooks', 'preact/compat', './LayerHost-0b288129', './UNSAFE_Text/themes/TextStyles.css', './Flex-4b81b412', './useTabBarContext-15a23bb6', './flexitem-5db48325', './dimensions-95c0c920', './boxalignment-8d80de7e', './logger-0f873e29', 'css!./TabBarItemStyles.styles.css', 'module', './UNSAFE_TabBarCommon/themes/redwood/TabBarItemVariants.css', 'css!./BadgeStyles.styles.css', 'module', './UNSAFE_Badge/themes/redwood/BadgeVariants.css', './ConveyorBeltContext-d8653090', './BusyStateContext-ab2c549a', './TabbableModeContext-a9c97640', 'preact', './mergeProps-bcfa6a92', 'css!./TooltipContentStyles.styles.css', 'module', './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css', './tooltipUtils-2bb62284', 'css!./IconStyle.styles.css', './HiddenAccessible-037ef42d', './BaseButton-5a0ad529', './ButtonLabelLayout-6464870c', './Floating-c3558e44', 'css!./LayerStyles.styles.css', './keyboardUtils-fb6219eb', './tabbableUtils-f95361a6', './CollectionInteractionContext-0b4ed98b', 'css!./dropdownStyles.styles.css', './Sheet-1d02491d', 'css!./OverflowTabBarItemStyles.styles.css', './StyledCheckbox-368fed68', 'css!./SelectorStyles.styles.css', './clientUtils-f1eea2db', './UNSAFE_TabBarMixed/themes/TabBarMixedStyles.css', './useTabBar-b05edef0', './LiveRegion-dbefb95b', './TabBarContextMenu-6a167e27', './ConveyorBeltFocusContext-7d718341'], (function(e,t,s,o,a,n,r,l,c,i,b,d,u,m,x,y,B,T,C,f,h,S,p,g,M,v,F,A,I,U,E,k,w,R,_,j,N,P,L,H,V,D,K,O,z,q,G){"use strict";const J=o.forwardRef(((e,a)=>{const{children:n,onRemove:r,onSelect:c,selection:i,size:b,"aria-label":d,"aria-labelledby":u}=e,m=s.useRef(null),x=D.isMobile(),y=s.useMemo((()=>({itemsRenderer:e=>{if(e){if(null!=O.getItemAttribute(e.itemKey,m.current,O.REMOVABLE_ITEM_ATTRIBUTE)&&x){const s=e.defaultMenuItems;return t.jsx(t.Fragment,{children:s})}}return null}})),[]),{rootProps:B,tabBarContext:T,menuProps:C,contextMenuContext:f,contextMenuDescription:h,contextMenuDescriptionId:S,accStatusInfo:g}=(M={class:K.styles.tabBarBase,edge:"bottom",onRemove:r,onSelect:c,ref:m,selection:i,size:b,children:n,contextMenuConfig:y},O.useTabBar(M));var M;const v=null!=y&&x;o.useImperativeHandle(a,(()=>({focus:()=>{m.current&&m.current.focus()},blur:()=>{m.current&&m.current.blur()}})));const[F,A]=s.useState(!1),U=s.useCallback((()=>{m.current?.focus()}),[]),E=s.useCallback((()=>{A(!0)}),[]),k=s.useCallback((()=>{A(!1)}),[]),w=s.useCallback((e=>{"Tab"!==e.key||e.shiftKey||E?.()}),[E]),R=s.useCallback((()=>{k?.()}),[k]),_=s.useMemo((()=>({focusTabbarRoot:U,isSuppressOverflowFocus:F,beginTabPass:E,endTabPass:k})),[F,U,E,k]),j=p.mergeProps(B,{onKeyDown:w,onBlur:R});return t.jsxs(G.ConveyorBeltFocusContext.Provider,{value:_,children:[t.jsx(l.TabBarContext.Provider,{value:T,children:t.jsx("div",{"aria-label":d,"aria-labelledby":u,...j,children:n})}),v&&S&&h&&t.jsx("span",{id:S,children:t.jsx(I.HiddenAccessible,{children:h})}),v&&g&&t.jsx(z.LiveRegion,{children:g}),v&&t.jsx(q.TabBarContextMenu,{...C,contextMenuConfig:y,contextMenuContext:f})]})}));e.TabBarMixed=J}));
|
|
2
|
+
//# sourceMappingURL=TabBarMixed-cfd346bf.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabBarMixed-8cc4b4ed.js","sources":["../../src/UNSAFE_TabBarMixed/TabBarMixed.tsx","../../src/UNSAFE_TabBarMixed/useTabBarMixed.ts"],"sourcesContent":["import type { ComponentChildren } from 'preact';\nimport { useMemo, useRef, useCallback, useState } from 'preact/hooks';\nimport { Ref } from 'preact';\nimport { forwardRef, useImperativeHandle } from 'preact/compat';\nimport { TabBarContext, TabBarContextMenuConfig } from '../UNSAFE_TabBarCommon';\nimport { isMobile } from '#utils/UNSAFE_clientUtils';\nimport { styles } from './themes/TabBarMixedStyles.css';\nimport { useTabBarMixed as useTabBar } from './useTabBarMixed';\nimport { REMOVABLE_ITEM_ATTRIBUTE, getItemAttribute } from '../hooks/PRIVATE_useTabBar/useTabBar';\nimport { LiveRegion } from '../UNSAFE_LiveRegion';\nimport { HiddenAccessible } from '../UNSAFE_HiddenAccessible';\nimport { TabBarContextMenu } from '../UNSAFE_TabBar/TabBarContextMenu';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps/mergeProps';\nimport { ConveyorBeltFocusContext } from '../UNSAFE_ConveyorBelt';\n\ntype UseTabBarOptions = Parameters<typeof useTabBar>[0];\n\n/**\n * Component props expected to be pased to **TabBarMixed**.\n *\n * @see {@link TabBarMixed}\n */\ntype TabBarMixedProps<K extends string | number> = {\n /**\n * Component children that will be rendered within the **TabBarMixed**\n * root element.\n *\n * It is expected that **TabBarLayout** and **ConveyorBelt** elements are\n * provided. The same **TabBarItem**, **RemovableTabBarItem**,\n * and **OverflowTabBarItem** elements should also be used.\n */\n children?: ComponentChildren;\n /**\n * Callback fired when a tab item is removed.\n */\n onRemove?: UseTabBarOptions['onRemove'];\n /**\n * Callback fired when a tab item is selected.\n */\n onSelect?: UseTabBarOptions['onSelect'];\n /**\n * The item key of the selected tab item.\n */\n selection?: K;\n /**\n * The height of the the tab bar.\n *\n * @default \"md\"\n */\n size?: UseTabBarOptions['size'];\n /**\n * An aria-label which defines a string value that labels this TabBarMixed.\n * Either aria-label or aria-labelledby should be specified in order to make TabBarMixed accessible.\n */\n 'aria-label'?: string;\n\n /**\n * An aria-labelledby which identifies the element(s) that labels this TabBarMixed.\n * Either aria-label or aria-labelledby should be specified in order to make TabBarMixed accessible.\n */\n 'aria-labelledby'?: string;\n};\n\nexport type FocusableHandle = {\n focus: () => void;\n blur: () => void;\n};\n\n/**\n * A navigation component that enables horizontal navigation between distinct content with a mixture of static and dynamic tabs.\n *\n * @param {TabBarMixedProps} props TabBarMixed component props.\n * @returns {JSX.Element} TabBarMixed component element.\n */\nexport const TabBarMixed = forwardRef(\n <K extends string | number>(\n props: TabBarMixedProps<K>,\n focusHandleRef?: Ref<FocusableHandle>\n ) => {\n const {\n children,\n onRemove,\n onSelect,\n selection,\n size,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby\n } = props;\n\n const rootRef = useRef<HTMLDivElement>(null);\n\n const isMobileDevice = isMobile();\n const defaultContextMenuConfig = useMemo<TabBarContextMenuConfig<string | number>>(() => {\n return {\n itemsRenderer: (context) => {\n //Only if context is available, it is a mobile device and it is removable item, we will return remove context menu item\n if (context) {\n const isRemovableItem =\n getItemAttribute(context.itemKey, rootRef.current!, REMOVABLE_ITEM_ATTRIBUTE) != null;\n if (isRemovableItem && isMobileDevice) {\n const defaultItems = context.defaultMenuItems;\n return <>{defaultItems}</>;\n }\n }\n return null;\n }\n };\n }, []);\n\n const {\n rootProps,\n tabBarContext,\n menuProps,\n contextMenuContext,\n contextMenuDescription,\n contextMenuDescriptionId,\n accStatusInfo\n } = useTabBar({\n class: styles.tabBarBase,\n edge: 'bottom',\n onRemove,\n onSelect,\n ref: rootRef,\n selection,\n size,\n children,\n contextMenuConfig: defaultContextMenuConfig\n });\n\n const isContextMenuAvailable = defaultContextMenuConfig != null && isMobileDevice;\n //Allows to call focus on rootRef without having to expose it\n useImperativeHandle(focusHandleRef!, () => ({\n focus: () => {\n if (rootRef.current) {\n rootRef.current.focus();\n }\n },\n blur: () => {\n if (rootRef.current) {\n rootRef.current.blur();\n }\n }\n }));\n\n const [isSuppressOverflowFocus, setIsSuppressOverflowFocus] = useState(false);\n\n const focusTabbarRoot = useCallback(() => {\n rootRef.current?.focus();\n }, []);\n\n // Begin a short window where overflow div should not be focusable.\n const beginTabPass = useCallback(() => {\n setIsSuppressOverflowFocus(true);\n }, []);\n\n // End that window after focus moves away.\n const endTabPass = useCallback(() => {\n setIsSuppressOverflowFocus(false);\n }, []);\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent) => {\n // We only want to suppress overflow focus when the user is tabbing.\n if (e.key === 'Tab' && !e.shiftKey) {\n // Tell conveyor to make its overflow non-focusable (tabIndex = -1)\n beginTabPass?.();\n }\n },\n [beginTabPass]\n );\n\n const onBlur = useCallback(() => {\n // End that suppress overflow after focus moves away.\n endTabPass?.();\n }, [endTabPass]);\n\n const focusContext = useMemo(\n () => ({\n focusTabbarRoot,\n isSuppressOverflowFocus,\n beginTabPass,\n endTabPass\n }),\n [isSuppressOverflowFocus, focusTabbarRoot, beginTabPass, endTabPass]\n );\n\n const mergedRootProps = mergeProps(rootProps, { onKeyDown, onBlur });\n\n return (\n <ConveyorBeltFocusContext.Provider value={focusContext}>\n <TabBarContext.Provider value={tabBarContext}>\n <div aria-label={ariaLabel} aria-labelledby={ariaLabelledby} {...mergedRootProps}>\n {children}\n </div>\n </TabBarContext.Provider>\n {isContextMenuAvailable && contextMenuDescriptionId && contextMenuDescription && (\n <span id={contextMenuDescriptionId}>\n <HiddenAccessible>{contextMenuDescription}</HiddenAccessible>\n </span>\n )}\n {isContextMenuAvailable && accStatusInfo && <LiveRegion>{accStatusInfo}</LiveRegion>}\n {isContextMenuAvailable && (\n <TabBarContextMenu\n {...menuProps}\n contextMenuConfig={defaultContextMenuConfig}\n contextMenuContext={contextMenuContext!}\n />\n )}\n </ConveyorBeltFocusContext.Provider>\n );\n }\n);\n","import type { ComponentProps, ContextType, RefObject } from 'preact';\nimport type { TabBarContext, TabBarLayout } from '../UNSAFE_TabBarCommon';\nimport { TabBar } from '../UNSAFE_TabBar/TabBar';\nimport { useTabBar } from '../hooks/PRIVATE_useTabBar';\n\ntype TabBarContextValue = ContextType<typeof TabBarContext>;\n\nexport type useTabBarOptions = {\n class?: string;\n display?: TabBarContextValue['display'];\n edge?: 'bottom' | 'top';\n onRemove?: TabBarContextValue['onRemove'];\n onSelect?: TabBarContextValue['onSelect'];\n ref?: RefObject<HTMLDivElement>;\n selection?: TabBarContextValue['selection'];\n size?: TabBarContextValue['size'];\n children?: ComponentProps<typeof TabBarLayout>['children'];\n contextMenuConfig?: ComponentProps<typeof TabBar>['contextMenuConfig'];\n};\n\n/**\n * A thin wrapper around useTabBar hook\n */\nexport function useTabBarMixed(options: useTabBarOptions) {\n return useTabBar(options);\n}\n"],"names":["TabBarMixed","forwardRef","props","focusHandleRef","children","onRemove","onSelect","selection","size","ariaLabel","ariaLabelledby","rootRef","useRef","isMobileDevice","isMobile","defaultContextMenuConfig","useMemo","itemsRenderer","context","getItemAttribute","itemKey","current","REMOVABLE_ITEM_ATTRIBUTE","defaultItems","defaultMenuItems","_jsx","jsx","_Fragment","Fragment","rootProps","tabBarContext","menuProps","contextMenuContext","contextMenuDescription","contextMenuDescriptionId","accStatusInfo","options","class","styles","tabBarBase","edge","ref","contextMenuConfig","useTabBar","isContextMenuAvailable","useImperativeHandle","focus","blur","isSuppressOverflowFocus","setIsSuppressOverflowFocus","useState","focusTabbarRoot","useCallback","beginTabPass","endTabPass","onKeyDown","e","key","shiftKey","onBlur","focusContext","mergedRootProps","mergeProps","_jsxs","jsxs","ConveyorBeltFocusContext","Provider","value","TabBarContext","id","HiddenAccessible","LiveRegion","TabBarContextMenu"],"mappings":"8hDA0Ea,MAAAA,EAAcC,EAAUA,YACnC,CACEC,EACAC,KAEA,MAAMC,SACJA,EAAQC,SACRA,EAAQC,SACRA,EAAQC,UACRA,EAASC,KACTA,EACA,aAAcC,EACd,kBAAmBC,GACjBR,EAEES,EAAUC,SAAuB,MAEjCC,EAAiBC,EAAAA,WACjBC,EAA2BC,EAAAA,SAAkD,KAC1E,CACLC,cAAgBC,IAEd,GAAIA,EAAS,CAGX,GADmF,MAAjFC,EAAgBA,iBAACD,EAAQE,QAAST,EAAQU,QAAUC,6BAC/BT,EAAgB,CACrC,MAAMU,EAAeL,EAAQM,iBAC7B,OAAOC,EAAAC,IAAAC,EAAAC,SAAA,CAAAxB,SAAGmB,GACX,CACF,CACD,OAAO,IAAI,KAGd,KAEGM,UACJA,EAASC,cACTA,EAAaC,UACbA,EAASC,mBACTA,EAAkBC,uBAClBA,EAAsBC,yBACtBA,EAAwBC,cACxBA,IC7FyBC,ED8Fb,CACZC,MAAOC,EAAMA,OAACC,WACdC,KAAM,SACNnC,WACAC,WACAmC,IAAK9B,EACLJ,YACAC,OACAJ,WACAsC,kBAAmB3B,GCtGhB4B,EAAAA,UAAUP,IADb,IAAyBA,ED0G3B,MAAMQ,EAAqD,MAA5B7B,GAAoCF,EAEnEgC,EAAmBA,oBAAC1C,GAAiB,KAAO,CAC1C2C,MAAO,KACDnC,EAAQU,SACVV,EAAQU,QAAQyB,OACjB,EAEHC,KAAM,KACApC,EAAQU,SACVV,EAAQU,QAAQ0B,MACjB,MAIL,MAAOC,EAAyBC,GAA8BC,EAAQA,UAAC,GAEjEC,EAAkBC,EAAAA,aAAY,KAClCzC,EAAQU,SAASyB,OAAO,GACvB,IAGGO,EAAeD,EAAAA,aAAY,KAC/BH,GAA2B,EAAK,GAC/B,IAGGK,EAAaF,EAAAA,aAAY,KAC7BH,GAA2B,EAAM,GAChC,IAEGM,EAAYH,eACfI,IAEe,QAAVA,EAAEC,KAAkBD,EAAEE,UAExBL,KACD,GAEH,CAACA,IAGGM,EAASP,EAAAA,aAAY,KAEzBE,KAAc,GACb,CAACA,IAEEM,EAAe5C,EAAAA,SACnB,KAAO,CACLmC,kBACAH,0BACAK,eACAC,gBAEF,CAACN,EAAyBG,EAAiBE,EAAcC,IAGrDO,EAAkBC,EAAAA,WAAWjC,EAAW,CAAE0B,YAAWI,WAE3D,OACEI,EAACC,KAAAC,EAAwBA,yBAACC,UAASC,MAAOP,EAAYxD,SAAA,CACpDqB,MAAC2C,EAAaA,cAACF,SAAQ,CAACC,MAAOrC,EAC7B1B,SAAAqB,EAAAA,IAAA,MAAA,CAAA,aAAiBhB,EAA4B,kBAAAC,KAAoBmD,WAC9DzD,MAGJwC,GAA0BV,GAA4BD,GACrDR,EAAMC,IAAA,OAAA,CAAA2C,GAAInC,WACRT,EAACC,IAAA4C,EAAgBA,iBAAE,CAAAlE,SAAA6B,MAGtBW,GAA0BT,GAAiBV,MAAC8C,EAAUA,WAAA,CAAAnE,SAAE+B,IACxDS,GACCnB,EAAAA,IAAC+C,EAAAA,kBACK,IAAAzC,EACJW,kBAAmB3B,EACnBiB,mBAAoBA,MAI1B"}
|
|
1
|
+
{"version":3,"file":"TabBarMixed-cfd346bf.js","sources":["../../src/UNSAFE_TabBarMixed/TabBarMixed.tsx","../../src/UNSAFE_TabBarMixed/useTabBarMixed.ts"],"sourcesContent":["import type { ComponentChildren } from 'preact';\nimport { useMemo, useRef, useCallback, useState } from 'preact/hooks';\nimport { Ref } from 'preact';\nimport { forwardRef, useImperativeHandle } from 'preact/compat';\nimport { TabBarContext, TabBarContextMenuConfig } from '../UNSAFE_TabBarCommon';\nimport { isMobile } from '#utils/UNSAFE_clientUtils';\nimport { styles } from './themes/TabBarMixedStyles.css';\nimport { useTabBarMixed as useTabBar } from './useTabBarMixed';\nimport { REMOVABLE_ITEM_ATTRIBUTE, getItemAttribute } from '../hooks/PRIVATE_useTabBar/useTabBar';\nimport { LiveRegion } from '../UNSAFE_LiveRegion';\nimport { HiddenAccessible } from '../UNSAFE_HiddenAccessible';\nimport { TabBarContextMenu } from '../UNSAFE_TabBar/TabBarContextMenu';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps/mergeProps';\nimport { ConveyorBeltFocusContext } from '../UNSAFE_ConveyorBelt';\n\ntype UseTabBarOptions = Parameters<typeof useTabBar>[0];\n\n/**\n * Component props expected to be pased to **TabBarMixed**.\n *\n * @see {@link TabBarMixed}\n */\ntype TabBarMixedProps<K extends string | number> = {\n /**\n * Component children that will be rendered within the **TabBarMixed**\n * root element.\n *\n * It is expected that **TabBarLayout** and **ConveyorBelt** elements are\n * provided. The same **TabBarItem**, **RemovableTabBarItem**,\n * and **OverflowTabBarItem** elements should also be used.\n */\n children?: ComponentChildren;\n /**\n * Callback fired when a tab item is removed.\n */\n onRemove?: UseTabBarOptions['onRemove'];\n /**\n * Callback fired when a tab item is selected.\n */\n onSelect?: UseTabBarOptions['onSelect'];\n /**\n * The item key of the selected tab item.\n */\n selection?: K;\n /**\n * The height of the the tab bar.\n *\n * @default \"md\"\n */\n size?: UseTabBarOptions['size'];\n /**\n * An aria-label which defines a string value that labels this TabBarMixed.\n * Either aria-label or aria-labelledby should be specified in order to make TabBarMixed accessible.\n */\n 'aria-label'?: string;\n\n /**\n * An aria-labelledby which identifies the element(s) that labels this TabBarMixed.\n * Either aria-label or aria-labelledby should be specified in order to make TabBarMixed accessible.\n */\n 'aria-labelledby'?: string;\n};\n\nexport type FocusableHandle = {\n focus: () => void;\n blur: () => void;\n};\n\n/**\n * A navigation component that enables horizontal navigation between distinct content with a mixture of static and dynamic tabs.\n *\n * @param {TabBarMixedProps} props TabBarMixed component props.\n * @returns {JSX.Element} TabBarMixed component element.\n */\nexport const TabBarMixed = forwardRef(\n <K extends string | number>(\n props: TabBarMixedProps<K>,\n focusHandleRef?: Ref<FocusableHandle>\n ) => {\n const {\n children,\n onRemove,\n onSelect,\n selection,\n size,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby\n } = props;\n\n const rootRef = useRef<HTMLDivElement>(null);\n\n const isMobileDevice = isMobile();\n const defaultContextMenuConfig = useMemo<TabBarContextMenuConfig<string | number>>(() => {\n return {\n itemsRenderer: (context) => {\n //Only if context is available, it is a mobile device and it is removable item, we will return remove context menu item\n if (context) {\n const isRemovableItem =\n getItemAttribute(context.itemKey, rootRef.current!, REMOVABLE_ITEM_ATTRIBUTE) != null;\n if (isRemovableItem && isMobileDevice) {\n const defaultItems = context.defaultMenuItems;\n return <>{defaultItems}</>;\n }\n }\n return null;\n }\n };\n }, []);\n\n const {\n rootProps,\n tabBarContext,\n menuProps,\n contextMenuContext,\n contextMenuDescription,\n contextMenuDescriptionId,\n accStatusInfo\n } = useTabBar({\n class: styles.tabBarBase,\n edge: 'bottom',\n onRemove,\n onSelect,\n ref: rootRef,\n selection,\n size,\n children,\n contextMenuConfig: defaultContextMenuConfig\n });\n\n const isContextMenuAvailable = defaultContextMenuConfig != null && isMobileDevice;\n //Allows to call focus on rootRef without having to expose it\n useImperativeHandle(focusHandleRef!, () => ({\n focus: () => {\n if (rootRef.current) {\n rootRef.current.focus();\n }\n },\n blur: () => {\n if (rootRef.current) {\n rootRef.current.blur();\n }\n }\n }));\n\n const [isSuppressOverflowFocus, setIsSuppressOverflowFocus] = useState(false);\n\n const focusTabbarRoot = useCallback(() => {\n rootRef.current?.focus();\n }, []);\n\n // Begin a short window where overflow div should not be focusable.\n const beginTabPass = useCallback(() => {\n setIsSuppressOverflowFocus(true);\n }, []);\n\n // End that window after focus moves away.\n const endTabPass = useCallback(() => {\n setIsSuppressOverflowFocus(false);\n }, []);\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent) => {\n // We only want to suppress overflow focus when the user is tabbing.\n if (e.key === 'Tab' && !e.shiftKey) {\n // Tell conveyor to make its overflow non-focusable (tabIndex = -1)\n beginTabPass?.();\n }\n },\n [beginTabPass]\n );\n\n const onBlur = useCallback(() => {\n // End that suppress overflow after focus moves away.\n endTabPass?.();\n }, [endTabPass]);\n\n const focusContext = useMemo(\n () => ({\n focusTabbarRoot,\n isSuppressOverflowFocus,\n beginTabPass,\n endTabPass\n }),\n [isSuppressOverflowFocus, focusTabbarRoot, beginTabPass, endTabPass]\n );\n\n const mergedRootProps = mergeProps(rootProps, { onKeyDown, onBlur });\n\n return (\n <ConveyorBeltFocusContext.Provider value={focusContext}>\n <TabBarContext.Provider value={tabBarContext}>\n <div aria-label={ariaLabel} aria-labelledby={ariaLabelledby} {...mergedRootProps}>\n {children}\n </div>\n </TabBarContext.Provider>\n {isContextMenuAvailable && contextMenuDescriptionId && contextMenuDescription && (\n <span id={contextMenuDescriptionId}>\n <HiddenAccessible>{contextMenuDescription}</HiddenAccessible>\n </span>\n )}\n {isContextMenuAvailable && accStatusInfo && <LiveRegion>{accStatusInfo}</LiveRegion>}\n {isContextMenuAvailable && (\n <TabBarContextMenu\n {...menuProps}\n contextMenuConfig={defaultContextMenuConfig}\n contextMenuContext={contextMenuContext!}\n />\n )}\n </ConveyorBeltFocusContext.Provider>\n );\n }\n);\n","import type { ComponentProps, ContextType, RefObject } from 'preact';\nimport type { TabBarContext, TabBarLayout } from '../UNSAFE_TabBarCommon';\nimport { TabBar } from '../UNSAFE_TabBar/TabBar';\nimport { useTabBar } from '../hooks/PRIVATE_useTabBar';\n\ntype TabBarContextValue = ContextType<typeof TabBarContext>;\n\nexport type useTabBarOptions = {\n class?: string;\n display?: TabBarContextValue['display'];\n edge?: 'bottom' | 'top';\n onRemove?: TabBarContextValue['onRemove'];\n onSelect?: TabBarContextValue['onSelect'];\n ref?: RefObject<HTMLDivElement>;\n selection?: TabBarContextValue['selection'];\n size?: TabBarContextValue['size'];\n children?: ComponentProps<typeof TabBarLayout>['children'];\n contextMenuConfig?: ComponentProps<typeof TabBar>['contextMenuConfig'];\n};\n\n/**\n * A thin wrapper around useTabBar hook\n */\nexport function useTabBarMixed(options: useTabBarOptions) {\n return useTabBar(options);\n}\n"],"names":["TabBarMixed","forwardRef","props","focusHandleRef","children","onRemove","onSelect","selection","size","ariaLabel","ariaLabelledby","rootRef","useRef","isMobileDevice","isMobile","defaultContextMenuConfig","useMemo","itemsRenderer","context","getItemAttribute","itemKey","current","REMOVABLE_ITEM_ATTRIBUTE","defaultItems","defaultMenuItems","_jsx","jsx","_Fragment","Fragment","rootProps","tabBarContext","menuProps","contextMenuContext","contextMenuDescription","contextMenuDescriptionId","accStatusInfo","options","class","styles","tabBarBase","edge","ref","contextMenuConfig","useTabBar","isContextMenuAvailable","useImperativeHandle","focus","blur","isSuppressOverflowFocus","setIsSuppressOverflowFocus","useState","focusTabbarRoot","useCallback","beginTabPass","endTabPass","onKeyDown","e","key","shiftKey","onBlur","focusContext","mergedRootProps","mergeProps","_jsxs","jsxs","ConveyorBeltFocusContext","Provider","value","TabBarContext","id","HiddenAccessible","LiveRegion","TabBarContextMenu"],"mappings":"4lDA0Ea,MAAAA,EAAcC,EAAUA,YACnC,CACEC,EACAC,KAEA,MAAMC,SACJA,EAAQC,SACRA,EAAQC,SACRA,EAAQC,UACRA,EAASC,KACTA,EACA,aAAcC,EACd,kBAAmBC,GACjBR,EAEES,EAAUC,SAAuB,MAEjCC,EAAiBC,EAAAA,WACjBC,EAA2BC,EAAAA,SAAkD,KAC1E,CACLC,cAAgBC,IAEd,GAAIA,EAAS,CAGX,GADmF,MAAjFC,EAAgBA,iBAACD,EAAQE,QAAST,EAAQU,QAAUC,6BAC/BT,EAAgB,CACrC,MAAMU,EAAeL,EAAQM,iBAC7B,OAAOC,EAAAC,IAAAC,EAAAC,SAAA,CAAAxB,SAAGmB,GACX,CACF,CACD,OAAO,IAAI,KAGd,KAEGM,UACJA,EAASC,cACTA,EAAaC,UACbA,EAASC,mBACTA,EAAkBC,uBAClBA,EAAsBC,yBACtBA,EAAwBC,cACxBA,IC7FyBC,ED8Fb,CACZC,MAAOC,EAAMA,OAACC,WACdC,KAAM,SACNnC,WACAC,WACAmC,IAAK9B,EACLJ,YACAC,OACAJ,WACAsC,kBAAmB3B,GCtGhB4B,EAAAA,UAAUP,IADb,IAAyBA,ED0G3B,MAAMQ,EAAqD,MAA5B7B,GAAoCF,EAEnEgC,EAAmBA,oBAAC1C,GAAiB,KAAO,CAC1C2C,MAAO,KACDnC,EAAQU,SACVV,EAAQU,QAAQyB,OACjB,EAEHC,KAAM,KACApC,EAAQU,SACVV,EAAQU,QAAQ0B,MACjB,MAIL,MAAOC,EAAyBC,GAA8BC,EAAQA,UAAC,GAEjEC,EAAkBC,EAAAA,aAAY,KAClCzC,EAAQU,SAASyB,OAAO,GACvB,IAGGO,EAAeD,EAAAA,aAAY,KAC/BH,GAA2B,EAAK,GAC/B,IAGGK,EAAaF,EAAAA,aAAY,KAC7BH,GAA2B,EAAM,GAChC,IAEGM,EAAYH,eACfI,IAEe,QAAVA,EAAEC,KAAkBD,EAAEE,UAExBL,KACD,GAEH,CAACA,IAGGM,EAASP,EAAAA,aAAY,KAEzBE,KAAc,GACb,CAACA,IAEEM,EAAe5C,EAAAA,SACnB,KAAO,CACLmC,kBACAH,0BACAK,eACAC,gBAEF,CAACN,EAAyBG,EAAiBE,EAAcC,IAGrDO,EAAkBC,EAAAA,WAAWjC,EAAW,CAAE0B,YAAWI,WAE3D,OACEI,EAACC,KAAAC,EAAwBA,yBAACC,UAASC,MAAOP,EAAYxD,SAAA,CACpDqB,MAAC2C,EAAaA,cAACF,SAAQ,CAACC,MAAOrC,EAC7B1B,SAAAqB,EAAAA,IAAA,MAAA,CAAA,aAAiBhB,EAA4B,kBAAAC,KAAoBmD,WAC9DzD,MAGJwC,GAA0BV,GAA4BD,GACrDR,EAAMC,IAAA,OAAA,CAAA2C,GAAInC,WACRT,EAACC,IAAA4C,EAAgBA,iBAAE,CAAAlE,SAAA6B,MAGtBW,GAA0BT,GAAiBV,MAAC8C,EAAUA,WAAA,CAAAnE,SAAE+B,IACxDS,GACCnB,EAAAA,IAAC+C,EAAAA,kBACK,IAAAzC,EACJW,kBAAmB3B,EACnBiB,mBAAoBA,MAI1B"}
|