@oracle/oraclejet-preact 20.0.2 → 20.0.3

package/cjs/UNSAFE_TabBarMixed.js

@@ -33,6 +33,12 @@ require('./tooltipUtils-2bc15136.js');
 var HiddenAccessible = require('./HiddenAccessible-087eb49a.js');
 require('./BaseButton-d8f96bfa.js');
 require('./ButtonLabelLayout-c876923f.js');
+require('./NavigationList-d0d74565.js');
+require('./useNavigationListItem-b97e76d5.js');
+require('./UNSAFE_NavigationList/themes/NavigationListItemStyles.css.js');
+
+require('./UNSAFE_NavigationList/themes/redwood/NavigationListItemVariants.css.js');
+
 require('./Floating-79cbe5ad.js');
 
 require('./keyboardUtils-b42fe7d5.js');
@@ -41,6 +47,8 @@ require('./CollectionInteractionContext-f84ff7a1.js');
 
 require('./Sheet-1d6e8cf8.js');
 
+require('./StyledCheckbox-9047ed7d.js');
+
 var clientUtils = require('./clientUtils-ef5e20ce.js');
 var UNSAFE_TabBarMixed_themes_TabBarMixedStyles_css = require('./UNSAFE_TabBarMixed/themes/TabBarMixedStyles.css.js');
 var useTabBar = require('./useTabBar-35b73d10.js');
@@ -49,7 +57,7 @@ var TabBarContextMenu = require('./TabBarContextMenu-d9bf65c2.js');
 var ConveyorBeltFocusContext = require('./ConveyorBeltFocusContext-0e08d043.js');
 var View = require('./View-ed116d78.js');
 var UNSAFE_TabBarMixed_themes_TabBarMixedSeparator_css = require('./UNSAFE_TabBarMixed/themes/TabBarMixedSeparator.css.js');
-var OverflowTabBarItem = require('./OverflowTabBarItem-abcd2327.js');
+var OverflowTabBarItem = require('./OverflowTabBarItem-19ad4971.js');
 
 require('./index-0aa99b92.js');
 require('./UNSAFE_Layer/themes/LayerHostStyles.css.js');
