@oracle/oraclejet-preact 17.0.5 → 17.0.7

package/es/useTabBar-8af19c50.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabBar-8af19c50.js","sources":["../../src/hooks/PRIVATE_useTabBar/useTabBar.ts"],"sourcesContent":["import { useState, useRef, useEffect } from 'preact/hooks';\nimport { mergeProps } from '../../utils/UNSAFE_mergeProps';\nimport {\n  getPrevNextKeyUsingRef,\n  getFirstVisibleKey,\n  getKey,\n  keyExtractor,\n  findElementByKey\n} from '../../utils/PRIVATE_collectionUtils';\nimport { useCollectionFocusRing } from '../PRIVATE_useCollectionFocusRing';\nimport { useCurrentKey } from '../PRIVATE_useCurrentKey';\nimport { useId } from '../UNSAFE_useId';\n\nimport { ComponentProps, ContextType, RefObject } from 'preact';\nimport type { TabBarContext, TabBarLayout } from '../../UNSAFE_TabBarCommon';\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};\n\nconst ITEM_SELECTOR = '[role=\"tab\"]';\nconst REMOVABLE_ICON_SELECTOR = '[data-oj-tabbar-item-remove-icon=\"true\"]';\nconst REMOVABLE_ITEM_ATTRIBUTE = 'data-oj-removable';\n\n/**\n * Implements TabBar behavior for focus and keyboad handling\n */\nexport function useTabBar<K extends string | number>(options: useTabBarOptions) {\n  const {\n    children,\n    class: className,\n    display,\n    edge = 'top',\n    selection,\n    onSelect,\n    onRemove,\n    ref: userRef,\n    size\n  } = options;\n\n  const internalRef = useRef<HTMLDivElement>(null);\n  const rootRef = userRef || internalRef;\n\n  const tabId = useId();\n  const [currentKey, setCurrentKey] = useState<K | undefined>(selection as K);\n  const [hideTooltip, setHideTooltip] = useState(false);\n\n  const tabItemPrefix = tabId + '_';\n\n  /**\n   * A reference to the previous set of tab keys that this TabBar\n   * contains before children were re-rendered. In the event the \"current\" tab\n   * is removed and the \"currentKey\" reference is broken, we can redirect\n   * the \"currentKey\" to another tab based on the index of the removed tab.\n   */\n  const prevTabKeys = useRef<(string | number | undefined)[]>();\n\n  useEffect(() => {\n    if (rootRef.current) {\n      const tabKeys = Array.from(rootRef.current.querySelectorAll(ITEM_SELECTOR)).map((elem) =>\n        getKey(elem as HTMLElement)\n      );\n      if (currentKey && !tabKeys.includes(currentKey as K)) {\n        //If prevTabs does not exist set the first visible key as currentKey\n        prevTabKeys.current\n          ? setCurrentKey(findNextValidKey(currentKey, tabKeys, prevTabKeys.current) as K)\n          : setCurrentKey(tabKeys[0] as K);\n      }\n      prevTabKeys.current = tabKeys;\n    }\n  }, [children, currentKey, rootRef]);\n\n  const [showFocusRing, focusRingProps] = useCollectionFocusRing(rootRef, [\n    'ArrowRight',\n    'ArrowLeft',\n    'Home',\n    'End'\n  ]);\n\n  const { currentKeyProps } = useCurrentKey(\n    (element) =>\n      onRemove\n        ? extractOnlyItemKey(element, ITEM_SELECTOR, REMOVABLE_ICON_SELECTOR)\n        : keyExtractor(element, ITEM_SELECTOR),\n    false,\n    undefined,\n    undefined,\n    getPrevNextKeyUsingRef(rootRef, currentKey, true, ITEM_SELECTOR),\n    getPrevNextKeyUsingRef(rootRef, currentKey, false, ITEM_SELECTOR),\n    currentKey,\n    (detail) => {\n      setCurrentKey(detail.value as K);\n      setHideTooltip(false);\n    }\n  );\n\n  const onKeyDown = (event: KeyboardEvent) => {\n    if (rootRef.current && currentKey) {\n      if (event.key === 'Home' || event.key === 'End') {\n        const tabBarItemKey = Array.from(rootRef.current.querySelectorAll(ITEM_SELECTOR), (elem) =>\n          getKey(elem as HTMLElement)\n        );\n        event.preventDefault();\n        setCurrentKey?.(tabBarItemKey[event.key === 'Home' ? 0 : tabBarItemKey.length - 1] as K);\n      }\n      if (event.key === 'Enter' || event.key === ' ') {\n        event.preventDefault();\n        onSelect?.({ value: currentKey });\n      }\n      if (event.key === 'Delete') {\n        const tabBarItem = findElementByKey(\n          rootRef.current,\n          currentKey,\n          ITEM_SELECTOR\n        ) as HTMLElement;\n        if (tabBarItem.hasAttribute(REMOVABLE_ITEM_ATTRIBUTE)) {\n          onRemove?.({ value: currentKey });\n        }\n      }\n      if (event.key === 'Escape') {\n        setHideTooltip(true);\n      }\n    }\n  };\n\n  const onFocus = () => {\n    if (rootRef.current && currentKey === undefined) {\n      const key = getFirstVisibleKey(rootRef.current, ITEM_SELECTOR);\n      if (key) {\n        setCurrentKey(key as K);\n      }\n    }\n  };\n\n  const eventProps = { onKeyDown, onFocus };\n\n  return {\n    rootProps: mergeProps(\n      {\n        'aria-activedescendant': currentKey ? tabItemPrefix + currentKey : '',\n        'aria-multiselectable': false,\n        class: className,\n        ref: rootRef,\n        role: 'tablist',\n        tabIndex: 0\n      },\n      currentKeyProps,\n      focusRingProps,\n      eventProps\n    ),\n    tabBarContext: {\n      currentKey,\n      display,\n      isEdgeBottom: edge === 'bottom',\n      layout: 'condense',\n      onRemove,\n      onSelect,\n      showFocusRing,\n      hideTooltip,\n      selection,\n      size,\n      tabItemPrefix\n    }\n  } as const;\n}\n\n//useCurrentKey use click capture that captures first click, which is on remove button\n//when we remove and sets the item being removed to currentKey. So we should not allow\n//this if click is on remove button\nconst extractOnlyItemKey = (element: HTMLElement, itemSelector: string, itemEliminator: string) => {\n  const tabBarItem = element.closest(itemSelector);\n  if (tabBarItem) {\n    if (tabBarItem.hasAttribute(REMOVABLE_ITEM_ATTRIBUTE)) {\n      const removeButton = element.closest(itemEliminator);\n      if (removeButton && tabBarItem?.contains(removeButton)) {\n        return null;\n      }\n    }\n    return getKey(tabBarItem as HTMLElement);\n  }\n  return null;\n};\n\nconst findNextValidKey = <K>(currentKey: K, currTabs: K[], prevTabs: K[]) => {\n  const index = prevTabs.indexOf(currentKey);\n  // update current key to be the first one if currentKey is invalid\n  if (index === -1) {\n    return currTabs[0];\n  }\n  let nextIndex = 0;\n  let isLastKey = false;\n  if (index === prevTabs.length - 1) {\n    nextIndex = index - 1;\n    isLastKey = true;\n  } else {\n    nextIndex = index + 1;\n  }\n  while (nextIndex !== index && nextIndex > -1 && nextIndex < prevTabs.length) {\n    const nextKey = prevTabs[nextIndex];\n    if (currTabs.indexOf(nextKey) !== -1) {\n      return nextKey;\n    }\n    isLastKey ? nextIndex-- : nextIndex++;\n  }\n  // update current key to be the first one if we can't find a suitable next key\n  return currTabs[0];\n};\n"],"names":[],"mappings":"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"}

package/es/useTestId-adde554c.js

@@ -0,0 +1,21 @@
+/* @oracle/oraclejet-preact: undefined */
+import { E as EnvironmentContext } from './LayerHost-45f545d7.js';
+import 'preact/jsx-runtime';
+import { useContext } from 'preact/hooks';
+import 'preact/compat';
+
+/**
+ * Returns the set of attributes to be applied to the DOM node if the application's mode is not
+ * set to "production".
+ */
+function useTestId(testId) {
+    const context = useContext(EnvironmentContext);
+    return context.mode === 'production' || testId === ''
+        ? {}
+        : {
+            'data-testid': testId
+        };
+}
+
+export { useTestId as u };
+//# sourceMappingURL=useTestId-adde554c.js.map

package/es/useTestId-adde554c.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTestId-adde554c.js","sources":["../../src/hooks/UNSAFE_useTestId/useTestId.ts"],"sourcesContent":["import { EnvironmentContext } from '../../UNSAFE_Environment';\nimport { useContext } from 'preact/hooks';\n\nexport type TestIdProps = {\n  testId?: string;\n};\n/**\n * Returns the set of attributes to be applied to the DOM node if the application's mode is not\n * set to \"production\".\n */\nexport function useTestId(testId?: string) {\n  const context = useContext(EnvironmentContext);\n  return context.mode === 'production' || testId === ''\n    ? {}\n    : {\n        'data-testid': testId\n      };\n}\n"],"names":[],"mappings":";;;;;;AAMA;;;AAGG;AACG,SAAU,SAAS,CAAC,MAAe,EAAA;AACvC,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;IAC/C,OAAO,OAAO,CAAC,IAAI,KAAK,YAAY,IAAI,MAAM,KAAK,EAAE;AACnD,UAAE,EAAE;AACJ,UAAE;AACE,YAAA,aAAa,EAAE,MAAM;SACtB,CAAC;AACR;;;;"}

package/es/useTheme-1f6035d2.js

@@ -0,0 +1,19 @@
+/* @oracle/oraclejet-preact: undefined */
+import { useContext } from 'preact/hooks';
+import { E as EnvironmentContext } from './LayerHost-45f545d7.js';
+import 'preact/jsx-runtime';
+import 'preact/compat';
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+function useTheme() {
+    return useContext(EnvironmentContext).theme;
+}
+
+export { useTheme as u };
+//# sourceMappingURL=useTheme-1f6035d2.js.map

package/es/useTheme-1f6035d2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme-1f6035d2.js","sources":["../../src/hooks/UNSAFE_useTheme/useTheme.ts"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * 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 { EnvironmentContext } from '../../UNSAFE_Environment';\n\nexport function useTheme() {\n  return useContext(EnvironmentContext).theme;\n}\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;AAMG;SAKa,QAAQ,GAAA;AACtB,IAAA,OAAO,UAAU,CAAC,kBAAkB,CAAC,CAAC,KAAK,CAAC;AAC9C;;;;"}

package/es/useThemeInterpolations-9bddc683.js

@@ -0,0 +1,31 @@
+/* @oracle/oraclejet-preact: undefined */
+import { u as useColorScheme } from './useColorScheme-e1b17324.js';
+import { u as useScale } from './useScale-d64a1a28.js';
+import { t as themeInterpolations } from './theme-63551f30.js';
+import { m as mergeInterpolations } from './mergeInterpolations-e2db2a66.js';
+import { D as DefaultEnvironment } from './LayerHost-45f545d7.js';
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+// This hook encasulates the logic required to determine which theme style classes are needed
+// for the current environment context's colorScheme and scale value.  This would be used when
+// rendering dom outside of the current dom tree, but desire to match the colorScheme and scale
+// of the original dom tree.
+function useThemeInterpolations() {
+    const colorScheme = useColorScheme();
+    const currentScale = useScale();
+    // We don't want to interpolate the default environment values for scacle.  Those should get picked up by default.
+    // This fixes an issue for core pack components that utilize the Layer component, when in a legacy cookbook page.
+    const scale = currentScale !== DefaultEnvironment.scale ? currentScale : undefined;
+    const interpolations = mergeInterpolations([...Object.values(themeInterpolations)]);
+    const { class: classes } = interpolations({ colorScheme, scale });
+    return classes;
+}
+
+export { useThemeInterpolations as u };
+//# sourceMappingURL=useThemeInterpolations-9bddc683.js.map

package/es/useThemeInterpolations-9bddc683.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeInterpolations-9bddc683.js","sources":["../../src/hooks/UNSAFE_useThemeInterpolations/useThemeInterpolations.ts"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { useColorScheme } from '../UNSAFE_useColorScheme';\nimport { useScale } from '../UNSAFE_useScale';\nimport { themeInterpolations } from '../../utils/UNSAFE_interpolations/theme';\nimport type { ThemeProps } from '../../utils/UNSAFE_interpolations/theme';\nimport { mergeInterpolations } from '../../utils/UNSAFE_mergeInterpolations';\nimport { DefaultEnvironment } from '../../UNSAFE_Environment/EnvironmentContext';\n\n// This hook encasulates the logic required to determine which theme style classes are needed\n// for the current environment context's colorScheme and scale value.  This would be used when\n// rendering dom outside of the current dom tree, but desire to match the colorScheme and scale\n// of the original dom tree.\nexport function useThemeInterpolations() {\n  const colorScheme = useColorScheme();\n  const currentScale = useScale();\n  // We don't want to interpolate the default environment values for scacle.  Those should get picked up by default.\n  // This fixes an issue for core pack components that utilize the Layer component, when in a legacy cookbook page.\n  const scale = currentScale !== DefaultEnvironment.scale ? currentScale : undefined;\n\n  const interpolations = mergeInterpolations<ThemeProps>([...Object.values(themeInterpolations)]);\n  const { class: classes } = interpolations({ colorScheme, scale });\n  return classes;\n}\n"],"names":[],"mappings":";;;;;;;AAAA;;;;;;AAMG;AAQH;AACA;AACA;AACA;SACgB,sBAAsB,GAAA;AACpC,IAAA,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;AACrC,IAAA,MAAM,YAAY,GAAG,QAAQ,EAAE,CAAC;;;AAGhC,IAAA,MAAM,KAAK,GAAG,YAAY,KAAK,kBAAkB,CAAC,KAAK,GAAG,YAAY,GAAG,SAAS,CAAC;AAEnF,IAAA,MAAM,cAAc,GAAG,mBAAmB,CAAa,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC;AAChG,IAAA,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,cAAc,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAC;AAClE,IAAA,OAAO,OAAO,CAAC;AACjB;;;;"}

package/es/useTooltip-9dec25b3.js

@@ -0,0 +1,51 @@
+/* @oracle/oraclejet-preact: undefined */
+import { useState, useCallback } from 'preact/hooks';
+import { u as useTooltipControlled } from './useTooltipControlled-2044f639.js';
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+const defaultOffset = 8; // Redwood tooltip has a default offset of 8 pixels
+/**
+ * A hook with tooltip implementation.
+ * Returns event handlers that can enhance the target element with a tooltip displayed
+ * on hover and focus.
+ *
+ * @param text tooltip text
+ * @param position tooltip placement relative to the target element
+ * @param isDisabled determines if the tooltip is disabled
+ * @param anchor determines if the target is an element or the pointer
+ * @param offset offset from the placement
+ * @param variant specifies if the rendered popup should have 'tooltip' or 'datatip' look and behavior
+ * @returns an object with the 'tooltipContent' and 'tooltipProps' properties.
+ */
+const useTooltip = ({ text, position = 'bottom', isDisabled = false, anchor = { x: 'element', y: 'element' }, offset, variant = 'tooltip', testId }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const disabled = isDisabled || !text;
+    const newOffset = offset ? offset : { mainAxis: defaultOffset, crossAxis: 0 };
+    const onToggleHandler = useCallback((details) => {
+        setIsOpen(details.value);
+    }, []);
+    const { tooltipContent, tooltipProps } = useTooltipControlled({
+        text,
+        isOpen,
+        position,
+        isDisabled: disabled,
+        offset: newOffset,
+        anchor,
+        variant,
+        onToggle: onToggleHandler,
+        testId
+    });
+    return {
+        tooltipContent,
+        tooltipProps
+    };
+};
+
+export { useTooltip as u };
+//# sourceMappingURL=useTooltip-9dec25b3.js.map

package/es/useTooltip-9dec25b3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTooltip-9dec25b3.js","sources":["../../src/hooks/UNSAFE_useTooltip/useTooltip.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { useState, useCallback } from 'preact/hooks';\nimport { useTooltipControlled } from './useTooltipControlled';\nimport { TestIdProps } from '../UNSAFE_useTestId';\n\nconst defaultOffset = 8; // Redwood tooltip has a default offset of 8 pixels\n\ntype tooltipParameters = Parameters<typeof useTooltipControlled>[0];\n\ntype Props = {\n  text?: string;\n  position?: tooltipParameters['position'];\n  isDisabled?: boolean;\n  anchor?: tooltipParameters['anchor'];\n  offset?: { mainAxis?: number; crossAxis?: number };\n  variant?: tooltipParameters['variant'];\n} & TestIdProps;\n\n/**\n * A hook with tooltip implementation.\n * Returns event handlers that can enhance the target element with a tooltip displayed\n * on hover and focus.\n *\n * @param text tooltip text\n * @param position tooltip placement relative to the target element\n * @param isDisabled determines if the tooltip is disabled\n * @param anchor determines if the target is an element or the pointer\n * @param offset offset from the placement\n * @param variant specifies if the rendered popup should have 'tooltip' or 'datatip' look and behavior\n * @returns an object with the 'tooltipContent' and 'tooltipProps' properties.\n */\nexport const useTooltip = ({\n  text,\n  position = 'bottom',\n  isDisabled = false,\n  anchor = { x: 'element', y: 'element' },\n  offset,\n  variant = 'tooltip',\n  testId\n}: Props): ReturnType<typeof useTooltipControlled> => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const disabled = isDisabled || !text;\n  const newOffset = offset ? offset : { mainAxis: defaultOffset, crossAxis: 0 };\n\n  const onToggleHandler = useCallback((details: { value: boolean }) => {\n    setIsOpen(details.value);\n  }, []);\n\n  const { tooltipContent, tooltipProps } = useTooltipControlled({\n    text,\n    isOpen,\n    position,\n    isDisabled: disabled,\n    offset: newOffset,\n    anchor,\n    variant,\n    onToggle: onToggleHandler,\n    testId\n  });\n\n  return {\n    tooltipContent,\n    tooltipProps\n  };\n};\n"],"names":[],"mappings":";;;;AAAA;;;;;;AAMG;AAMH,MAAM,aAAa,GAAG,CAAC,CAAC;AAaxB;;;;;;;;;;;;AAYG;AACU,MAAA,UAAU,GAAG,CAAC,EACzB,IAAI,EACJ,QAAQ,GAAG,QAAQ,EACnB,UAAU,GAAG,KAAK,EAClB,MAAM,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAE,EACvC,MAAM,EACN,OAAO,GAAG,SAAS,EACnB,MAAM,EACA,KAA6C;IACnD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;AACrD,IAAA,MAAM,QAAQ,GAAG,UAAU,IAAI,CAAC,IAAI,CAAC;AACrC,IAAA,MAAM,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,EAAE,QAAQ,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC;AAE9E,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,CAAC,OAA2B,KAAI;AAClE,QAAA,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;KAC1B,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAG,oBAAoB,CAAC;QAC5D,IAAI;QACJ,MAAM;QACN,QAAQ;AACR,QAAA,UAAU,EAAE,QAAQ;AACpB,QAAA,MAAM,EAAE,SAAS;QACjB,MAAM;QACN,OAAO;AACP,QAAA,QAAQ,EAAE,eAAe;QACzB,MAAM;AACP,KAAA,CAAC,CAAC;IAEH,OAAO;QACL,cAAc;QACd,YAAY;KACb,CAAC;AACJ;;;;"}

package/es/useTooltipControlled-2044f639.js

@@ -0,0 +1,454 @@
+/* @oracle/oraclejet-preact: undefined */
+import { jsx, Fragment } from 'preact/jsx-runtime';
+import { useRef, useEffect, useState, useCallback } from 'preact/hooks';
+import { u as useId } from './useId-03dbfdf0.js';
+import { F as Floating } from './Floating-9703160e.js';
+import { L as Layer } from './Layer-9b06412e.js';
+import 'preact/compat';
+import './LayerHost-45f545d7.js';
+import { u as useHover } from './useHover-d5088fcd.js';
+import { u as useFocus } from './useFocus-38c95977.js';
+import { u as useTouch } from './useTouch-4828df25.js';
+import { m as mergeProps } from './mergeProps-88ea8306.js';
+import { u as useAnimation } from './useAnimation-fe9990dc.js';
+import { u as useComponentTheme } from './useComponentTheme-d2f9e47f.js';
+import { u as useTestId } from './useTestId-adde554c.js';
+import { u as useThemeInterpolations } from './useThemeInterpolations-9bddc683.js';
+import { c as classNames } from './classNames-4e12b00d.js';
+import { TooltipContentRedwoodTheme } from './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentTheme.js';
+import { E as EnvironmentProvider } from './EnvironmentProvider-f543a463.js';
+import { u as useColorScheme } from './useColorScheme-e1b17324.js';
+
+const TooltipContent = ({ children, id, isOpen, isDatatip, onTransitionEnd, testId, ...props }) => {
+    const wrapperRef = useRef(null);
+    const popoverRef = useRef(null);
+    const testIdProps = useTestId(testId);
+    const { baseTheme, variantClasses, styles } = useComponentTheme(TooltipContentRedwoodTheme, {
+        variant: isDatatip ? 'datatip' : 'tooltip'
+    });
+    const schemeClass = useThemeInterpolations();
+    const { nodeRef } = useAnimation(isOpen ? 'mounted' : 'unmounted', {
+        animationStates: {
+            mounted: (_node) => {
+                const childNode = _node.firstChild;
+                return {
+                    from: {
+                        maxHeight: '0',
+                        opacity: '0%'
+                    },
+                    to: {
+                        maxHeight: `${childNode?.offsetHeight}px`,
+                        opacity: isDatatip ? '100%' : '95%'
+                    },
+                    options: {
+                        duration: isDatatip ? 1 : 100,
+                        easing: [0.0, 0.0, 0.2, 1]
+                    }
+                };
+            },
+            unmounted: (_node) => {
+                return {
+                    from: {
+                        opacity: isDatatip ? '100%' : '95%'
+                    },
+                    to: {
+                        maxHeight: '0',
+                        opacity: '0%'
+                    },
+                    options: {
+                        duration: isDatatip ? 1 : 100,
+                        easing: [0.0, 0.0, 0.2, 1]
+                    }
+                };
+            }
+        },
+        isAnimatedOnMount: true,
+        onAnimationEnd: () => onTransitionEnd?.()
+    });
+    // Set up initial wrapper height so Tooltip can animate from the bottom to the top
+    useEffect(() => {
+        if (wrapperRef.current && popoverRef.current?.offsetHeight) {
+            wrapperRef.current.style.height = `${popoverRef.current?.offsetHeight}px`;
+        }
+    }, []);
+    return (jsx("div", { ref: wrapperRef, id: id, role: "tooltip", class: classNames([styles.wrapper, schemeClass, baseTheme]), ...testIdProps, children: jsx("div", { ref: nodeRef, class: styles.inner, ...props, children: jsx("div", { ref: popoverRef, class: classNames([variantClasses, styles.content]), children: children }) }) }));
+};
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/**
+ * A global tooltip manager that
+ * - ensures that only one tooltip is shown at a time
+ * - detects a Tab key press and allows tooltips to check if their target was focused via keyboard
+ */
+class TooltipManager {
+    constructor() {
+        this.keyDownHandler = (event) => {
+            if (event.key === 'Tab') {
+                this.tabKeyActive = true;
+                setTimeout(() => {
+                    this.tabKeyActive = false;
+                }, 100);
+            }
+        };
+        /**
+         * notifies the previously registered active tooltip callback and registers a new one
+         */
+        this.register = (callback) => {
+            if (this.activeCallback && this.activeCallback !== callback) {
+                this.activeCallback();
+            }
+            this.activeCallback = callback;
+        };
+        /**
+         * resets the registered active callback
+         */
+        this.unregister = (callback) => {
+            if (this.activeCallback === callback) {
+                this.activeCallback = null;
+            }
+        };
+        /**
+         * returns the active Tab key status ('active' means a Tab key press within the last 100ms)
+         */
+        this.isTabKeyActive = () => {
+            return this.tabKeyActive;
+        };
+        this.activeCallback = null;
+        this.tabKeyActive = false;
+        window.addEventListener('keydown', this.keyDownHandler, true);
+    }
+}
+
+// Global TooltipManager singleton instance
+const globalTooltipManager = new TooltipManager();
+const positionToPlacement = (position) => {
+    let placement = 'bottom';
+    switch (position) {
+        case 'top':
+        case 'end':
+        case 'bottom':
+        case 'start':
+            placement = position;
+            break;
+        case 'top-end':
+            placement = 'top-end-corner';
+            break;
+        case 'bottom-end':
+            placement = 'bottom-end-corner';
+            break;
+        case 'bottom-start':
+            placement = 'bottom-start-corner';
+            break;
+        case 'top-start':
+            placement = 'top-start-corner';
+            break;
+    }
+    return placement;
+};
+const useTooltipControlled = ({ text, isOpen = false, variant = 'tooltip', position = 'bottom', focusStrategy = 'browser', isDisabled = false, anchor = { x: 'element', y: 'element' }, offset = { mainAxis: 0, crossAxis: 0 }, onToggle, testId }) => {
+    const disabled = isDisabled || !text;
+    const isInitialRenderState = useRef(true);
+    const [state, _setState] = useState(!disabled && isOpen ? 'mounting' : 'unmounted');
+    const stateRef = useRef(state);
+    const setState = (newState) => {
+        stateRef.current = newState;
+        _setState(newState);
+    };
+    // const tooltipId = useRef<string>(useId());
+    const [needsUpdate, setNeedsUpdate] = useState(false);
+    setNeedsUpdate(false);
+    const isDatatip = variant === 'datatip';
+    const [isLogicalFocus, setLogicalFocus] = useState(false);
+    const isLogicalFocusStrategy = focusStrategy === 'logical';
+    const isInitialRenderTrigger = useRef(true);
+    const { hoverProps, isHover } = useHover({});
+    const { touchProps, isTouch } = useTouch({ isDisabled }); // TODO replace by useLongPress actionhook
+    // we only care about keyboard focus, don't enable useFocus hook if isHover or isTouch are active
+    const { focusProps, isFocus } = useFocus({
+        isDisabled: isLogicalFocusStrategy
+    });
+    const { hoverProps: popoverHoverProps, isHover: popoverIsHover } = useHover({ isDisabled });
+    const isPointer = anchor.x === 'pointer' || anchor.y === 'pointer';
+    const uniqueIdRef = useRef(useId());
+    const targetRef = useRef(null);
+    const coordsRef = useRef({ x: -9999, y: -9999 });
+    // if anchor is set to pointer and target does not have keyboard focus, use coords
+    const usedRef = isPointer && !isFocus ? coordsRef : targetRef;
+    const delay = isDatatip ? 0 : 250;
+    const toggleTimeoutRef = useRef(null);
+    const currentColorScheme = useColorScheme();
+    const newColorScheme = !currentColorScheme || currentColorScheme === 'light' ? 'dark' : 'light';
+    const focusActive = useRef(false);
+    const hoverActive = useRef(false);
+    const toggleTimeoutClear = () => {
+        if (toggleTimeoutRef.current) {
+            clearTimeout(toggleTimeoutRef.current);
+            toggleTimeoutRef.current = null;
+        }
+    };
+    /*
+     * This effect executes when isFocus/isLogicalFocus changes
+     * - focusActive ref is set if the focus change follows a Tab key
+     * - hoverActive ref is reset, if focusActive becomes true
+     */
+    useEffect(() => {
+        if (isLogicalFocusStrategy) {
+            focusActive.current = isLogicalFocus;
+        }
+        else {
+            focusActive.current = isFocus && globalTooltipManager.isTabKeyActive();
+        }
+        if (focusActive.current) {
+            hoverActive.current = false;
+        }
+    }, [isFocus, isLogicalFocus, isLogicalFocusStrategy]);
+    /*
+     * This effect executes when isHover state changes
+     * - focusActive ref is reset, if hoverActive becomes true
+     */
+    useEffect(() => {
+        hoverActive.current = isHover;
+        if (hoverActive.current) {
+            focusActive.current = false;
+        }
+    }, [isHover]);
+    useEffect(() => {
+        // inner function for state transitions on various trigger changes
+        const updateState = (open) => {
+            if (open) {
+                // At least one toggle event is set to true
+                switch (state) {
+                    case 'unmounted':
+                        setState('mountPending'); // Set mount pending state if tooltip is unmounted
+                        break;
+                    case 'unmounting': // Switch back to mounting when unmounting was in progress and the tooltip should stay on
+                        setState('mounting');
+                        onToggle?.({ value: true });
+                        break;
+                    case 'unmountPending':
+                        toggleTimeoutClear();
+                        setState('mounted'); // Clear timers immediately and keep the tooltip mounted
+                        break;
+                }
+            }
+            else {
+                // No toggle events are set to true
+                switch (state) {
+                    case 'mounting':
+                    case 'mounted':
+                        setState('unmountPending'); // Set unmount pending state if tooltip is mounted or in mounting transition
+                        break;
+                    case 'mountPending':
+                        toggleTimeoutClear();
+                        __resetCoords();
+                        setState('unmounted'); // Unmount tooltip immediately if mounting is pending
+                        break;
+                }
+            }
+        };
+        if (isInitialRenderTrigger.current) {
+            // On onitial render do not trigger rerender
+            isInitialRenderTrigger.current = false;
+            return;
+        }
+        // When pointer is used, handleMouseMove method is responsible for state updates
+        // until the tooltip is mounted
+        if (isPointer && isHover && state === 'unmounted') {
+            return;
+        }
+        updateState((isHover && hoverActive.current) ||
+            ((isFocus || isLogicalFocus) && focusActive.current) ||
+            popoverIsHover ||
+            isTouch);
+    }, [isHover, isFocus, isLogicalFocus, popoverIsHover, isTouch, isPointer, state, onToggle]);
+    const destroyCallback = useCallback(() => {
+        focusActive.current = false;
+        hoverActive.current = false;
+        onToggle?.({ value: false });
+    }, []); // cannot depend on the 'onToggle' prop as some clients tend to pass a new callback on each render
+    useEffect(() => {
+        if (isInitialRenderState.current) {
+            // On onitial render do not trigger rerender
+            isInitialRenderState.current = false;
+            return;
+        }
+        setState(isOpen ? 'mounting' : 'unmounting');
+    }, [isOpen]);
+    useEffect(() => {
+        return () => {
+            // make sure to clear the toggle timeout on unmount
+            toggleTimeoutClear();
+            // reset focusActive and hoverActive refs
+            focusActive.current = false;
+            hoverActive.current = false;
+        };
+    }, []);
+    /*
+     * This effect executes when the component state changes.
+     * On 'mounted' state, the tooltip registers itself with the global tooltip manager.
+     * On 'unmounted', the tooltip unregisters from the global tooltip manager.
+     */
+    useEffect(() => {
+        if (state === 'mounted') {
+            globalTooltipManager.register(destroyCallback);
+        }
+        else if (state === 'unmounted') {
+            globalTooltipManager.unregister(destroyCallback);
+        }
+    }, [state, destroyCallback]);
+    /*
+     * Set a timer to toggle the state afer the 'pending' period expires
+     */
+    useEffect(() => {
+        if (!toggleTimeoutRef.current && (state === 'mountPending' || state === 'unmountPending')) {
+            toggleTimeoutRef.current = setTimeout(() => {
+                toggleTimeoutClear();
+                // make sure the state has not changed in the mean time before onToggle
+                if ((state === 'mountPending' || state === 'unmountPending') &&
+                    state === stateRef.current) {
+                    onToggle?.({ value: state === 'mountPending' });
+                }
+            }, delay);
+        }
+        return () => {
+            toggleTimeoutClear();
+        };
+    }, [state, delay, onToggle]);
+    const handleMouseMove = (event) => {
+        // we only want track mouse move while the state is 'unmounted' or when moving a 'mounted' datatip
+        if (state !== 'unmounted' && !(variant === 'datatip' && state === 'mounted')) {
+            return;
+        }
+        const targetRect = targetRef?.current?.getBoundingClientRect();
+        // Tooltip maintains static offset from left side of window
+        const distanceX = document.body.scrollLeft + (targetRect?.left || 0) + (targetRect?.width || 0);
+        // Tooltip maintains static offset from top side of the window
+        const distanceY = document.body.scrollTop + (targetRect?.top || 0) + (targetRect?.height || 0);
+        // Display tooltip at the mouse position if both anchors are set to pointer
+        const x = anchor.x === 'pointer' ? event.clientX : distanceX;
+        const y = anchor.y === 'pointer' ? event.clientY : distanceY;
+        if (state === 'mounted') {
+            coordsRef.current = { x, y };
+            if (needsUpdate !== true)
+                setNeedsUpdate(true);
+        }
+        else if (state === 'unmounted') {
+            toggleTimeoutClear();
+            toggleTimeoutRef.current = setTimeout(() => {
+                if (state === 'unmounted') {
+                    coordsRef.current = { x, y };
+                    onToggle?.({ value: true });
+                }
+            }, delay);
+        }
+    };
+    const onLogicalFocus = (target) => {
+        setLogicalFocus(true);
+        targetRef.current = target;
+        usedRef.current = target;
+    };
+    const onLogicalBlur = () => {
+        setLogicalFocus(false);
+    };
+    const onFocusCallback = useCallback((event) => {
+        if (event.eventPhase === Event.AT_TARGET ||
+            (event.eventPhase === Event.BUBBLING_PHASE && isDatatip)) {
+            targetRef.current = event.target;
+        }
+    }, [isDatatip]);
+    const onBlurCallback = useCallback((event) => {
+        if (event.eventPhase === Event.AT_TARGET) {
+            // reset focusActive flag
+            focusActive.current = false;
+        }
+    }, []);
+    const focusInitProps = isLogicalFocusStrategy
+        ? {}
+        : {
+            onFocus: onFocusCallback,
+            onBlur: onBlurCallback
+        };
+    const hoverInitProps = {
+        onMouseEnter: useCallback((event) => {
+            targetRef.current = event.target;
+        }, [])
+    };
+    const keyInitProps = {
+        onKeyDown: useCallback((event) => {
+            if (event.code === 'Escape' && focusActive.current) {
+                event.preventDefault();
+                // focus no longer active after Escape
+                focusActive.current = false;
+                onToggle?.({ value: false });
+            }
+        }, [onToggle])
+    };
+    let actionableProps;
+    const __resetCoords = () => {
+        coordsRef.current = { x: -9999, y: -9999 };
+    };
+    if (disabled) {
+        actionableProps = mergeProps(hoverProps, focusProps, hoverInitProps, focusInitProps);
+    }
+    else {
+        const anchorInitProps = {
+            'aria-describedby': uniqueIdRef.current,
+            ...(isPointer && {
+                onMouseLeave: () => {
+                    if (state === 'mounting') {
+                        return;
+                    }
+                    toggleTimeoutClear();
+                },
+                onMouseMove: (event) => {
+                    handleMouseMove(event);
+                }
+            })
+        };
+        actionableProps = mergeProps(hoverProps, focusProps, touchProps, hoverInitProps, focusInitProps, anchorInitProps, keyInitProps, isLogicalFocusStrategy ? { onLogicalFocus, onLogicalBlur } : {});
+    }
+    // No need to process tooltip if disabled or no text is provided
+    // Include actionableProps to detect mouseenter in components
+    // hovered state won't update unless actionableProps are already present in the component when mouse enters
+    if (disabled) {
+        toggleTimeoutClear();
+        __resetCoords();
+        return {
+            tooltipContent: null,
+            tooltipProps: actionableProps
+        };
+    }
+    const placement = positionToPlacement(position);
+    const handleTransitionEnd = () => {
+        if (state === 'mounting') {
+            setState('mounted');
+        }
+        if (state === 'unmounting') {
+            __resetCoords();
+            setState('unmounted');
+        }
+    };
+    const renderRawContent = (jsx(TooltipContent, { id: uniqueIdRef.current, testId: testId, isOpen: ['mounting', 'mounted', 'unmountPending'].includes(state), ...popoverHoverProps, isDatatip: isDatatip, onTransitionEnd: handleTransitionEnd, children: text }));
+    const renderTooltipOrDatatip = () => {
+        if (variant === 'tooltip') {
+            return (jsx(EnvironmentProvider, { environment: { colorScheme: newColorScheme }, children: renderRawContent }));
+        }
+        else {
+            return jsx(Fragment, { children: renderRawContent });
+        }
+    };
+    const renderContent = (jsx(Layer, { children: jsx(Floating, { anchorRef: usedRef, placement: placement, offsetValue: offset, children: renderTooltipOrDatatip() }) }));
+    return {
+        tooltipContent: !['unmounted', 'mountPending'].includes(state) && renderContent,
+        tooltipProps: actionableProps
+    };
+};
+
+export { useTooltipControlled as u };
+//# sourceMappingURL=useTooltipControlled-2044f639.js.map