@oracle/oraclejet-preact 14.0.0 → 14.0.2

package/es/PRIVATE_List.js.map

@@ -1 +1 @@
-{"version":3,"file":"PRIVATE_List.js","sources":["../../src/PRIVATE_List/ListRoles.ts","../../src/PRIVATE_List/ListItem.tsx","../../src/PRIVATE_List/SkeletonContainer.tsx","../../src/PRIVATE_List/List.tsx","../../src/PRIVATE_List/index.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 { Roles } from '../UNSAFE_ListView';\n\n/**\n * List Roles need to be kept in matching sets, this module encapsulates the sets\n *\n * @param ariaRole\n * @returns matching, valid set of roles\n */\n\nconst getListViewRoles = (ariaRole: Roles) => {\n  switch (ariaRole) {\n    case 'listbox':\n      return { list: 'listbox', item: 'presentation', cell: 'option' };\n    case 'treegrid':\n      return { list: 'treegrid', item: 'row', cell: 'gridcell' };\n    default:\n      return { list: 'grid', item: 'row', cell: 'gridcell' };\n  }\n};\n\nexport { getListViewRoles };\n","/**\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 { ComponentChildren } from 'preact';\nimport { useRef, useMemo } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { TabbableModeContext } from '../hooks/UNSAFE_useTabbableMode';\nimport { SelectionMode, CurrentItemVariant } from '../UNSAFE_Collection';\nimport { FocusTrap } from '../UNSAFE_FocusTrap';\nimport { useId } from '../hooks/UNSAFE_useId';\nimport { Roles } from '../UNSAFE_ListView';\nimport { getListViewRoles } from './ListRoles';\n\n// default style class for items in ListView\nexport const ITEM_STYLE_CLASS = 'oj-listview-item';\nexport const ITEM_SELECTOR = '.' + ITEM_STYLE_CLASS;\n\nconst styles = {\n  base: cssProps`${{\n    display: 'flex',\n    alignItems: 'center',\n    minHeight: 'var(--oj-collection-list-row-height)',\n    boxSizing: 'border-box',\n    backgroundImage:\n      'linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color))',\n    backgroundSize: 0,\n    backgroundPosition: '0 100%',\n    backgroundRepeat: 'no-repeat',\n    borderTop: '1px solid transparent'\n  }}`,\n  gridlines: cssProps`${{\n    backgroundSize: '100% 1px'\n  }}`,\n  gridlineTop: cssProps`${{\n    backgroundImage: `linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color)),\n      linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color))`,\n    backgroundPosition: '0 100%, 0 -1px',\n    backgroundSize: '100% 1px, 100% 1px'\n  }}`,\n  selectable: cssProps`${{\n    '&:hover': {\n      backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-hover);'\n    }\n  }}`,\n  selected: cssProps`${{\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-selected)'\n  }}`,\n  selectedSingle: cssProps`${{\n    borderTop: '1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-border-color-selected)',\n    boxShadow: 'inset 0 -1px var(--oj-c-PRIVATE-DO-NOT-USE-core-border-color-selected)'\n  }}`,\n  suggestionEnd: cssProps`${{\n    backgroundSize: '100% 1px'\n  }}`,\n  highlight: cssProps`${{\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-hover);'\n  }}`,\n  focused: cssProps`${{\n    outlineStyle: 'dotted',\n    outlineWidth: '1px',\n    outlineColor: 'var(---oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color)',\n    outlineOffset: '-1px'\n  }}`\n};\n\nconst cellStyles = {\n  base: cssProps`${{\n    flexGrow: '1'\n  }}`,\n  checkboxContainer: cssProps`${{\n    display: 'flex'\n  }}`\n};\n\n/**\n * Props for the ListViewItem Component\n */\nexport type Props<K> = {\n  children: ComponentChildren;\n  itemKey: K;\n  itemIndex: number;\n  isFocused: boolean;\n  isFocusRingVisible: boolean;\n  isGridlineVisible: boolean;\n  isSelected: boolean;\n  isTopGridlineVisible?: boolean;\n  isTabbable?: boolean;\n  role: Roles;\n  selectionMode: SelectionMode;\n  suggestion?: 'end' | true;\n  currentItemVariant?: CurrentItemVariant;\n};\n\n/**\n * The internal component used to render a single item in ListView.\n */\nexport function ListViewItem<K extends string | number>({\n  children,\n  itemKey,\n  itemIndex,\n  isFocused,\n  isFocusRingVisible,\n  isGridlineVisible,\n  isSelected,\n  isTopGridlineVisible = false,\n  isTabbable = false,\n  role,\n  selectionMode,\n  suggestion,\n  currentItemVariant\n}: Props<K>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const roles = useMemo(() => getListViewRoles(role), [role]);\n\n  // some roles come with related aria attributes which need to be set\n  const cellRoleAttributes =\n    roles.cell === 'option'\n      ? {\n          role: roles.cell,\n          'aria-posinset': itemIndex + 1,\n          'aria-setsize': -1\n        }\n      : {\n          role: roles.cell\n        };\n\n  // don't bubble Arrow Up and Down events to parent when in isTabbable mode\n  // this bubbling causes the outer CollectionFocus ring to change index while in the isTabbable mode.\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (isTabbable && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n      event.stopPropagation();\n    }\n  };\n\n  const classes = classNames([\n    styles.base,\n    ITEM_STYLE_CLASS,\n    isFocused && isFocusRingVisible && styles.focused,\n    isGridlineVisible && styles.gridlines,\n    isTopGridlineVisible && styles.gridlineTop,\n    isSelectable(selectionMode, isSelected) && !isSelected && styles.selectable,\n    isSelected && styles.selected,\n    isSelected && selectionMode === 'single' && styles.selectedSingle,\n    suggestion === 'end' &&\n      !isGridlineVisible &&\n      !(isSelected && selectionMode === 'single') &&\n      styles.suggestionEnd,\n    currentItemVariant === 'highlight' && isFocused && !isSelected && styles.highlight\n  ]);\n\n  const cellClasses = classNames([\n    cellStyles.base,\n    selectionMode === 'multiple' && cellStyles.checkboxContainer\n  ]);\n\n  // todo: use translated text for selector\n  // note cannot put focus on gridcell div since JAWS will not read the aria-rowindex\n  // correctly, so unfortunately needed another div\n  return (\n    <div\n      aria-rowindex={itemIndex + 1}\n      data-oj-key={itemKey}\n      class={classes}\n      ref={rootRef}\n      role={roles.item}\n      {...(suggestion && { 'data-oj-suggestion': true })}\n      {...(typeof itemKey === 'number' && { 'data-oj-key-type': 'number' })}>\n      <div\n        id={useId()}\n        class={cellClasses}\n        aria-posinset={itemIndex + 1}\n        aria-setsize={-1}\n        onKeyDown={handleKeyDown}\n        aria-colindex={1}\n        aria-selected={selectionMode !== 'none' ? isSelected : undefined}\n        {...cellRoleAttributes}>\n        <TabbableModeContext.Provider value={{ isTabbable }}>\n          <FocusTrap isDisabled={!isTabbable} restoreFocusRef={false}>\n            {children}\n          </FocusTrap>\n        </TabbableModeContext.Provider>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Helper method to determine whether item is selectable\n * @returns true if item is selectable (show hover effect), false otherwise\n */\nconst isSelectable = (selectionMode: SelectionMode, isItemSelected: boolean) => {\n  return selectionMode !== 'none' && (selectionMode === 'multiple' || !isItemSelected);\n};\n","/**\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 { ComponentChildren } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\n\ntype Props = {\n  /**\n   * Allows to pass and access the properties from child elements\n   **/\n  children?: (index: number) => ComponentChildren;\n  /**\n   * Allows to specify number of skeletons to be rendered on initial load\n   **/\n  minimumCount?: number;\n};\n\nconst containerStyle = {\n  base: cssProps`${{\n    height: '100%',\n    overflowX: 'hidden',\n    overflowY: 'hidden'\n  }}`\n};\n\n/**\n * Allows to specify the time delay for rendering the component\n **/\nconst timerValue = 50;\n\n/**\n * SkeletonContainer renders 'minimumCount' number of skeletons\n * of the variant specified from its child element - Skeleton's prop after\n * 'timerValue' ms delay\n **/\nexport function SkeletonContainer({ children, minimumCount = 1 }: Props) {\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    setTimeout(() => {\n      setIsVisible(true);\n    }, timerValue);\n  }, []);\n\n  const containerClasses = classNames([containerStyle.base]);\n  return isVisible && children ? (\n    <div class={containerClasses} role=\"presentation\">\n      {[...Array(minimumCount)].map((_element, index) => children(index))}\n    </div>\n  ) : null;\n}\n","/**\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 { RefObject } from 'preact';\nimport { useRef, useCallback, useEffect, useState, useMemo } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { containsKey, Keys, isKeyDefined } from '../utils/UNSAFE_keys';\nimport { DataState, ItemContext, Metadata, Range, SelectionDetail } from '../UNSAFE_Collection';\nimport { LoadMoreCollection } from '../UNSAFE_LoadMoreCollection/LoadMoreCollection';\nimport { VirtualizedCollection, PLACEHOLDER_STYLE_CLASS } from '../PRIVATE_VirtualizedCollection';\nimport { ViewportConfig } from '../hooks/UNSAFE_useViewportIntersect';\nimport { ListViewItem, ITEM_SELECTOR } from './ListItem';\nimport { SelectionRangeDetail, useSelection } from '../hooks/PRIVATE_useSelection';\nimport { useCurrentKey } from '../hooks/PRIVATE_useCurrentKey';\nimport { useCollectionFocusRing } from '../hooks/PRIVATE_useCollectionFocusRing';\nimport { useTabbableModeSet } from '../hooks/PRIVATE_useTabbableModeSet';\nimport { useItemAction } from '../hooks/PRIVATE_useItemAction';\nimport { SkeletonContainer } from './SkeletonContainer';\nimport { Skeleton } from '../UNSAFE_Skeleton';\nimport { Flex } from '../UNSAFE_Flex';\nimport {\n  getFirstVisibleKey,\n  getPrevNextKey,\n  findElementByKey,\n  keyExtractor\n} from '../utils/PRIVATE_collectionUtils';\nimport { Selector } from '../UNSAFE_Selector';\nimport { Props } from '../UNSAFE_ListView';\nimport { getListViewRoles } from './ListRoles';\n\nconst styles = {\n  base: cssProps`${{\n    height: '100%',\n    userSelect: 'none',\n    overflowY: 'inherit',\n    '&:focus': {\n      outlineStyle: 'none'\n    }\n  }}`\n};\n\nconst sparkleStyles = {\n  base: cssProps`${{\n    position: 'absolute',\n    top: 0,\n    width: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x)',\n    zIndex: 1,\n    display: 'block',\n    backgroundImage: 'var(--oj-c-PRIVATE-DO-NOT-USE-collection-sparkle-img)',\n    backgroundRepeat: 'no-repeat',\n    backgroundSize: '100% 100%'\n  }}`,\n  container: cssProps`${{\n    position: 'relative'\n  }}`\n};\n\n/**\n * Component that renders items as a flat list.\n * In order to maximize performance, only items that are visible in the viewport are rendered.\n */\nexport function List<K extends string | number, D>({\n  accessibleSummary,\n  allowTabbableMode = true,\n  children,\n  currentKey,\n  data,\n  gridlines,\n  loadingIndicator = defaultLoadingIndicator,\n  onCurrentKeyChange,\n  onLoadRange,\n  onSelectionChange,\n  onItemAction,\n  rangeExtractor,\n  role = 'grid',\n  selectedKeys = emptyKeys as Keys<K>,\n  selectionMode = 'none',\n  viewportConfig,\n  currentItemVariant = 'none',\n  isVirtualized = true\n}: Props<K, D>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const listRoles = useMemo(() => getListViewRoles(role), [role]);\n\n  // tracking the anchor key which is used for shift+click selection\n  const anchorKey = useRef<K | undefined>();\n\n  // tracking pending selection/current key that is not in current data\n  const pendingSelection = useRef<{ detail: SelectionRangeDetail<K>; range: Range }>();\n  const pendingCurrentKey = useRef<K>();\n\n  // tracking sparkle height\n  const [sparkleHeight, setSparkleHeight] = useState<number>(0);\n\n  const showGridline = (index: number) => {\n    // show bottom gridlines for each item, and for the last item if specified\n    return (\n      gridlines?.item === 'visible' &&\n      (index + 1 !== data?.totalSize || gridlines?.bottom === 'visible')\n    );\n  };\n\n  const showGridlineTop = () => {\n    // show the top gridline for the first item\n    return gridlines?.item === 'visible' && gridlines?.top === 'visible';\n  };\n\n  const ariaMultiSelectable = selectionMode === 'none' ? undefined : selectionMode === 'multiple';\n  const ariaRowCount =\n    data === null ? undefined : data.sizePrecision === 'exact' ? data.totalSize : -1;\n\n  const classes = classNames([styles.base]);\n\n  const { currentKeyProps } = useCurrentKey(\n    (element) => keyExtractor(element, ITEM_SELECTOR),\n    getPrevNextKey(rootRef.current, currentKey, true, ITEM_SELECTOR),\n    getPrevNextKey(rootRef.current, currentKey, false, ITEM_SELECTOR),\n    currentKey,\n    onCurrentKeyChange\n  );\n\n  const listViewContains = (elem: Element | null) => {\n    return !!rootRef.current?.contains(elem);\n  };\n\n  const [showFocusRing, focusRingProps] = useCollectionFocusRing(listViewContains, [\n    'ArrowUp',\n    'ArrowDown'\n  ]);\n\n  let pendingFocusRingChange = false;\n  const [isCurrentTabbableKey, tabbableModeProps] = useTabbableModeSet(\n    listViewContains,\n    (element) => keyExtractor(element, ITEM_SELECTOR) as K,\n    currentKey,\n    // handle clean-up on disabling of the mode\n    (target: EventTarget | null, isKeyboardEvent) => {\n      if (target === null || listViewContains(target as Element)) {\n        // delay focus reset for keyboard disable so focus is reset to ListView after the FocusTrap blur lifecycle completes.\n        // pointer initiated changes will fire the onBlur organically and delaying the focus, just generates an unwanted second blur\n        if (isKeyboardEvent) {\n          // do not show a focus ring during this timeOut\n          pendingFocusRingChange = true;\n          setTimeout(() => {\n            rootRef.current?.focus();\n          }, 0);\n        } else {\n          rootRef.current?.focus();\n        }\n      }\n    },\n    // set currentKey when mode is enabled\n    (key: K) => {\n      onCurrentKeyChange && onCurrentKeyChange({ value: key });\n    }\n  );\n\n  useEffect(() => {\n    if (currentKey != null && rootRef.current) {\n      const elem = findElementByKey(rootRef.current, currentKey, ITEM_SELECTOR);\n      if (elem) {\n        const scroller = viewportConfig?.scroller();\n        // make sure item is visible\n        scrollToVisible(elem, scroller != null ? scroller : rootRef.current);\n        const cell = elem.querySelector(`[role=${listRoles.cell}]`);\n        // update aria-activedescendant for screenreader\n        if (cell) {\n          rootRef.current.setAttribute('aria-activedescendant', cell.id);\n        }\n      }\n    }\n    // listen to data because the current item would re-render when the virtualizer\n    // is fetching data or updating the data, i.e. the id of current item would be updated,\n    // so the currentKey itself couldn't guarantee the root has latest aria-activedescendant\n  }, [currentKey, data, listRoles.cell, viewportConfig]);\n\n  const handleSelectionChange = useCallback(\n    (detail: SelectionDetail<K>) => {\n      if (onSelectionChange) {\n        if (detail.value.all === false && detail.value.keys.size > 0) {\n          // the last key selected by a user gesture is the anchor key\n          anchorKey.current = Array.from(detail.value.keys.values()).pop();\n        }\n        onSelectionChange(detail);\n      }\n    },\n    [anchorKey, onSelectionChange]\n  );\n\n  const handleSelectionRangeChange = useCallback(\n    (detail: SelectionRangeDetail<K>) => {\n      if (data && onSelectionChange) {\n        const value = handleSelectionRange(detail, data);\n        if (Array.isArray(value)) {\n          onSelectionChange({ value: { all: false, keys: new Set(value) }, target: null });\n        } else {\n          pendingSelection.current = {\n            detail: detail,\n            range: { offset: data.offset, count: data.data.length }\n          };\n          onLoadRange(value);\n        }\n      }\n    },\n    [data, onSelectionChange, onLoadRange]\n  );\n\n  const handleInitialFocus = useCallback(() => {\n    if (\n      rootRef.current &&\n      onCurrentKeyChange &&\n      (!allowTabbableMode || isCurrentTabbableKey(undefined))\n    ) {\n      const firstKey =\n        pendingCurrentKey.current || (getFirstVisibleKey(rootRef.current, ITEM_SELECTOR) as K);\n      if (isKeyDefined(firstKey)) {\n        onCurrentKeyChange({ value: firstKey });\n      }\n    }\n  }, [allowTabbableMode, onCurrentKeyChange, isCurrentTabbableKey]);\n\n  /**\n   * Used by allowTabbableMode = false, to prevent focus from getting onto checkboxes on click\n   * @param event\n   */\n  const handleSelectorFocusCapture = useCallback(\n    (event: FocusEvent) => {\n      const key = keyExtractor(event.target as HTMLElement, ITEM_SELECTOR);\n      if (key && (event.relatedTarget as HTMLElement)?.getAttribute('type') === 'checkbox') {\n        rootRef.current?.focus();\n        if (onCurrentKeyChange && key) {\n          onCurrentKeyChange({ value: key as K });\n        }\n      }\n    },\n    [onCurrentKeyChange]\n  );\n\n  const handleFocus = useCallback(\n    (event: FocusEvent) => {\n      !isKeyDefined(currentKey) && onCurrentKeyChange && handleInitialFocus();\n      !allowTabbableMode && handleSelectorFocusCapture(event);\n    },\n    [\n      allowTabbableMode,\n      currentKey,\n      handleInitialFocus,\n      handleSelectorFocusCapture,\n      onCurrentKeyChange\n    ]\n  );\n\n  const { selectionProps } = useSelection(\n    (element: HTMLElement) => {\n      if (element === rootRef.current) {\n        return currentKey === undefined ? null : currentKey;\n      }\n      return keyExtractor(element, ITEM_SELECTOR) as K;\n    },\n    selectedKeys,\n    selectionMode,\n    false,\n    'replace',\n    handleSelectionChange,\n    anchorKey.current,\n    currentKey,\n    (currentKey: K | undefined, isPrev: boolean) =>\n      getPrevNextKey(rootRef.current, currentKey, isPrev, ITEM_SELECTOR),\n    (key: K) => {\n      if (rootRef.current) {\n        const elem = findElementByKey(rootRef.current, key, ITEM_SELECTOR);\n        if (elem) {\n          const scroller = viewportConfig?.scroller();\n          scrollToVisible(elem, scroller != null ? scroller : rootRef.current);\n        }\n      }\n    },\n    handleSelectionRangeChange\n  );\n\n  if (data && pendingSelection.current !== undefined && onSelectionChange) {\n    const keys = handleSelectionRange(pendingSelection.current.detail, data);\n    if (Array.isArray(keys)) {\n      onSelectionChange({ value: { all: false, keys: new Set(keys) }, target: null });\n    }\n    const range = pendingSelection.current\n      ? pendingSelection.current.range\n      : { offset: data.offset, count: data.data.length };\n    data = adjustDataState(data, range);\n    pendingSelection.current = undefined;\n    onLoadRange(range);\n  }\n\n  const suggestions = useMemo(() => findSuggestions(data), [data]);\n\n  // TODO: check suggestions before Sparkle would cause a scrolling issue\n  const sparkleIndicator = <Sparkle sparkleHeight={sparkleHeight}></Sparkle>;\n\n  const itemActionProps = useItemAction(currentKey, data, onItemAction, ITEM_SELECTOR);\n\n  useEffect(() => {\n    // update sparkleHeight only when we have suggestions\n    // avoid unnecessary iterating through elements\n    if (suggestions) {\n      const placeholder = rootRef.current?.querySelector(\n        '.' + PLACEHOLDER_STYLE_CLASS\n      ) as HTMLElement;\n      let height = placeholder?.offsetHeight || 0;\n      const suggestionItems = rootRef.current?.querySelectorAll('[data-oj-suggestion]');\n      suggestionItems?.forEach((item) => (height += (item as HTMLElement).offsetHeight));\n      setSparkleHeight(height);\n    }\n  }, [suggestions]);\n\n  // returns an ListItemContext based on ItemContext (added metadata and selector)\n  const getItemContext = useCallback(\n    (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => {\n      const selectorRenderer =\n        selectionMode === 'multiple'\n          ? () => (\n              <Selector\n                onChange={handleSelectionChange}\n                rowKey={context.data.metadata.key}\n                selectedKeys={selectedKeys}></Selector>\n            )\n          : undefined;\n\n      return {\n        index: context.index,\n        data: context.data.data,\n        metadata: context.data.metadata,\n        selector: selectorRenderer\n      };\n    },\n    [selectionMode, selectedKeys, handleSelectionChange]\n  );\n\n  const childrenComponent = (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => {\n    const listItemContext = getItemContext(context);\n    const suggestion = suggestions?.get(listItemContext.metadata.key);\n    const isTabbable = allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key);\n    const isFocused = currentKey === listItemContext.metadata.key && !isTabbable;\n    const isSelected = containsKey(selectedKeys, listItemContext.metadata.key);\n    return (\n      <ListViewItem\n        key={listItemContext.metadata.key}\n        isFocused={isFocused}\n        isFocusRingVisible={showFocusRing && !pendingFocusRingChange}\n        isGridlineVisible={showGridline(listItemContext.index)}\n        isSelected={isSelected}\n        isTabbable={allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key)}\n        itemIndex={listItemContext.index}\n        itemKey={listItemContext.metadata.key}\n        role={role}\n        selectionMode={selectionMode}\n        currentItemVariant={currentItemVariant}\n        {...(suggestion && { suggestion })}\n        {...(listItemContext.index === 0 && { isTopGridlineVisible: showGridlineTop() })}>\n        {children(listItemContext)}\n      </ListViewItem>\n    );\n  };\n\n  viewportConfig = getViewportConfig(rootRef, viewportConfig);\n  const collectionComponent = isVirtualized ? (\n    <VirtualizedCollection\n      data={data}\n      itemSelector={ITEM_SELECTOR}\n      loadMoreIndicator={defaultLoadMoreIndicator}\n      onLoadRange={onLoadRange}\n      rangeExtractor={rangeExtractor}\n      suggestions={sparkleIndicator}\n      viewportConfig={viewportConfig}>\n      {childrenComponent}\n    </VirtualizedCollection>\n  ) : (\n    <LoadMoreCollection\n      data={data}\n      loadMoreIndicator={defaultLoadMoreIndicator}\n      onLoadRange={onLoadRange}\n      suggestions={sparkleIndicator}\n      viewportConfig={viewportConfig}>\n      {childrenComponent}\n    </LoadMoreCollection>\n  );\n\n  /**\n   * Need to track pointer down element to set currentItem when initial focus happens\n   */\n  const handlePointerDown = useCallback((event: PointerEvent) => {\n    const key = keyExtractor(event.target as HTMLElement, ITEM_SELECTOR);\n    if (isKeyDefined(key)) pendingCurrentKey.current = key as K;\n  }, []);\n\n  // if data is not specified, listview should show loading indicator\n  // todo: replace placeholder with actual SkeletonContainer component (Ash is working on)\n  return (\n    <div\n      {...mergeProps(\n        allowTabbableMode ? tabbableModeProps : {},\n        currentKeyProps,\n        focusRingProps,\n        selectionProps,\n        itemActionProps,\n        { onFocus: handleFocus, onPointerDown: handlePointerDown }\n      )}\n      role={role}\n      aria-rowcount={ariaRowCount}\n      aria-colcount={1}\n      ref={rootRef}\n      class={classes}\n      tabIndex={0}\n      aria-label={accessibleSummary}\n      aria-multiselectable={ariaMultiSelectable}>\n      {data == null ? loadingIndicator : collectionComponent}\n    </div>\n  );\n}\n\n/**\n * A helper function that finds the data with suggestions, and\n * returns the corresponding keys\n * @param dataState\n */\nconst findSuggestions = <K, D>(dataState?: DataState<K, D> | null) => {\n  const data = dataState?.data;\n  const count = getSuggestionsCount(data);\n  if (count === 0) {\n    return null;\n  }\n\n  const suggestionsData = data!.slice(0, count);\n  return suggestionsData.reduce((suggestions, value, index) => {\n    const key = value.metadata.key;\n\n    if (index === count - 1) {\n      suggestions.set(key, 'end');\n    } else {\n      suggestions.set(key, true);\n    }\n\n    return suggestions;\n  }, new Map<K, 'end' | true>());\n};\n\n/**\n * A helper function that finds the number of suggestions\n * @param data\n */\nconst getSuggestionsCount = <K, D>(data?: DataState<K, D>['data']) => {\n  if (!data) {\n    return 0;\n  }\n\n  const index = data.findIndex((value) => !value.metadata.suggestion);\n  return index === -1 ? 0 : index;\n};\n\n/**\n * A helper function to make sure specified elem is visible in the specified container\n */\nconst scrollToVisible = (elem: Element, scroller: Element) => {\n  if (elem && scroller) {\n    const scrollerBounds = scroller.getBoundingClientRect();\n    const elemBounds = elem.getBoundingClientRect();\n    if (elemBounds.bottom > scrollerBounds.bottom) {\n      scroller.scrollTop = scroller.scrollTop + (elemBounds.bottom - scrollerBounds.bottom);\n    } else if (elemBounds.top < scrollerBounds.top) {\n      scroller.scrollTop = scroller.scrollTop - (scrollerBounds.top - elemBounds.top);\n    }\n  }\n};\n\nconst getViewportConfig = (rootRef: RefObject<HTMLElement>, config?: ViewportConfig) => {\n  return (\n    config ?? {\n      scroller: () => {\n        return rootRef.current;\n      }\n    }\n  );\n};\n\nconst emptyKeys = { all: false, keys: new Set() };\n\nconst handleSelectionRange = <K, D>(\n  detail: SelectionRangeDetail<K>,\n  dataState: DataState<K, D>\n) => {\n  const keys = dataState.data.map((value: { data: D; metadata: Metadata<K> }) => {\n    return value.metadata.key;\n  });\n  const startIndex = keys.indexOf(detail.value.start);\n  const endIndex = keys.indexOf(detail.value.end);\n  const minIndex = Math.min(startIndex, endIndex);\n  const maxIndex = Math.max(startIndex, endIndex);\n  if (minIndex === -1) {\n    // return a range to fetch so we can find all the keys, maxIndex should not be -1\n    return { offset: 0, count: dataState.totalSize };\n  } else {\n    // range of keys are in the current viewport, return them\n    return keys.slice(minIndex, maxIndex + 1);\n  }\n};\n\n/**\n * A sparkle component for smart suggestion indicator in ListView\n * @param sparkleHeight the height of sparkle\n */\nexport function Sparkle({ sparkleHeight }: { sparkleHeight: number }) {\n  if (sparkleHeight <= 0) {\n    return null;\n  }\n\n  const height = sparkleHeight + 'px';\n  const sparkleClasses = classNames([sparkleStyles.base]);\n  const containerClasses = classNames([sparkleStyles.container]);\n\n  return (\n    <div key=\"sparkle\" class={containerClasses}>\n      <div class={sparkleClasses} style={{ height }}></div>\n    </div>\n  );\n}\n\nconst defaultLoadingIndicator = (\n  <SkeletonContainer minimumCount={25}>\n    {() => {\n      return (\n        <Flex height=\"12x\" align=\"center\">\n          <Skeleton height=\"4x\" />\n        </Flex>\n      );\n    }}\n  </SkeletonContainer>\n);\n\nconst defaultLoadMoreIndicator = (\n  <SkeletonContainer minimumCount={3}>\n    {() => {\n      return (\n        <Flex height=\"12x\" align=\"center\">\n          <Skeleton height=\"4x\" />\n        </Flex>\n      );\n    }}\n  </SkeletonContainer>\n);\n\n/**\n * Adjust the DataState as needed if it contains more than needed for the specified range\n */\nconst adjustDataState = <K, D>(dataState: DataState<K, D>, range: Range | null) => {\n  if (range) {\n    // prevent range offset from being larger than the data state\n    const safeRangeOffset = Math.min(range.offset, dataState.offset + dataState.totalSize);\n    const diff = safeRangeOffset - dataState.offset;\n    if (diff > 0) {\n      dataState = {\n        offset: safeRangeOffset,\n        data: dataState.data.slice(diff, diff + range.count),\n        totalSize: dataState.totalSize,\n        sizePrecision: dataState.sizePrecision\n      };\n    }\n  }\n  return dataState;\n};\n","/**\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\n/**\n * PRIVATE Components not intended for outside use,\n *\n * NOTE: Types for these need to be public and are defined in UNSAFE_ListView/List.types.ts\n */\nexport { List } from './List';\nexport { SkeletonContainer } from './SkeletonContainer';\n"],"names":["ITEM_STYLE_CLASS","ITEM_SELECTOR","styles","cellStyles","ListViewItem","children","itemKey","itemIndex","isFocused","isFocusRingVisible","isGridlineVisible","isSelected","isTopGridlineVisible","isTabbable","role","selectionMode","suggestion","currentItemVariant","rootRef","useRef","roles","useMemo","getListViewRoles","cellRoleAttributes","cell","handleKeyDown","event","key","base","focused","selectedSingle","suggestionEnd","checkboxContainer","isSelectable","isItemSelected","containerStyle","timerValue","SkeletonContainer","minimumCount","sparkleStyles","List","accessibleSummary","allowTabbableMode","currentKey","data","gridlines","loadingIndicator","defaultLoadingIndicator","onCurrentKeyChange","onLoadRange","onSelectionChange","onItemAction","rangeExtractor","selectedKeys","emptyKeys","viewportConfig","isVirtualized","listRoles","anchorKey","pendingSelection","pendingCurrentKey","showGridline","index","ariaMultiSelectable","undefined","ariaRowCount","sizePrecision","totalSize","listViewContains","elem","_a","current","contains","target","isKeyboardEvent","focus","findElementByKey","scrollToVisible","scroller","querySelector","handleSelectionChange","useCallback","detail","value","all","keys","size","Array","from","values","pop","handleSelectionRangeChange","isArray","range","offset","count","length","handleInitialFocus","firstKey","getFirstVisibleKey","isKeyDefined","handleSelectorFocusCapture","relatedTarget","getAttribute","_b","handleFocus","element","keyExtractor","isPrev","getPrevNextKey","handleSelectionRange","adjustDataState","suggestions","findSuggestions","itemActionProps","useItemAction","placeholder","PLACEHOLDER_STYLE_CLASS","height","offsetHeight","getItemContext","context","selectorRenderer","metadata","selector","childrenComponent","listItemContext","get","isCurrentTabbableKey","containsKey","getViewportConfig","collectionComponent","_jsx","VirtualizedCollection","Object","assign","itemSelector","loadMoreIndicator","defaultLoadMoreIndicator","sparkleIndicator","LoadMoreCollection","handlePointerDown","mergeProps","tabbableModeProps","currentKeyProps","focusRingProps","selectionProps","onFocus","onPointerDown","ref","class","classes","tabIndex","dataState","getSuggestionsCount","set","Map","findIndex","scrollerBounds","getBoundingClientRect","elemBounds","bottom","scrollTop","top","config","Set","startIndex","indexOf","start","endIndex","end","minIndex","Sparkle","sparkleHeight","safeRangeOffset","Math","min","diff","slice"],"mappings":"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"}
+{"version":3,"file":"PRIVATE_List.js","sources":["../../src/PRIVATE_List/ListRoles.ts","../../src/PRIVATE_List/ListItem.tsx","../../src/PRIVATE_List/SkeletonContainer.tsx","../../src/PRIVATE_List/List.tsx","../../src/PRIVATE_List/index.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 { Roles } from '../UNSAFE_ListView';\n\n/**\n * List Roles need to be kept in matching sets, this module encapsulates the sets\n *\n * @param ariaRole\n * @returns matching, valid set of roles\n */\n\nconst getListViewRoles = (ariaRole: Roles) => {\n  switch (ariaRole) {\n    case 'listbox':\n      return { list: 'listbox', item: 'presentation', cell: 'option' };\n    case 'treegrid':\n      return { list: 'treegrid', item: 'row', cell: 'gridcell' };\n    default:\n      return { list: 'grid', item: 'row', cell: 'gridcell' };\n  }\n};\n\nexport { getListViewRoles };\n","/**\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 { ComponentChildren } from 'preact';\nimport { useRef, useMemo } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { TabbableModeContext } from '../hooks/UNSAFE_useTabbableMode';\nimport { SelectionMode, CurrentItemVariant } from '../UNSAFE_Collection';\nimport { FocusTrap } from '../UNSAFE_FocusTrap';\nimport { useId } from '../hooks/UNSAFE_useId';\nimport { Roles } from '../UNSAFE_ListView';\nimport { getListViewRoles } from './ListRoles';\n\n// default style class for items in ListView\nexport const ITEM_STYLE_CLASS = 'oj-listview-item';\nexport const ITEM_SELECTOR = '.' + ITEM_STYLE_CLASS;\n\nconst styles = {\n  base: cssProps`${{\n    display: 'flex',\n    alignItems: 'center',\n    minHeight: 'var(--oj-collection-list-row-height)',\n    boxSizing: 'border-box',\n    backgroundImage:\n      'linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color))',\n    backgroundSize: 0,\n    backgroundPosition: '0 100%',\n    backgroundRepeat: 'no-repeat',\n    borderTop: '1px solid transparent'\n  }}`,\n  gridlines: cssProps`${{\n    backgroundSize: '100% 1px'\n  }}`,\n  gridlineTop: cssProps`${{\n    backgroundImage: `linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color)),\n      linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color),var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color))`,\n    backgroundPosition: '0 100%, 0 -1px',\n    backgroundSize: '100% 1px, 100% 1px'\n  }}`,\n  selectable: cssProps`${{\n    '&:hover': {\n      backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-hover);'\n    }\n  }}`,\n  selected: cssProps`${{\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-selected)'\n  }}`,\n  selectedSingle: cssProps`${{\n    borderTop: '1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-border-color-selected)',\n    boxShadow: 'inset 0 -1px var(--oj-c-PRIVATE-DO-NOT-USE-core-border-color-selected)'\n  }}`,\n  suggestionEnd: cssProps`${{\n    backgroundSize: '100% 1px'\n  }}`,\n  highlight: cssProps`${{\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-bg-color-hover);'\n  }}`,\n  focused: cssProps`${{\n    outlineStyle: 'dotted',\n    outlineWidth: '1px',\n    outlineColor: 'var(---oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color)',\n    outlineOffset: '-1px'\n  }}`\n};\n\nconst cellStyles = {\n  base: cssProps`${{\n    flexGrow: '1'\n  }}`,\n  checkboxContainer: cssProps`${{\n    display: 'flex'\n  }}`\n};\n\n/**\n * Props for the ListViewItem Component\n */\nexport type Props<K> = {\n  children: ComponentChildren;\n  itemKey: K;\n  itemIndex: number;\n  isFocused: boolean;\n  isFocusRingVisible: boolean;\n  isGridlineVisible: boolean;\n  isSelected: boolean;\n  isTopGridlineVisible?: boolean;\n  isTabbable?: boolean;\n  role: Roles;\n  selectionMode: SelectionMode;\n  suggestion?: 'end' | true;\n  currentItemVariant?: CurrentItemVariant;\n};\n\n/**\n * The internal component used to render a single item in ListView.\n */\nexport function ListViewItem<K extends string | number>({\n  children,\n  itemKey,\n  itemIndex,\n  isFocused,\n  isFocusRingVisible,\n  isGridlineVisible,\n  isSelected,\n  isTopGridlineVisible = false,\n  isTabbable = false,\n  role,\n  selectionMode,\n  suggestion,\n  currentItemVariant\n}: Props<K>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const roles = useMemo(() => getListViewRoles(role), [role]);\n\n  // some roles come with related aria attributes which need to be set\n  const cellRoleAttributes =\n    roles.cell === 'option'\n      ? {\n          role: roles.cell,\n          'aria-posinset': itemIndex + 1,\n          'aria-setsize': -1\n        }\n      : {\n          role: roles.cell\n        };\n\n  // don't bubble Arrow Up and Down events to parent when in isTabbable mode\n  // this bubbling causes the outer CollectionFocus ring to change index while in the isTabbable mode.\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (isTabbable && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {\n      event.stopPropagation();\n    }\n  };\n\n  const classes = classNames([\n    styles.base,\n    ITEM_STYLE_CLASS,\n    isFocused && isFocusRingVisible && styles.focused,\n    isGridlineVisible && styles.gridlines,\n    isTopGridlineVisible && styles.gridlineTop,\n    isSelectable(selectionMode, isSelected) && !isSelected && styles.selectable,\n    isSelected && styles.selected,\n    isSelected && selectionMode === 'single' && styles.selectedSingle,\n    suggestion === 'end' &&\n      !isGridlineVisible &&\n      !(isSelected && selectionMode === 'single') &&\n      styles.suggestionEnd,\n    currentItemVariant === 'highlight' && isFocused && !isSelected && styles.highlight\n  ]);\n\n  const cellClasses = classNames([\n    cellStyles.base,\n    selectionMode === 'multiple' && cellStyles.checkboxContainer\n  ]);\n\n  // todo: use translated text for selector\n  // note cannot put focus on gridcell div since JAWS will not read the aria-rowindex\n  // correctly, so unfortunately needed another div\n  return (\n    <div\n      aria-rowindex={itemIndex + 1}\n      data-oj-key={itemKey}\n      class={classes}\n      ref={rootRef}\n      role={roles.item}\n      {...(suggestion && { 'data-oj-suggestion': true })}\n      {...(typeof itemKey === 'number' && { 'data-oj-key-type': 'number' })}>\n      <div\n        id={useId()}\n        class={cellClasses}\n        aria-posinset={itemIndex + 1}\n        aria-setsize={-1}\n        onKeyDown={handleKeyDown}\n        aria-colindex={1}\n        aria-selected={selectionMode !== 'none' ? isSelected : undefined}\n        {...cellRoleAttributes}>\n        <TabbableModeContext.Provider value={{ isTabbable }}>\n          <FocusTrap isDisabled={!isTabbable} restoreFocusRef={false}>\n            {children}\n          </FocusTrap>\n        </TabbableModeContext.Provider>\n      </div>\n    </div>\n  );\n}\n\n/**\n * Helper method to determine whether item is selectable\n * @returns true if item is selectable (show hover effect), false otherwise\n */\nconst isSelectable = (selectionMode: SelectionMode, isItemSelected: boolean) => {\n  return selectionMode !== 'none' && (selectionMode === 'multiple' || !isItemSelected);\n};\n","/**\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 { ComponentChildren } from 'preact';\nimport { useState, useEffect } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\n\ntype Props = {\n  /**\n   * Allows to pass and access the properties from child elements\n   **/\n  children?: (index: number) => ComponentChildren;\n  /**\n   * Allows to specify number of skeletons to be rendered on initial load\n   **/\n  minimumCount?: number;\n};\n\nconst containerStyle = {\n  base: cssProps`${{\n    height: '100%',\n    overflowX: 'hidden',\n    overflowY: 'hidden'\n  }}`\n};\n\n/**\n * Allows to specify the time delay for rendering the component\n **/\nconst timerValue = 50;\n\n/**\n * SkeletonContainer renders 'minimumCount' number of skeletons\n * of the variant specified from its child element - Skeleton's prop after\n * 'timerValue' ms delay\n **/\nexport function SkeletonContainer({ children, minimumCount = 1 }: Props) {\n  const [isVisible, setIsVisible] = useState(false);\n\n  useEffect(() => {\n    setTimeout(() => {\n      setIsVisible(true);\n    }, timerValue);\n  }, []);\n\n  const containerClasses = classNames([containerStyle.base]);\n  return isVisible && children ? (\n    <div class={containerClasses} role=\"presentation\">\n      {[...Array(minimumCount)].map((_element, index) => children(index))}\n    </div>\n  ) : null;\n}\n","/**\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 { RefObject } from 'preact';\nimport { useRef, useCallback, useEffect, useState, useMemo } from 'preact/hooks';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { containsKey, Keys, isKeyDefined } from '../utils/UNSAFE_keys';\nimport { DataState, ItemContext, Metadata, Range, SelectionDetail } from '../UNSAFE_Collection';\nimport { LoadMoreCollection } from '../UNSAFE_LoadMoreCollection/LoadMoreCollection';\nimport { VirtualizedCollection, PLACEHOLDER_STYLE_CLASS } from '../PRIVATE_VirtualizedCollection';\nimport { ViewportConfig } from '../hooks/UNSAFE_useViewportIntersect';\nimport { ListViewItem, ITEM_SELECTOR } from './ListItem';\nimport { SelectionRangeDetail, useSelection } from '../hooks/PRIVATE_useSelection';\nimport { useCurrentKey } from '../hooks/PRIVATE_useCurrentKey';\nimport { useCollectionFocusRing } from '../hooks/PRIVATE_useCollectionFocusRing';\nimport { useTabbableModeSet } from '../hooks/PRIVATE_useTabbableModeSet';\nimport { useItemAction } from '../hooks/PRIVATE_useItemAction';\nimport { SkeletonContainer } from './SkeletonContainer';\nimport { Skeleton } from '../UNSAFE_Skeleton';\nimport { Flex } from '../UNSAFE_Flex';\nimport {\n  getFirstVisibleKey,\n  getPrevNextKey,\n  findElementByKey,\n  keyExtractor\n} from '../utils/PRIVATE_collectionUtils';\nimport { Selector } from '../UNSAFE_Selector';\nimport { Props } from '../UNSAFE_ListView';\nimport { getListViewRoles } from './ListRoles';\n\nconst styles = {\n  base: cssProps`${{\n    height: '100%',\n    userSelect: 'none',\n    overflowY: 'inherit',\n    '&:focus': {\n      outlineStyle: 'none'\n    }\n  }}`\n};\n\nconst sparkleStyles = {\n  base: cssProps`${{\n    position: 'absolute',\n    top: 0,\n    width: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x)',\n    zIndex: 1,\n    display: 'block',\n    backgroundImage: 'var(--oj-c-PRIVATE-DO-NOT-USE-collection-sparkle-img)',\n    backgroundRepeat: 'no-repeat',\n    backgroundSize: '100% 100%'\n  }}`,\n  container: cssProps`${{\n    position: 'relative'\n  }}`\n};\n\n/**\n * Component that renders items as a flat list.\n * In order to maximize performance, only items that are visible in the viewport are rendered.\n */\nexport function List<K extends string | number, D>({\n  accessibleSummary,\n  allowTabbableMode = true,\n  children,\n  currentKey,\n  data,\n  gridlines,\n  loadingIndicator = defaultLoadingIndicator,\n  onCurrentKeyChange,\n  onLoadRange,\n  onSelectionChange,\n  onItemAction,\n  rangeExtractor,\n  role = 'grid',\n  selectedKeys = emptyKeys as Keys<K>,\n  selectionMode = 'none',\n  viewportConfig,\n  currentItemVariant = 'none',\n  isVirtualized = true\n}: Props<K, D>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const listRoles = useMemo(() => getListViewRoles(role), [role]);\n\n  // tracking the anchor key which is used for shift+click selection\n  const anchorKey = useRef<K | undefined>();\n\n  // tracking pending selection/current key that is not in current data\n  const pendingSelection = useRef<{ detail: SelectionRangeDetail<K>; range: Range }>();\n  const pendingCurrentKey = useRef<K>();\n\n  // tracking sparkle height\n  const [sparkleHeight, setSparkleHeight] = useState<number>(0);\n\n  const showGridline = (index: number) => {\n    // show bottom gridlines for each item, and for the last item if specified\n    return (\n      gridlines?.item === 'visible' &&\n      (index + 1 !== data?.totalSize || gridlines?.bottom === 'visible')\n    );\n  };\n\n  const showGridlineTop = () => {\n    // show the top gridline for the first item\n    return gridlines?.item === 'visible' && gridlines?.top === 'visible';\n  };\n\n  const ariaMultiSelectable = selectionMode === 'none' ? undefined : selectionMode === 'multiple';\n  const ariaRowCount =\n    data === null ? undefined : data.sizePrecision === 'exact' ? data.totalSize : -1;\n\n  const classes = classNames([styles.base]);\n\n  const { currentKeyProps } = useCurrentKey(\n    (element) => keyExtractor(element, ITEM_SELECTOR),\n    getPrevNextKey(rootRef.current, currentKey, true, ITEM_SELECTOR),\n    getPrevNextKey(rootRef.current, currentKey, false, ITEM_SELECTOR),\n    currentKey,\n    onCurrentKeyChange\n  );\n\n  const listViewContains = (elem: Element | null) => {\n    return !!rootRef.current?.contains(elem);\n  };\n\n  const [showFocusRing, focusRingProps] = useCollectionFocusRing(listViewContains, [\n    'ArrowUp',\n    'ArrowDown'\n  ]);\n\n  let pendingFocusRingChange = false;\n  const [isCurrentTabbableKey, tabbableModeProps] = useTabbableModeSet(\n    listViewContains,\n    (element) => keyExtractor(element, ITEM_SELECTOR) as K,\n    currentKey,\n    // handle clean-up on disabling of the mode\n    (target: EventTarget | null, isKeyboardEvent) => {\n      if (target === null || listViewContains(target as Element)) {\n        // delay focus reset for keyboard disable so focus is reset to ListView after the FocusTrap blur lifecycle completes.\n        // pointer initiated changes will fire the onBlur organically and delaying the focus, just generates an unwanted second blur\n        if (isKeyboardEvent) {\n          // do not show a focus ring during this timeOut\n          pendingFocusRingChange = true;\n          setTimeout(() => {\n            rootRef.current?.focus();\n          }, 0);\n        } else {\n          rootRef.current?.focus();\n        }\n      }\n    },\n    // set currentKey when mode is enabled\n    (key: K) => {\n      onCurrentKeyChange && onCurrentKeyChange({ value: key });\n    }\n  );\n\n  useEffect(() => {\n    if (currentKey != null && rootRef.current) {\n      const elem = findElementByKey(rootRef.current, currentKey, ITEM_SELECTOR);\n      if (elem) {\n        const scroller = viewportConfig?.scroller();\n        // make sure item is visible\n        scrollToVisible(elem, scroller != null ? scroller : rootRef.current);\n        const cell = elem.querySelector(`[role=${listRoles.cell}]`);\n        // update aria-activedescendant for screenreader\n        if (cell) {\n          rootRef.current.setAttribute('aria-activedescendant', cell.id);\n        }\n      }\n    }\n    // listen to data because the current item would re-render when the virtualizer\n    // is fetching data or updating the data, i.e. the id of current item would be updated,\n    // so the currentKey itself couldn't guarantee the root has latest aria-activedescendant\n  }, [currentKey, data, listRoles.cell, viewportConfig]);\n\n  const handleSelectionChange = useCallback(\n    (detail: SelectionDetail<K>) => {\n      if (onSelectionChange) {\n        if (detail.value.all === false && detail.value.keys.size > 0) {\n          // the last key selected by a user gesture is the anchor key\n          anchorKey.current = Array.from(detail.value.keys.values()).pop();\n        }\n        onSelectionChange(detail);\n      }\n    },\n    [anchorKey, onSelectionChange]\n  );\n\n  const handleSelectionRangeChange = useCallback(\n    (detail: SelectionRangeDetail<K>) => {\n      if (data && onSelectionChange) {\n        const value = handleSelectionRange(detail, data);\n        if (Array.isArray(value)) {\n          onSelectionChange({ value: { all: false, keys: new Set(value) }, target: null });\n        } else {\n          pendingSelection.current = {\n            detail: detail,\n            range: { offset: data.offset, count: data.data.length }\n          };\n          onLoadRange(value);\n        }\n      }\n    },\n    [data, onSelectionChange, onLoadRange]\n  );\n\n  const handleInitialFocus = useCallback(() => {\n    if (\n      rootRef.current &&\n      onCurrentKeyChange &&\n      (!allowTabbableMode || isCurrentTabbableKey(undefined))\n    ) {\n      const firstKey =\n        pendingCurrentKey.current || (getFirstVisibleKey(rootRef.current, ITEM_SELECTOR) as K);\n      if (isKeyDefined(firstKey)) {\n        onCurrentKeyChange({ value: firstKey });\n      }\n    }\n  }, [allowTabbableMode, onCurrentKeyChange, isCurrentTabbableKey]);\n\n  /**\n   * Used by allowTabbableMode = false, to prevent focus from getting onto checkboxes on click\n   * @param event\n   */\n  const handleSelectorFocusCapture = useCallback(\n    (event: FocusEvent) => {\n      const key = keyExtractor(event.target as HTMLElement, ITEM_SELECTOR);\n      if (key && (event.relatedTarget as HTMLElement)?.getAttribute('type') === 'checkbox') {\n        rootRef.current?.focus();\n        if (onCurrentKeyChange && key) {\n          onCurrentKeyChange({ value: key as K });\n        }\n      }\n    },\n    [onCurrentKeyChange]\n  );\n\n  const handleFocus = useCallback(\n    (event: FocusEvent) => {\n      !isKeyDefined(currentKey) && onCurrentKeyChange && handleInitialFocus();\n      !allowTabbableMode && handleSelectorFocusCapture(event);\n    },\n    [\n      allowTabbableMode,\n      currentKey,\n      handleInitialFocus,\n      handleSelectorFocusCapture,\n      onCurrentKeyChange\n    ]\n  );\n\n  const { selectionProps } = useSelection(\n    (element: HTMLElement) => {\n      if (element === rootRef.current) {\n        return currentKey === undefined ? null : currentKey;\n      }\n      return keyExtractor(element, ITEM_SELECTOR) as K;\n    },\n    selectedKeys,\n    selectionMode,\n    false,\n    'replace',\n    handleSelectionChange,\n    anchorKey.current,\n    currentKey,\n    (currentKey: K | undefined, isPrev: boolean) =>\n      getPrevNextKey(rootRef.current, currentKey, isPrev, ITEM_SELECTOR),\n    (key: K) => {\n      if (rootRef.current) {\n        const elem = findElementByKey(rootRef.current, key, ITEM_SELECTOR);\n        if (elem) {\n          const scroller = viewportConfig?.scroller();\n          scrollToVisible(elem, scroller != null ? scroller : rootRef.current);\n        }\n      }\n    },\n    handleSelectionRangeChange\n  );\n\n  if (data && pendingSelection.current !== undefined && onSelectionChange) {\n    const keys = handleSelectionRange(pendingSelection.current.detail, data);\n    if (Array.isArray(keys)) {\n      onSelectionChange({ value: { all: false, keys: new Set(keys) }, target: null });\n    }\n    const range = pendingSelection.current\n      ? pendingSelection.current.range\n      : { offset: data.offset, count: data.data.length };\n    data = adjustDataState(data, range);\n    pendingSelection.current = undefined;\n    onLoadRange(range);\n  }\n\n  const suggestions = useMemo(() => findSuggestions(data), [data]);\n\n  // TODO: check suggestions before Sparkle would cause a scrolling issue\n  const sparkleIndicator = <Sparkle sparkleHeight={sparkleHeight}></Sparkle>;\n\n  const itemActionProps = useItemAction(currentKey, data, onItemAction, ITEM_SELECTOR);\n\n  useEffect(() => {\n    // update sparkleHeight only when we have suggestions\n    // avoid unnecessary iterating through elements\n    if (suggestions) {\n      const placeholder = rootRef.current?.querySelector(\n        '.' + PLACEHOLDER_STYLE_CLASS\n      ) as HTMLElement;\n      let height = placeholder?.offsetHeight || 0;\n      const suggestionItems = rootRef.current?.querySelectorAll('[data-oj-suggestion]');\n      suggestionItems?.forEach((item) => (height += (item as HTMLElement).offsetHeight));\n      setSparkleHeight(height);\n    }\n  }, [suggestions]);\n\n  // returns an ListItemContext based on ItemContext (added metadata and selector)\n  const getItemContext = useCallback(\n    (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => {\n      const selectorRenderer =\n        selectionMode === 'multiple'\n          ? () => (\n              <Selector\n                onChange={handleSelectionChange}\n                rowKey={context.data.metadata.key}\n                selectedKeys={selectedKeys}></Selector>\n            )\n          : undefined;\n\n      return {\n        index: context.index,\n        data: context.data.data,\n        metadata: context.data.metadata,\n        selector: selectorRenderer\n      };\n    },\n    [selectionMode, selectedKeys, handleSelectionChange]\n  );\n\n  const childrenComponent = (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => {\n    const listItemContext = getItemContext(context);\n    const suggestion = suggestions?.get(listItemContext.metadata.key);\n    const isTabbable = allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key);\n    const isFocused = currentKey === listItemContext.metadata.key && !isTabbable;\n    const isSelected = containsKey(selectedKeys, listItemContext.metadata.key);\n    return (\n      <ListViewItem\n        key={listItemContext.metadata.key}\n        isFocused={isFocused}\n        isFocusRingVisible={showFocusRing && !pendingFocusRingChange}\n        isGridlineVisible={showGridline(listItemContext.index)}\n        isSelected={isSelected}\n        isTabbable={allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key)}\n        itemIndex={listItemContext.index}\n        itemKey={listItemContext.metadata.key}\n        role={role}\n        selectionMode={selectionMode}\n        currentItemVariant={currentItemVariant}\n        {...(suggestion && { suggestion })}\n        {...(listItemContext.index === 0 && { isTopGridlineVisible: showGridlineTop() })}>\n        {children(listItemContext)}\n      </ListViewItem>\n    );\n  };\n\n  viewportConfig = getViewportConfig(rootRef, viewportConfig);\n  const collectionComponent = isVirtualized ? (\n    <VirtualizedCollection\n      data={data}\n      itemSelector={ITEM_SELECTOR}\n      loadMoreIndicator={defaultLoadMoreIndicator}\n      onLoadRange={onLoadRange}\n      rangeExtractor={rangeExtractor}\n      suggestions={sparkleIndicator}\n      viewportConfig={viewportConfig}>\n      {childrenComponent}\n    </VirtualizedCollection>\n  ) : (\n    <LoadMoreCollection\n      data={data}\n      loadMoreIndicator={defaultLoadMoreIndicator}\n      onLoadRange={onLoadRange}\n      suggestions={sparkleIndicator}\n      viewportConfig={viewportConfig}>\n      {childrenComponent}\n    </LoadMoreCollection>\n  );\n\n  /**\n   * Need to track pointer down element to set currentItem when initial focus happens\n   */\n  const handlePointerDown = useCallback((event: PointerEvent) => {\n    const key = keyExtractor(event.target as HTMLElement, ITEM_SELECTOR);\n    if (isKeyDefined(key)) pendingCurrentKey.current = key as K;\n  }, []);\n\n  // if data is not specified, listview should show loading indicator\n  // todo: replace placeholder with actual SkeletonContainer component (Ash is working on)\n  return (\n    <div\n      {...mergeProps(\n        allowTabbableMode ? tabbableModeProps : {},\n        currentKeyProps,\n        focusRingProps,\n        selectionProps,\n        itemActionProps,\n        { onFocus: handleFocus, onPointerDown: handlePointerDown }\n      )}\n      role={role}\n      aria-rowcount={ariaRowCount}\n      aria-colcount={1}\n      ref={rootRef}\n      class={classes}\n      tabIndex={0}\n      aria-label={accessibleSummary}\n      aria-multiselectable={ariaMultiSelectable}>\n      {data == null ? loadingIndicator : collectionComponent}\n    </div>\n  );\n}\n\n/**\n * A helper function that finds the data with suggestions, and\n * returns the corresponding keys\n * @param dataState\n */\nconst findSuggestions = <K, D>(dataState?: DataState<K, D> | null) => {\n  const data = dataState?.data;\n  const count = getSuggestionsCount(data);\n  if (count === 0) {\n    return null;\n  }\n\n  const suggestionsData = data!.slice(0, count);\n  return suggestionsData.reduce((suggestions, value, index) => {\n    const key = value.metadata.key;\n\n    if (index === count - 1) {\n      suggestions.set(key, 'end');\n    } else {\n      suggestions.set(key, true);\n    }\n\n    return suggestions;\n  }, new Map<K, 'end' | true>());\n};\n\n/**\n * A helper function that finds the number of suggestions\n * @param data\n */\nconst getSuggestionsCount = <K, D>(data?: DataState<K, D>['data']) => {\n  if (!data) {\n    return 0;\n  }\n\n  const index = data.findIndex((value) => !value.metadata.suggestion);\n  return index === -1 ? 0 : index;\n};\n\n/**\n * A helper function to make sure specified elem is visible in the specified container\n */\nconst scrollToVisible = (elem: Element, scroller: Element) => {\n  if (elem && scroller) {\n    const scrollerBounds = scroller.getBoundingClientRect();\n    const elemBounds = elem.getBoundingClientRect();\n    if (elemBounds.bottom > scrollerBounds.bottom) {\n      scroller.scrollTop = scroller.scrollTop + (elemBounds.bottom - scrollerBounds.bottom);\n    } else if (elemBounds.top < scrollerBounds.top) {\n      scroller.scrollTop = scroller.scrollTop - (scrollerBounds.top - elemBounds.top);\n    }\n  }\n};\n\nconst getViewportConfig = (rootRef: RefObject<HTMLElement>, config?: ViewportConfig) => {\n  return (\n    config ?? {\n      scroller: () => {\n        return rootRef.current;\n      }\n    }\n  );\n};\n\nconst emptyKeys = { all: false, keys: new Set() };\n\nconst handleSelectionRange = <K, D>(\n  detail: SelectionRangeDetail<K>,\n  dataState: DataState<K, D>\n) => {\n  const keys = dataState.data.map((value: { data: D; metadata: Metadata<K> }) => {\n    return value.metadata.key;\n  });\n  const startIndex = keys.indexOf(detail.value.start);\n  const endIndex = keys.indexOf(detail.value.end);\n  const minIndex = Math.min(startIndex, endIndex);\n  const maxIndex = Math.max(startIndex, endIndex);\n  if (minIndex === -1) {\n    // return a range to fetch so we can find all the keys, maxIndex should not be -1\n    return { offset: 0, count: dataState.totalSize };\n  } else {\n    // range of keys are in the current viewport, return them\n    return keys.slice(minIndex, maxIndex + 1);\n  }\n};\n\n/**\n * A sparkle component for smart suggestion indicator in ListView\n * @param sparkleHeight the height of sparkle\n */\nexport function Sparkle({ sparkleHeight }: { sparkleHeight: number }) {\n  if (sparkleHeight <= 0) {\n    return null;\n  }\n\n  const height = sparkleHeight + 'px';\n  const sparkleClasses = classNames([sparkleStyles.base]);\n  const containerClasses = classNames([sparkleStyles.container]);\n\n  return (\n    <div key=\"sparkle\" class={containerClasses}>\n      <div class={sparkleClasses} style={{ height }}></div>\n    </div>\n  );\n}\n\nconst defaultLoadingIndicator = (\n  <SkeletonContainer minimumCount={25}>\n    {() => {\n      return (\n        <Flex height=\"12x\" align=\"center\">\n          <Skeleton height=\"4x\" />\n        </Flex>\n      );\n    }}\n  </SkeletonContainer>\n);\n\nconst defaultLoadMoreIndicator = (\n  <SkeletonContainer minimumCount={3}>\n    {() => {\n      return (\n        <Flex height=\"12x\" align=\"center\">\n          <Skeleton height=\"4x\" />\n        </Flex>\n      );\n    }}\n  </SkeletonContainer>\n);\n\n/**\n * Adjust the DataState as needed if it contains more than needed for the specified range\n */\nconst adjustDataState = <K, D>(dataState: DataState<K, D>, range: Range | null) => {\n  if (range) {\n    // prevent range offset from being larger than the data state\n    const safeRangeOffset = Math.min(range.offset, dataState.offset + dataState.totalSize);\n    const diff = safeRangeOffset - dataState.offset;\n    if (diff > 0) {\n      dataState = {\n        offset: safeRangeOffset,\n        data: dataState.data.slice(diff, diff + range.count),\n        totalSize: dataState.totalSize,\n        sizePrecision: dataState.sizePrecision\n      };\n    }\n  }\n  return dataState;\n};\n","/**\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\n/**\n * PRIVATE Components not intended for outside use,\n *\n * NOTE: Types for these need to be public and are defined in UNSAFE_ListView/List.types.ts\n */\nexport { List } from './List';\nexport { SkeletonContainer } from './SkeletonContainer';\n"],"names":["ITEM_STYLE_CLASS","ITEM_SELECTOR","styles","cellStyles","ListViewItem","children","itemKey","itemIndex","isFocused","isFocusRingVisible","isGridlineVisible","isSelected","isTopGridlineVisible","isTabbable","role","selectionMode","suggestion","currentItemVariant","rootRef","useRef","roles","useMemo","getListViewRoles","cellRoleAttributes","cell","handleKeyDown","event","key","base","focused","selectedSingle","suggestionEnd","checkboxContainer","isSelectable","isItemSelected","containerStyle","timerValue","SkeletonContainer","minimumCount","sparkleStyles","List","accessibleSummary","allowTabbableMode","currentKey","data","gridlines","loadingIndicator","defaultLoadingIndicator","onCurrentKeyChange","onLoadRange","onSelectionChange","onItemAction","rangeExtractor","selectedKeys","emptyKeys","viewportConfig","isVirtualized","listRoles","anchorKey","pendingSelection","pendingCurrentKey","showGridline","index","ariaMultiSelectable","undefined","ariaRowCount","sizePrecision","totalSize","listViewContains","elem","_a","current","contains","target","isKeyboardEvent","focus","findElementByKey","scrollToVisible","scroller","querySelector","handleSelectionChange","useCallback","detail","value","all","keys","size","Array","from","values","pop","handleSelectionRangeChange","isArray","range","offset","count","length","handleInitialFocus","firstKey","getFirstVisibleKey","isKeyDefined","handleSelectorFocusCapture","relatedTarget","getAttribute","_b","handleFocus","element","keyExtractor","isPrev","getPrevNextKey","handleSelectionRange","adjustDataState","suggestions","findSuggestions","itemActionProps","useItemAction","placeholder","PLACEHOLDER_STYLE_CLASS","height","offsetHeight","getItemContext","context","selectorRenderer","metadata","selector","childrenComponent","listItemContext","get","isCurrentTabbableKey","containsKey","getViewportConfig","collectionComponent","_jsx","VirtualizedCollection","Object","assign","itemSelector","loadMoreIndicator","defaultLoadMoreIndicator","sparkleIndicator","LoadMoreCollection","handlePointerDown","mergeProps","tabbableModeProps","currentKeyProps","focusRingProps","selectionProps","onFocus","onPointerDown","ref","class","classes","tabIndex","dataState","getSuggestionsCount","set","Map","findIndex","scrollerBounds","getBoundingClientRect","elemBounds","bottom","scrollTop","top","config","Set","startIndex","indexOf","start","endIndex","end","minIndex","Sparkle","sparkleHeight","safeRangeOffset","Math","min","diff","slice"],"mappings":"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"}