@@ -116,8 +124,27 @@ require('./UNSAFE_ButtonLabelLayout/themes/redwood/ButtonLabelLayoutBaseTheme.cs
 
 require('./UNSAFE_ButtonLabelLayout/themes/redwood/ButtonLabelLayoutVariants.css.js');
 
-require('./useFloating-c753a7f9.js');
+require('./UNSAFE_NavigationList/themes/NavigationListStyles.css.js');
+
+require('./collectionUtils-f1d3183f.js');
+require('./keys-25710458.js');
+require('./Selector-6550b8e0.js');
+require('./BaseSelector-2dc69917.js');
+require('./useFocus-1b288fb9.js');
+require('./PRIVATE_BaseSelector/themes/SelectorStyles.css.js');
+require('./useCollectionInteractionContext-6fc0200e.js');
+require('./useCollectionFocusRing-bed0aa16.js');
+require('./useCurrentKey-1b9e3382.js');
 require('./useUser-1295b5cb.js');
+require('./useContextMenuGesture-530ef8dd.js');
+require('./textSelectionUtils-57082239.js');
+require('./useTranslationBundle-12dd087d.js');
+require('./useInteractionStyle-c203a8a0.js');
+require('./UNSAFE_NavigationListCommon/themes/redwood/NavigationListItemTheme.js');
+require('./UNSAFE_NavigationList/themes/redwood/NavigationListItemBaseTheme.css.js');
+
+
+require('./useFloating-c753a7f9.js');
 require('./positionUtils-a780137e.js');
 require('./refUtils-a9872e75.js');
 require('./useOutsideClick-dbf3d604.js');
@@ -152,14 +179,6 @@ require('./UNSAFE_Sheet/themes/SheetStyles.css.js');
 require('./useAnimationStatus-8075dc19.js');
 require('./useAnimation-65c0e455.js');
 require('./animationUtils-54852d03.js');
-require('./useTranslationBundle-12dd087d.js');
-
-require('./collectionUtils-f1d3183f.js');
-require('./keys-25710458.js');
-require('./Selector-6550b8e0.js');
-require('./BaseSelector-2dc69917.js');
-require('./useFocus-1b288fb9.js');
-require('./StyledCheckbox-9047ed7d.js');
 require('./Check-1272bb86.js');
 require('./Icon-56789beb.js');
 require('./useTooltip-34accecc.js');
@@ -181,15 +200,9 @@ require('./UNSAFE_Checkbox/themes/redwood/CheckboxIconBaseTheme.css.js');
 require('./UNSAFE_Checkbox/themes/redwood/CheckboxIconVariants.css.js');
 
 
-require('./PRIVATE_BaseSelector/themes/SelectorStyles.css.js');
 
-require('./useCollectionInteractionContext-6fc0200e.js');
-require('./useCollectionFocusRing-bed0aa16.js');
-require('./useCurrentKey-1b9e3382.js');
 require('./useReorderableContext-92514102.js');
 require('./ReorderableContext-16396e17.js');
-require('./useContextMenuGesture-530ef8dd.js');
-require('./textSelectionUtils-57082239.js');
 
 require('./SelectMenuGroupContext-a349d259.js');
 require('./Dropdown-1ba432a8.js');
@@ -219,7 +232,6 @@ require('./UNSAFE_Menu/themes/redwood/MenuItemBaseTheme.css.js');
 
 require('./UNSAFE_Menu/themes/redwood/MenuItemVariants.css.js');
 
-require('./useInteractionStyle-c203a8a0.js');
 require('./Separator-85962472.js');
 require('./UNSAFE_Separator/themes/SeparatorStyles.css.js');
 
@@ -234,36 +246,27 @@ require('./equals-098f7781.js');
 
 require('./EmbeddedIconButton-cc159a01.js');
 require('./Close-d99c20a7.js');
-require('./UNSAFE_TabBarCommon/themes/redwood/TabBarItemTheme.js');
-require('./UNSAFE_TabBarCommon/themes/TabBarItemStyles.css.js');
-require('./UNSAFE_TabBarCommon/themes/redwood/TabBarItemBaseTheme.css.js');
+require('./NavigationListItem-b0b03089.js');
+require('./NavigationListLinkItem-317a5200.js');
 require('./Badge-0e522f12.js');
 require('./UNSAFE_Badge/themes/redwood/BadgeTheme.js');
 require('./UNSAFE_Badge/themes/BadgeStyles.css.js');
 require('./UNSAFE_Badge/themes/redwood/BadgeThemeBaseTheme.css.js');
+require('./WarningS-cdb0a7ad.js');
+require('./ErrorS-b027f7ad.js');
+require('./InformationS-b0bb102b.js');
+require('./SuccessS-b6757c64.js');
+require('./UNSAFE_TabBarCommon/themes/redwood/TabBarItemTheme.js');
+require('./UNSAFE_TabBarCommon/themes/TabBarItemStyles.css.js');
+require('./UNSAFE_TabBarCommon/themes/redwood/TabBarItemBaseTheme.css.js');
 require('./useConveyorBeltItem-6c1771e5.js');
 require('./useDetectTruncation-a5b9dd16.js');
 require('./truncationUtils-2d44b04b.js');
 require('./useResizeObserver-a9e97180.js');
 require('./useAddBusyState-d19ae1fa.js');
 require('./useBusyStateContext-362eee2a.js');
-require('./WarningS-cdb0a7ad.js');
-require('./ErrorS-b027f7ad.js');
-require('./InformationS-b0bb102b.js');
-require('./SuccessS-b6757c64.js');
-require('./NavigationListLinkItem-62c3912e.js');
-require('./UNSAFE_NavigationListCommon/themes/redwood/NavigationListItemTheme.js');
-require('./UNSAFE_NavigationList/themes/NavigationListItemStyles.css.js');
-
-require('./UNSAFE_NavigationList/themes/redwood/NavigationListItemBaseTheme.css.js');
-
-require('./UNSAFE_NavigationList/themes/redwood/NavigationListItemVariants.css.js');
-
 require('./UNSAFE_TabBarCommon/themes/TabBarItemContract.css.js');
 require('./UNSAFE_TabBarCommon/themes/OverflowTabBarItemStyles.css.js');
-require('./NavigationListItem-3b9eb0fb.js');
-require('./UNSAFE_NavigationList/themes/NavigationListStyles.css.js');
-
 
 /**
  * A thin wrapper around useTabBar hook

package/cjs/UNSAFE_TabBarMixed.js.map

@@ -1 +1 @@
-{"version":3,"file":"UNSAFE_TabBarMixed.js","sources":["../../src/UNSAFE_TabBarMixed/useTabBarMixed.ts","../../src/UNSAFE_TabBarMixed/TabBarMixed.tsx","../../src/UNSAFE_TabBarMixed/TabBarMixedSeparator.tsx"],"sourcesContent":["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","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 { View } from '../UNSAFE_View';\nimport { styles } from './themes/TabBarMixedSeparator.css';\n\nimport type { Size } from '../utils/UNSAFE_size';\n\ntype TabBarMixedSeparatorProps = {\n  /**\n   * Padding around the visual Separator line.\n   */\n  padding?: Size;\n};\n\n/**\n * TabBarMixedSeparator is a component that renders a visual separator (displayed\n * as a vertical line) between collections of tabs within TabBarMixed.\n *\n * @param {TabBarMixedSeparatorProps} props Component props for TabBarMixedSeparator.\n * @returns {JSX.Element} Component element for TabBarMixedSeparator.\n */\nexport function TabBarMixedSeparator(props: TabBarMixedSeparatorProps) {\n  const { padding = 0 } = props;\n\n  return (\n    <View padding={[0, padding, 0, padding]}>\n      <div class={styles.separator} role=\"presentation\" />\n    </View>\n  );\n}\n"],"names":["useTabBar","forwardRef","useRef","isMobile","useMemo","getItemAttribute","REMOVABLE_ITEM_ATTRIBUTE","_jsx","_Fragment","styles","useImperativeHandle","useState","useCallback","mergeProps","_jsxs","ConveyorBeltFocusContext","TabBarContext","HiddenAccessible","LiveRegion","TabBarContextMenu","View"],"mappings":"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"}
+{"version":3,"file":"UNSAFE_TabBarMixed.js","sources":["../../src/UNSAFE_TabBarMixed/useTabBarMixed.ts","../../src/UNSAFE_TabBarMixed/TabBarMixed.tsx","../../src/UNSAFE_TabBarMixed/TabBarMixedSeparator.tsx"],"sourcesContent":["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","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 { View } from '../UNSAFE_View';\nimport { styles } from './themes/TabBarMixedSeparator.css';\n\nimport type { Size } from '../utils/UNSAFE_size';\n\ntype TabBarMixedSeparatorProps = {\n  /**\n   * Padding around the visual Separator line.\n   */\n  padding?: Size;\n};\n\n/**\n * TabBarMixedSeparator is a component that renders a visual separator (displayed\n * as a vertical line) between collections of tabs within TabBarMixed.\n *\n * @param {TabBarMixedSeparatorProps} props Component props for TabBarMixedSeparator.\n * @returns {JSX.Element} Component element for TabBarMixedSeparator.\n */\nexport function TabBarMixedSeparator(props: TabBarMixedSeparatorProps) {\n  const { padding = 0 } = props;\n\n  return (\n    <View padding={[0, padding, 0, padding]}>\n      <div class={styles.separator} role=\"presentation\" />\n    </View>\n  );\n}\n"],"names":["useTabBar","forwardRef","useRef","isMobile","useMemo","getItemAttribute","REMOVABLE_ITEM_ATTRIBUTE","_jsx","_Fragment","styles","useImperativeHandle","useState","useCallback","mergeProps","_jsxs","ConveyorBeltFocusContext","TabBarContext","HiddenAccessible","LiveRegion","TabBarContextMenu","View"],"mappings":"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"}