package/es/PRIVATE_Message.css

@@ -1,34 +1,34 @@
-._1pqzdb4{align-self:flex-start;display:flex;}
-._1bfnhff{margin-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x);margin-inline-end:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));margin-top:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));margin-bottom:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));}
-._1dislpv{margin-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);margin-inline-end:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);margin-top:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);margin-bottom:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);}
+.lo2yy9{background-color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-background-color);border-bottom:1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color);}.lo2yy9:focus-visible{outline-style:dotted;outline-width:1px;outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);outline-offset:1px;}
+.qj0keg{background-color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-background-color);border-radius:6px;box-shadow:var(--oj-c-PRIVATE-DO-NOT-USE-core-box-shadow-sm);width:fit-content;}.qj0keg:focus-visible{outline-style:dotted;outline-width:1px;outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);outline-offset:1px;}
+.h5cvmn{border:1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color);border-radius:var(--oj-c-PRIVATE-DO-NOT-USE-core-border-radius-lg);}
+._1r9qprh{align-items:center;box-sizing:border-box;display:flex;flex-wrap:wrap;padding-top:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);padding-bottom:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);}
+.lv5d4w{padding-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-gutter-start,var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x));padding-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-gutter-end,var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x));}
+._46v1b3{padding-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);padding-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);}
 
-.qy3t0k{background-color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-background-color);border-bottom:1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color);}.qy3t0k:focus-visible{outline-style:dotted;outline-width:1px;outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);outline-offset:1px;}
-._1f2uwhl{background-color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-background-color);border-radius:6px;box-shadow:var(--oj-c-PRIVATE-DO-NOT-USE-core-box-shadow-sm);width:fit-content;}._1f2uwhl:focus-visible{outline-style:dotted;outline-width:1px;outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);outline-offset:1px;}
-._10q4nvx{border:1px solid var(--oj-c-PRIVATE-DO-NOT-USE-core-divider-color);border-radius:var(--oj-c-PRIVATE-DO-NOT-USE-core-border-radius-lg);}
-.w084rn{align-items:center;box-sizing:border-box;display:flex;flex-wrap:wrap;padding-top:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);padding-bottom:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);}
-._1x2d7uj{padding-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-gutter-start,var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x));padding-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-gutter-end,var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x));}
-.c8bywp{padding-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);padding-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);}
+.kubhj1{overflow-wrap:anywhere;}
+._1wv6n6v{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-sm-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-primary);}
+._1jr63f5{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-sm-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-detail-text-color);}
 
-._149k7j3{overflow-wrap:anywhere;}
-._15gqlr3{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-sm-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-primary);}
-._8cb62b{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-sm-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-detail-text-color);}
+._1082zdl{align-self:flex-start;display:flex;}
+._1stj2rx{margin-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x);margin-inline-end:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));margin-top:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));margin-bottom:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x));}
+._10d3vur{margin-inline-start:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-4x);margin-inline-end:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);margin-top:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);margin-bottom:calc(-1 * var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-3x) / 2);}
 