package/cjs/useNavigationListItem-b97e76d5.js

@@ -0,0 +1,104 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var hooks = require('preact/hooks');
+var usePress = require('./usePress-886180e4.js');
+var mergeProps = require('./mergeProps-e3da7237.js');
+var classNames = require('./classNames-c14c6ef3.js');
+var useInteractionStyle = require('./useInteractionStyle-c203a8a0.js');
+var useComponentTheme = require('./useComponentTheme-082fc8e4.js');
+var preact = require('preact');
+var mergeInterpolations = require('./mergeInterpolations-6727b536.js');
+var flexitem = require('./flexitem-fee13e26.js');
+var UNSAFE_NavigationListCommon_themes_redwood_NavigationListItemTheme = require('./UNSAFE_NavigationListCommon/themes/redwood/NavigationListItemTheme.js');
+var useUser = require('./useUser-1295b5cb.js');
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * Licensed under The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/**
+ * Context used to pass navlist information without having to pass it to navlist children props.
+ * We want to communicate information down to any interested navlist item children.
+ */
+const NavigationListContext = preact.createContext(null);
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * Licensed under The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/**
+ * Utility hook for consuming the NavigationListContext
+ *
+ * @returns The value of NavigationListContext provider
+ */
+function useNavigationListContext() {
+    return hooks.useContext(NavigationListContext);
+}
+
+const flexItemStyleInterpolations = mergeInterpolations.mergeInterpolations([
+    ...Object.values(flexitem.flexitemInterpolations)
+]);
+const { class: labelContainerFlexItemClasses, ...labelContainerFlexItemStyle } = flexItemStyleInterpolations({
+    alignSelf: 'center'
+});
+function useNavigationListItem({ itemKey }) {
+    const { onSelectionChange, selection, currentKey, showFocusRing, navigationListItemPrefix, edge, display } = useNavigationListContext();
+    //Selection and focus state
+    const isCurrent = currentKey === itemKey;
+    const isSelected = selection === itemKey;
+    const isIconOnly = display === 'icons' ? true : false;
+    const isEdgeEnd = edge === 'end' ? true : false;
+    //Styling
+    const { interactionProps, applyPseudoHoverStyle, applyHoverStyle, applyActiveStyle } = useInteractionStyle.useInteractionStyle();
+    const { direction } = useUser.useUser();
+    const isRtl = direction === 'rtl';
+    const { classes: listItemClasses, styles: { labelContainerClasses, navigationItemStackedBadge, navigationItemStackedBadgeRtl, startIconStacked } } = useComponentTheme.useComponentTheme(UNSAFE_NavigationListCommon_themes_redwood_NavigationListItemTheme.NavigationListItemRedwoodTheme, {
+        focusRing: showFocusRing ? 'isFocusRing' : 'notFocusRing',
+        current: isCurrent ? 'isCurrent' : 'notCurrtent',
+        selected: isSelected ? 'isSelected' : 'notSelected',
+        direction: isRtl ? 'isRtl' : 'notRtl',
+        hybridHover: applyHoverStyle ? 'isHybridHover' : 'notHybridHover',
+        pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',
+        active: applyActiveStyle ? 'isActive' : 'notActive',
+        edgeEnd: edge === 'end' ? 'isEnd' : 'notEnd',
+        iconOnly: isIconOnly ? 'isIconOnly' : 'notIconOnly'
+    });
+    const navigationItemIconOnlyClasses = classNames.classNames([startIconStacked]);
+    const navigationItemStackedBadgeClasses = classNames.classNames([
+        navigationItemStackedBadge,
+        direction === 'rtl' && navigationItemStackedBadgeRtl
+    ]);
+    //Item handlers
+    const handlePress = hooks.useCallback(() => {
+        onSelectionChange?.({ value: itemKey, reason: 'pointer' });
+    }, [itemKey, onSelectionChange]);
+    //Legacy navlist makes selection on keyDown, but since preact tabbar made selection after keyUp, will do the same
+    //for preact navlist
+    const { pressProps } = usePress.usePress(handlePress);
+    return {
+        itemId: navigationListItemPrefix + itemKey,
+        itemHandlers: mergeProps.mergeProps(interactionProps, pressProps /*,onFocusProps*/),
+        itemClasses: classNames.classNames([listItemClasses]),
+        isSelected,
+        labelContainerClasses: classNames.classNames([labelContainerClasses, labelContainerFlexItemClasses]),
+        labelContainerStyle: labelContainerFlexItemStyle,
+        isIconOnly,
+        isEdgeEnd,
+        stackedBadgeClasses: classNames.classNames([navigationItemStackedBadgeClasses]),
+        iconOnlyClasses: classNames.classNames([navigationItemIconOnlyClasses]),
+        isCurrent,
+        showFocusRing
+    };
+}
+
+exports.NavigationListContext = NavigationListContext;
+exports.useNavigationListContext = useNavigationListContext;
+exports.useNavigationListItem = useNavigationListItem;
+//# sourceMappingURL=useNavigationListItem-b97e76d5.js.map