-.t65d78{flex:1;overflow-wrap:anywhere;}
-._1i99nfe{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-size);font-weight:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-weight);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-color);}
-.m0ty6g{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-user-assistance-inline-font-size);font-weight:400;color:var(--oj-c-PRIVATE-DO-NOT-USE-user-assistance-inline-text-color);line-height:1.333;}
-._91dl5{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-summary-text-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-summary-text-color);}
+.w33tak{flex-shrink:0;font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-xs-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-secondary);}
 
-._1d9hv8b{margin-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);display:flex;align-self:flex-start;}
-._1roldm7{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-start-icon-color);font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-start-icon-size);height:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-line-height);}
-.owa2z3{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-inline-start-icon-color);font-size:1rem;}
-._1yb0u3l{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-color);font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);width:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}
-.ml53dk{height:100%;}
+._1nx9dd4{margin-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);display:flex;align-self:flex-start;}
+._1j2uhzi{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-start-icon-color);font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-start-icon-size);height:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-line-height);}
+.jxsba8{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-inline-start-icon-color);font-size:1rem;}
+.hrj7xn{color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-color);font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);width:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}
+._1tdpzpo{height:100%;}
 
-._4e9xiq{flex-shrink:0;font-size:var(--oj-c-PRIVATE-DO-NOT-USE-typography-body-xs-font-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-secondary);}
+._1ax0i5j{flex:1;overflow-wrap:anywhere;}
+.cfcein{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-size);font-weight:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-weight);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-text-color);}
+.ndktay{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-user-assistance-inline-font-size);font-weight:400;color:var(--oj-c-PRIVATE-DO-NOT-USE-user-assistance-inline-text-color);line-height:1.333;}
+.qd13ct{font-size:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-summary-text-size);color:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-summary-text-color);}
 
-._1ssxatk{margin-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);align-self:flex-start;display:flex;}
-._1dd95zq{height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);width:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}
+.hals9l{margin-inline-end:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);align-self:flex-start;display:flex;}
+._1mk3n8a{height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);width:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}
 
-.jwogc{box-sizing:border-box;display:flex;flex-wrap:wrap;flex-direction:row;}@media screen and (max-width:599.9px){.jwogc{flex-direction:column;}}
-.oretv0{line-height:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-line-height);}
-._13dem6l{line-height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}
+._17p86gu{box-sizing:border-box;display:flex;flex-wrap:wrap;flex-direction:row;}@media screen and (max-width:599.9px){._17p86gu{flex-direction:column;}}
+.bmnh26{line-height:var(--oj-c-PRIVATE-DO-NOT-USE-message-banner-summary-line-height);}
+._62e1pr{line-height:var(--oj-c-PRIVATE-DO-NOT-USE-message-toast-start-icon-size);}

package/es/PRIVATE_Message.js

@@ -1,7 +1,7 @@
-/* @oracle/oraclejet-preact: 14.0.0 */
+/* @oracle/oraclejet-preact: 14.0.2 */
 import { jsx, jsxs } from 'preact/jsx-runtime';
 import "./PRIVATE_Message.css";