package/cjs/useNavigationListItem-b97e76d5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNavigationListItem-b97e76d5.js","sources":["../../src/UNSAFE_NavigationListCommon/NavigationListContext.ts","../../src/UNSAFE_NavigationListCommon/useNavigationListContext.ts","../../src/UNSAFE_NavigationListCommon/useNavigationListItem.ts"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { createContext } from 'preact';\nimport { NavigationListProps } from './NavigationListProps';\n\ntype CurrentKeyDetail<K> = {\n  value: K;\n};\n\nexport type NavigationListContextProps<K extends string | number> = Pick<\n  NavigationListProps<K>,\n  'selection' | 'onSelectionChange' | 'onRemove' | 'edge' | 'display'\n> & {\n  currentKey?: K;\n  showFocusRing: boolean;\n  onCurrentKeyChange:\n    | (<K extends string | number>(detail: CurrentKeyDetail<K>) => void)\n    | undefined;\n  navigationListItemPrefix: string;\n};\n\n/**\n * Context used to pass navlist information without having to pass it to navlist children props.\n * We want to communicate information down to any interested navlist item children.\n */\n\nconst NavigationListContext = createContext<NavigationListContextProps<string | number>>(null!);\n\nexport { NavigationListContext };\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useContext } from 'preact/hooks';\nimport { NavigationListContext } from './NavigationListContext';\n\n/**\n * Utility hook for consuming the NavigationListContext\n *\n * @returns The value of NavigationListContext provider\n */\nfunction useNavigationListContext() {\n  return useContext(NavigationListContext);\n}\n\nexport { useNavigationListContext };\n","import { useCallback } from 'preact/hooks';\n\nimport { usePress } from '../hooks/UNSAFE_usePress';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { useInteractionStyle } from '../hooks/UNSAFE_useInteractionStyle';\nimport { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { useNavigationListContext } from './useNavigationListContext';\nimport { mergeInterpolations } from '../utils/UNSAFE_mergeInterpolations';\nimport { FlexitemProps } from '../utils/UNSAFE_interpolations/flexitem';\nimport { flexitemInterpolations } from '../utils/UNSAFE_interpolations/flexitem';\nimport {\n  NavigationListItemStyles,\n  NavigationListItemVariantOptions\n} from '../UNSAFE_NavigationList/themes/NavigationListItemStyles.css';\nimport { NavigationListItemRedwoodTheme } from './themes/redwood/NavigationListItemTheme';\nimport { useUser } from '../hooks/UNSAFE_useUser';\n\nconst flexItemStyleInterpolations = mergeInterpolations<FlexitemProps>([\n  ...Object.values(flexitemInterpolations)\n]);\nconst { class: labelContainerFlexItemClasses, ...labelContainerFlexItemStyle } =\n  flexItemStyleInterpolations({\n    alignSelf: 'center'\n  });\n\nexport function useNavigationListItem<K extends string | number>({ itemKey }: { itemKey: K }) {\n  const {\n    onSelectionChange,\n    selection,\n    currentKey,\n    showFocusRing,\n    navigationListItemPrefix,\n    edge,\n    display\n  } = useNavigationListContext();\n\n  //Selection and focus state\n  const isCurrent = currentKey === itemKey;\n\n  const isSelected = selection === itemKey;\n\n  const isIconOnly = display === 'icons' ? true : false;\n  const isEdgeEnd = edge === 'end' ? true : false;\n\n  //Styling\n  const { interactionProps, applyPseudoHoverStyle, applyHoverStyle, applyActiveStyle } =\n    useInteractionStyle();\n\n  const { direction } = useUser();\n  const isRtl = direction === 'rtl';\n\n  const {\n    classes: listItemClasses,\n    styles: {\n      labelContainerClasses,\n      navigationItemStackedBadge,\n      navigationItemStackedBadgeRtl,\n      startIconStacked\n    }\n  } = useComponentTheme<NavigationListItemVariantOptions, NavigationListItemStyles>(\n    NavigationListItemRedwoodTheme,\n    {\n      focusRing: showFocusRing ? 'isFocusRing' : 'notFocusRing',\n      current: isCurrent ? 'isCurrent' : 'notCurrtent',\n      selected: isSelected ? 'isSelected' : 'notSelected',\n      direction: isRtl ? 'isRtl' : 'notRtl',\n      hybridHover: applyHoverStyle ? 'isHybridHover' : 'notHybridHover',\n      pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',\n      active: applyActiveStyle ? 'isActive' : 'notActive',\n      edgeEnd: edge === 'end' ? 'isEnd' : 'notEnd',\n      iconOnly: isIconOnly ? 'isIconOnly' : 'notIconOnly'\n    }\n  );\n\n  const navigationItemIconOnlyClasses = classNames([startIconStacked]);\n\n  const navigationItemStackedBadgeClasses = classNames([\n    navigationItemStackedBadge,\n    direction === 'rtl' && navigationItemStackedBadgeRtl\n  ]);\n\n  //Item handlers\n  const handlePress = useCallback(() => {\n    onSelectionChange?.({ value: itemKey as K, reason: 'pointer' });\n  }, [itemKey, onSelectionChange]);\n\n  //Legacy navlist makes selection on keyDown, but since preact tabbar made selection after keyUp, will do the same\n  //for preact navlist\n  const { pressProps } = usePress(handlePress);\n\n  return {\n    itemId: navigationListItemPrefix + itemKey,\n    itemHandlers: mergeProps(interactionProps, pressProps /*,onFocusProps*/),\n    itemClasses: classNames([listItemClasses]),\n    isSelected,\n    labelContainerClasses: classNames([labelContainerClasses, labelContainerFlexItemClasses]),\n    labelContainerStyle: labelContainerFlexItemStyle,\n    isIconOnly,\n    isEdgeEnd,\n    stackedBadgeClasses: classNames([navigationItemStackedBadgeClasses]),\n    iconOnlyClasses: classNames([navigationItemIconOnlyClasses]),\n    isCurrent,\n    showFocusRing\n  };\n}\n"],"names":["createContext","useContext","mergeInterpolations","flexitemInterpolations","useInteractionStyle","useUser","useComponentTheme","NavigationListItemRedwoodTheme","classNames","useCallback","usePress","mergeProps"],"mappings":"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"}