-import { useCallback, useRef, useEffect, useState } from 'preact/hooks';
+import { useCallback, useRef, useEffect, useState, useLayoutEffect } from 'preact/hooks';
 import { Flex } from './UNSAFE_Flex.js';
 import { Timer } from './utils/PRIVATE_timer.js';
 import { classNames } from './utils/UNSAFE_classNames.js';
@@ -15,18 +15,18 @@ import { stringLiteralArray } from './utils/UNSAFE_arrayUtils.js';
 import { Logger } from './utils/UNSAFE_logger.js';
 import { playDefaultNotificationSound, playAudioFromURL } from './utils/UNSAFE_soundUtils.js';
 import { Transition, TransitionGroup } from './PRIVATE_TransitionGroup.js';
-import { _ as __rest } from './tslib.es6-8b94ba02.js';
+import { _ as __rest } from './tslib.es6-b7e8fd27.js';
 import { useAnimation } from './hooks/UNSAFE_useAnimation.js';
 import { useMessagesContext } from './hooks/UNSAFE_useMessagesContext.js';
 import './utils/UNSAFE_interpolations/dimensions.js';
 import './utils/UNSAFE_size.js';
-import './_curry1-d822c6e1.js';
+import './_curry1-97ad07b6.js';
 import './utils/UNSAFE_mergeInterpolations.js';
-import './_curry3-ddab9fe1.js';
-import './_curry2-50442f66.js';
-import './_has-c4aaaf43.js';
+import './_curry3-9fad4075.js';
+import './_curry2-6b260916.js';
+import './_has-c6212bd0.js';
 import './utils/UNSAFE_interpolations/boxalignment.js';
-import './keys-fed67954.js';
+import './keys-72a008ef.js';
 import './utils/UNSAFE_interpolations/flexbox.js';
 import './utils/UNSAFE_interpolations/flexitem.js';
 import './UNSAFE_BaseButton.js';
@@ -42,7 +42,7 @@ import './UNSAFE_Icon.js';
 import './hooks/UNSAFE_useTooltip.js';
 import './hooks/UNSAFE_useId.js';
 import './UNSAFE_Floating.js';
-import './index-14bba6f7.js';
+import './index-5584e60f.js';
 import './hooks/UNSAFE_useUser.js';
 import './UNSAFE_Environment.js';
 import './UNSAFE_Layer.js';
@@ -54,10 +54,10 @@ import './hooks/UNSAFE_useTouch.js';
 import './hooks/UNSAFE_useTheme.js';
 
 const messageCloseButtonStyles = {
-  base: "_1pqzdb4",
-  banner: "_1bfnhff",
+  base: "_1082zdl",
+  banner: "_1stj2rx",
   inline: undefined,
-  toast: "_1dislpv"
+  toast: "_10d3vur"
 };
 /**
  * A Component for rendering the message close button
@@ -90,8 +90,8 @@ function MessageCloseButton({
 }
 
 const messageStartIconStyles$1 = {
-  base: "_1ssxatk",
-  toast: "_1dd95zq"
+  base: "hals9l",
+  toast: "_1mk3n8a"
 };
 /**
  * Component for rendering custom icon/content for start icon in Message
@@ -210,10 +210,10 @@ function formatTimestamp(isoTime) {
 
 const messageDetailStyles = {
   // TODO: Reevaluate once the TEXT component is available (JET-46891)
-  base: "_149k7j3",
-  banner: "_15gqlr3",
+  base: "kubhj1",
+  banner: "_1wv6n6v",
   inline: undefined,
-  toast: "_8cb62b"
+  toast: "_1jr63f5"
 };
 /**
  * Default renderer for rendering the detail content.
@@ -262,10 +262,10 @@ function MessageDetail({
 }
 
 const messageHeaderStyles = {
-  base: "jwogc",
-  banner: "oretv0",
+  base: "_17p86gu",
+  banner: "bmnh26",
   inline: undefined,
-  toast: "_13dem6l"
+  toast: "_62e1pr"
 };
 /**
  * A component that styles the header for the message component
@@ -286,11 +286,11 @@ function MessageHeader({
   }));
 }
 
-const messageStartIconStyles = "_1d9hv8b";
+const messageStartIconStyles = "_1nx9dd4";
 const severityIconStyles = {
-  banner: "_1roldm7",
-  inline: "owa2z3",
-  toast: "_1yb0u3l"
+  banner: "_1j2uhzi",
+  inline: "jxsba8",
+  toast: "hrj7xn"
 };
 const severityIcons = {
   confirmation: SvgIcoSuccessS,
@@ -298,7 +298,7 @@ const severityIcons = {
   info: SvgIcoInformationS,
   warning: SvgIcoWarningS
 };
-const containerStyles = "ml53dk";
+const containerStyles = "_1tdpzpo";
 /**
  * StartIcon Component for rendering the severity based icon in Message
  */