package/es/{Chart-b866a74c.js → Chart-8c63da28.js}

@@ -15,6 +15,7 @@ import { A as Axis } from './Axis-e23d7b41.js';
 import { u as useChartViewport } from './useChartViewport-03efd960.js';
 import { u as useChartNav } from './useChartNav-49b52017.js';
 import { m as mergeProps } from './mergeProps-88ea8306.js';
+import { S as ScrollBar } from './ScrollBar-c7a5d361.js';
 import { a as useSelectDrill, u as useChartDatatipAndCursor } from './useSelectDrill-f669e729.js';
 import { u as useTestId } from './useTestId-f24ac480.js';
 import { g as getChartVars } from './cssUtils-9e0e0351.js';
@@ -41,7 +42,6 @@ import { u as useTranslationBundle } from './useTranslationBundle-4822502f.js';
 import { g as getTextAndDimsInfo, a as getAriaLabelGenerator, b as getTextAndBoundsUtil } from './useChartDatatip-8dd22b71.js';
 import { createElement } from 'preact';
 import { l } from './stringUtils-0fe25200.js';
-import { S as ScrollBar } from './ScrollBar-c7a5d361.js';
 
 /**
  * @license
@@ -749,4 +749,4 @@ const Chart = forwardRef(({ width, height, ...props }, ref = null) => {
 });
 
 export { Chart as C };
-//# sourceMappingURL=Chart-b866a74c.js.map
+//# sourceMappingURL=Chart-8c63da28.js.map