@@ -343,10 +343,10 @@ function MessageStartIcon({
 
 const messageSummaryStyles = {
   // TODO: Reevaluate once the TEXT component is available (JET-46891)
-  base: "t65d78",
-  banner: "_1i99nfe",
-  inline: "m0ty6g",
-  toast: "_91dl5"
+  base: "_1ax0i5j",
+  banner: "cfcein",
+  inline: "ndktay",
+  toast: "qd13ct"
 };
 /**
  * Summary Component for rendering the summary text of the Message
@@ -371,7 +371,7 @@ function MessageSummary({
 }
 
 const messageTimestampStyles = {
-  banner: "_4e9xiq",
+  banner: "w33tak",
   inline: undefined,
   toast: undefined
 };
@@ -555,15 +555,15 @@ function isSeverityIconNeeded(severity) {
 
 const messageStyles = {
   base: {
-    banner: "qy3t0k",
-    toast: "_1f2uwhl"
+    banner: "lo2yy9",
+    toast: "qj0keg"
   },
-  section: "_10q4nvx",
+  section: "h5cvmn",
   // TODO: Replace with Flex and View components to handle padding and flex
   content: {
-    base: "w084rn",
-    banner: "_1x2d7uj",
-    toast: "c8bywp"
+    base: "_1r9qprh",
+    banner: "lv5d4w",
+    toast: "_46v1b3"
   }
 };
 /**
@@ -799,7 +799,11 @@ function MessageTransition(_a) {
         busyStateResolveRef.current = addBusyState === null || addBusyState === void 0 ? void 0 : addBusyState('messages animating');
     }, [animationStates, controller, addBusyState, onExiting]);
     // if animation is interrupted, the busyState may be left hanging. So clear that on unmount
-    useEffect(() => () => { var _a; return (_a = busyStateResolveRef.current) === null || _a === void 0 ? void 0 : _a.call(busyStateResolveRef); }, []);
+    // Note: When using a class-based component inside a functional component, the timings of
+    // componentDidMount and useEffect might differ. So, in order to guarantee the registration
+    // of the cleanup function, use useLayoutEffect instead of useEffect. This way we can make sure
+    // the cleanup registers at all times.
+    useLayoutEffect(() => () => { var _a; return (_a = busyStateResolveRef.current) === null || _a === void 0 ? void 0 : _a.call(busyStateResolveRef); }, []);
     return (jsx("div", Object.assign({ ref: nodeRef, style: initialAnimationStyles }, { children: jsx(Transition, Object.assign({}, transitionProps, { onEntering: onEnteringCallback, onExiting: onExitingCallback })) })));
 }