@oracle/oraclejet-preact 14.0.7 → 14.0.8

package/amd/List-26b59d92.js

@@ -1,670 +0,0 @@
-/* @oracle/oraclejet-preact: 14.0.7 */
-define(['exports', 'preact/jsx-runtime', 'preact/hooks', 'module', './utils/UNSAFE_classNames', './utils/UNSAFE_mergeProps', './utils/UNSAFE_keys', './LoadMoreCollection-b7513141', './PRIVATE_VirtualizedCollection', './hooks/UNSAFE_useTabbableMode', './UNSAFE_FocusTrap', './hooks/UNSAFE_useId', './classNames-027de734', './FocusTrap-420f2714', './hooks/PRIVATE_useSelection', './hooks/PRIVATE_useCurrentKey', './hooks/PRIVATE_useCollectionFocusRing', './hooks/PRIVATE_useTabbableModeSet', './hooks/PRIVATE_useItemAction', './UNSAFE_Skeleton', './UNSAFE_Flex', './utils/PRIVATE_collectionUtils', './UNSAFE_Selector', './VirtualizedCollection-63815bce', './Flex-7762d39c', './Skeleton-d0383726'], (function (exports, jsxRuntime, hooks, linaria, utils_UNSAFE_classNames, utils_UNSAFE_mergeProps, utils_UNSAFE_keys, LoadMoreCollection, PRIVATE_VirtualizedCollection, hooks_UNSAFE_useTabbableMode, UNSAFE_FocusTrap, hooks_UNSAFE_useId, classNames, FocusTrap, hooks_PRIVATE_useSelection, hooks_PRIVATE_useCurrentKey, hooks_PRIVATE_useCollectionFocusRing, hooks_PRIVATE_useTabbableModeSet, hooks_PRIVATE_useItemAction, UNSAFE_Skeleton, UNSAFE_Flex, utils_PRIVATE_collectionUtils, UNSAFE_Selector, VirtualizedCollection, Flex, Skeleton) { 'use strict';
-
-    /**
-     * @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
-     */
-    /**
-     * List Roles need to be kept in matching sets, this module encapsulates the sets
-     *
-     * @param ariaRole
-     * @returns matching, valid set of roles
-     */
-    const getListViewRoles = (ariaRole) => {
-        switch (ariaRole) {
-            case 'listbox':
-                return { list: 'listbox', item: 'presentation', cell: 'option' };
-            case 'treegrid':
-                return { list: 'treegrid', item: 'row', cell: 'gridcell' };
-            default:
-                return { list: 'grid', item: 'row', cell: 'gridcell' };
-        }
-    };
-
-    const ITEM_STYLE_CLASS = 'oj-listview-item';
-    const ITEM_SELECTOR = '.' + ITEM_STYLE_CLASS;
-    const styles$1 = {
-      base: "base-ltwo4u",
-      gridlines: "gridlines-jwmuqr",
-      gridlineTop: "gridlineTop-22q998",
-      selectable: "selectable-td69no",
-      selected: "selected-ao988z",
-      selectedSingle: "selectedSingle-v44htm",
-      suggestionEnd: "suggestionEnd-14342s3",
-      highlight: "highlight-1szj39m",
-      focused: "focused-17y8840"
-    };
-    const cellStyles = {
-      base: "base-s8zotk",
-      checkboxContainer: "checkboxContainer-dtaogy"
-    };
-    /**
-     * The internal component used to render a single item in ListView.
-     */
-
-    function ListViewItem({
-      children,
-      itemKey,
-      itemIndex,
-      isFocused,
-      isFocusRingVisible,
-      isGridlineVisible,
-      isSelected,
-      isTopGridlineVisible = false,
-      isTabbable = false,
-      role,
-      selectionMode,
-      suggestion,
-      currentItemVariant
-    }) {
-      const rootRef = hooks.useRef(null);
-      const roles = hooks.useMemo(() => getListViewRoles(role), [role]); // some roles come with related aria attributes which need to be set
-
-      const cellRoleAttributes = roles.cell === 'option' ? {
-        role: roles.cell,
-        'aria-posinset': itemIndex + 1,
-        'aria-setsize': -1
-      } : {
-        role: roles.cell
-      }; // don't bubble Arrow Up and Down events to parent when in isTabbable mode
-      // this bubbling causes the outer CollectionFocus ring to change index while in the isTabbable mode.
-
-      const handleKeyDown = event => {
-        if (isTabbable && (event.key === 'ArrowDown' || event.key === 'ArrowUp')) {
-          event.stopPropagation();
-        }
-      };
-
-      const classes = classNames.classNames([styles$1.base, ITEM_STYLE_CLASS, isFocused && isFocusRingVisible && styles$1.focused, isGridlineVisible && styles$1.gridlines, isTopGridlineVisible && styles$1.gridlineTop, isSelectable(selectionMode, isSelected) && !isSelected && styles$1.selectable, isSelected && styles$1.selected, isSelected && selectionMode === 'single' && styles$1.selectedSingle, suggestion === 'end' && !isGridlineVisible && !(isSelected && selectionMode === 'single') && styles$1.suggestionEnd, currentItemVariant === 'highlight' && isFocused && !isSelected && styles$1.highlight]);
-      const cellClasses = classNames.classNames([cellStyles.base, selectionMode === 'multiple' && cellStyles.checkboxContainer]); // todo: use translated text for selector
-      // note cannot put focus on gridcell div since JAWS will not read the aria-rowindex
-      // correctly, so unfortunately needed another div
-
-      return jsxRuntime.jsx("div", Object.assign({
-        "aria-rowindex": itemIndex + 1,
-        "data-oj-key": itemKey,
-        class: classes,
-        ref: rootRef,
-        role: roles.item
-      }, suggestion && {
-        'data-oj-suggestion': true
-      }, typeof itemKey === 'number' && {
-        'data-oj-key-type': 'number'
-      }, {
-        children: jsxRuntime.jsx("div", Object.assign({
-          id: hooks_UNSAFE_useId.useId(),
-          class: cellClasses,
-          "aria-posinset": itemIndex + 1,
-          "aria-setsize": -1,
-          onKeyDown: handleKeyDown,
-          "aria-colindex": 1,
-          "aria-selected": selectionMode !== 'none' ? isSelected : undefined
-        }, cellRoleAttributes, {
-          children: jsxRuntime.jsx(hooks_UNSAFE_useTabbableMode.TabbableModeContext.Provider, Object.assign({
-            value: {
-              isTabbable
-            }
-          }, {
-            children: jsxRuntime.jsx(FocusTrap.FocusTrap, Object.assign({
-              isDisabled: !isTabbable,
-              restoreFocusRef: false
-            }, {
-              children: children
-            }))
-          }))
-        }))
-      }));
-    }
-    /**
-     * Helper method to determine whether item is selectable
-     * @returns true if item is selectable (show hover effect), false otherwise
-     */
-
-    const isSelectable = (selectionMode, isItemSelected) => {
-      return selectionMode !== 'none' && (selectionMode === 'multiple' || !isItemSelected);
-    };
-
-    const containerStyle = {
-      base: "base-1kik2r5"
-    };
-    /**
-     * Allows to specify the time delay for rendering the component
-     **/
-
-    const timerValue = 50;
-    /**
-     * SkeletonContainer renders 'minimumCount' number of skeletons
-     * of the variant specified from its child element - Skeleton's prop after
-     * 'timerValue' ms delay
-     **/
-
-    function SkeletonContainer({
-      children,
-      minimumCount = 1
-    }) {
-      const [isVisible, setIsVisible] = hooks.useState(false);
-      hooks.useEffect(() => {
-        setTimeout(() => {
-          setIsVisible(true);
-        }, timerValue);
-      }, []);
-      const containerClasses = classNames.classNames([containerStyle.base]);
-      return isVisible && children ? jsxRuntime.jsx("div", Object.assign({
-        class: containerClasses,
-        role: "presentation"
-      }, {
-        children: [...Array(minimumCount)].map((_element, index) => children(index))
-      })) : null;
-    }
-
-    const styles = {
-      base: "base-cs6fpf"
-    };
-    const sparkleStyles = {
-      base: "base-z72qpl",
-      container: "container-975pp2"
-    };
-    /**
-     * Component that renders items as a flat list.
-     * In order to maximize performance, only items that are visible in the viewport are rendered.
-     */
-
-    function List({
-      accessibleSummary,
-      allowTabbableMode = true,
-      children,
-      currentKey,
-      data,
-      gridlines,
-      loadingIndicator = defaultLoadingIndicator,
-      onCurrentKeyChange,
-      onLoadRange,
-      onSelectionChange,
-      onItemAction,
-      rangeExtractor,
-      role = 'grid',
-      selectedKeys = emptyKeys,
-      selectionMode = 'none',
-      viewportConfig,
-      currentItemVariant = 'none',
-      isVirtualized = true
-    }) {
-      const rootRef = hooks.useRef(null);
-      const listRoles = hooks.useMemo(() => getListViewRoles(role), [role]); // tracking the anchor key which is used for shift+click selection
-
-      const anchorKey = hooks.useRef(); // tracking pending selection/current key that is not in current data
-
-      const pendingSelection = hooks.useRef();
-      const pendingCurrentKey = hooks.useRef(); // tracking sparkle height
-
-      const [sparkleHeight, setSparkleHeight] = hooks.useState(0);
-
-      const showGridline = index => {
-        // show bottom gridlines for each item, and for the last item if specified
-        return (gridlines === null || gridlines === void 0 ? void 0 : gridlines.item) === 'visible' && (index + 1 !== (data === null || data === void 0 ? void 0 : data.totalSize) || (gridlines === null || gridlines === void 0 ? void 0 : gridlines.bottom) === 'visible');
-      };
-
-      const showGridlineTop = () => {
-        // show the top gridline for the first item
-        return (gridlines === null || gridlines === void 0 ? void 0 : gridlines.item) === 'visible' && (gridlines === null || gridlines === void 0 ? void 0 : gridlines.top) === 'visible';
-      };
-
-      const ariaMultiSelectable = selectionMode === 'none' ? undefined : selectionMode === 'multiple';
-      const ariaRowCount = data === null ? undefined : data.sizePrecision === 'exact' ? data.totalSize : -1;
-      const classes = classNames.classNames([styles.base]);
-      const {
-        currentKeyProps
-      } = hooks_PRIVATE_useCurrentKey.useCurrentKey(element => utils_PRIVATE_collectionUtils.keyExtractor(element, ITEM_SELECTOR), utils_PRIVATE_collectionUtils.getPrevNextKey(rootRef.current, currentKey, true, ITEM_SELECTOR), utils_PRIVATE_collectionUtils.getPrevNextKey(rootRef.current, currentKey, false, ITEM_SELECTOR), currentKey, onCurrentKeyChange);
-
-      const listViewContains = elem => {
-        var _a;
-
-        return !!((_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.contains(elem));
-      };
-
-      const [showFocusRing, focusRingProps] = hooks_PRIVATE_useCollectionFocusRing.useCollectionFocusRing(listViewContains, ['ArrowUp', 'ArrowDown']);
-      let pendingFocusRingChange = false;
-      const [isCurrentTabbableKey, tabbableModeProps] = hooks_PRIVATE_useTabbableModeSet.useTabbableModeSet(listViewContains, element => utils_PRIVATE_collectionUtils.keyExtractor(element, ITEM_SELECTOR), currentKey, // handle clean-up on disabling of the mode
-      (target, isKeyboardEvent) => {
-        var _a;
-
-        if (target === null || listViewContains(target)) {
-          // delay focus reset for keyboard disable so focus is reset to ListView after the FocusTrap blur lifecycle completes.
-          // pointer initiated changes will fire the onBlur organically and delaying the focus, just generates an unwanted second blur
-          if (isKeyboardEvent) {
-            // do not show a focus ring during this timeOut
-            pendingFocusRingChange = true;
-            setTimeout(() => {
-              var _a;
-
-              (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }, 0);
-          } else {
-            (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-          }
-        }
-      }, // set currentKey when mode is enabled
-      key => {
-        onCurrentKeyChange && onCurrentKeyChange({
-          value: key
-        });
-      });
-      hooks.useEffect(() => {
-        if (currentKey != null && rootRef.current) {
-          const elem = utils_PRIVATE_collectionUtils.findElementByKey(rootRef.current, currentKey, ITEM_SELECTOR);
-
-          if (elem) {
-            const scroller = viewportConfig === null || viewportConfig === void 0 ? void 0 : viewportConfig.scroller(); // make sure item is visible
-
-            scrollToVisible(elem, scroller != null ? scroller : rootRef.current);
-            const cell = elem.querySelector(`[role=${listRoles.cell}]`); // update aria-activedescendant for screenreader
-
-            if (cell) {
-              rootRef.current.setAttribute('aria-activedescendant', cell.id);
-            }
-          }
-        } // listen to data because the current item would re-render when the virtualizer
-        // is fetching data or updating the data, i.e. the id of current item would be updated,
-        // so the currentKey itself couldn't guarantee the root has latest aria-activedescendant
-
-      }, [currentKey, data, listRoles.cell, viewportConfig]);
-      const handleSelectionChange = hooks.useCallback(detail => {
-        if (onSelectionChange) {
-          if (detail.value.all === false && detail.value.keys.size > 0) {
-            // the last key selected by a user gesture is the anchor key
-            anchorKey.current = Array.from(detail.value.keys.values()).pop();
-          }
-
-          onSelectionChange(detail);
-        }
-      }, [anchorKey, onSelectionChange]);
-      const handleSelectionRangeChange = hooks.useCallback(detail => {
-        if (data && onSelectionChange) {
-          const value = handleSelectionRange(detail, data);
-
-          if (Array.isArray(value)) {
-            onSelectionChange({
-              value: {
-                all: false,
-                keys: new Set(value)
-              },
-              target: null
-            });
-          } else {
-            pendingSelection.current = {
-              detail: detail,
-              range: {
-                offset: data.offset,
-                count: data.data.length
-              }
-            };
-            onLoadRange(value);
-          }
-        }
-      }, [data, onSelectionChange, onLoadRange]);
-      const handleInitialFocus = hooks.useCallback(() => {
-        if (rootRef.current && onCurrentKeyChange && (!allowTabbableMode || isCurrentTabbableKey(undefined))) {
-          const firstKey = pendingCurrentKey.current || utils_PRIVATE_collectionUtils.getFirstVisibleKey(rootRef.current, ITEM_SELECTOR);
-
-          if (utils_UNSAFE_keys.isKeyDefined(firstKey)) {
-            onCurrentKeyChange({
-              value: firstKey
-            });
-          }
-        }
-      }, [allowTabbableMode, onCurrentKeyChange, isCurrentTabbableKey]);
-      /**
-       * Used by allowTabbableMode = false, to prevent focus from getting onto checkboxes on click
-       * @param event
-       */
-
-      const handleSelectorFocusCapture = hooks.useCallback(event => {
-        var _a, _b;
-
-        const key = utils_PRIVATE_collectionUtils.keyExtractor(event.target, ITEM_SELECTOR);
-
-        if (key && ((_a = event.relatedTarget) === null || _a === void 0 ? void 0 : _a.getAttribute('type')) === 'checkbox') {
-          (_b = rootRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-
-          if (onCurrentKeyChange && key) {
-            onCurrentKeyChange({
-              value: key
-            });
-          }
-        }
-      }, [onCurrentKeyChange]);
-      const handleFocus = hooks.useCallback(event => {
-        !utils_UNSAFE_keys.isKeyDefined(currentKey) && onCurrentKeyChange && handleInitialFocus();
-        !allowTabbableMode && handleSelectorFocusCapture(event);
-      }, [allowTabbableMode, currentKey, handleInitialFocus, handleSelectorFocusCapture, onCurrentKeyChange]);
-      const {
-        selectionProps
-      } = hooks_PRIVATE_useSelection.useSelection(element => {
-        if (element === rootRef.current) {
-          return currentKey === undefined ? null : currentKey;
-        }
-
-        return utils_PRIVATE_collectionUtils.keyExtractor(element, ITEM_SELECTOR);
-      }, selectedKeys, selectionMode, false, 'replace', handleSelectionChange, anchorKey.current, currentKey, (currentKey, isPrev) => utils_PRIVATE_collectionUtils.getPrevNextKey(rootRef.current, currentKey, isPrev, ITEM_SELECTOR), key => {
-        if (rootRef.current) {
-          const elem = utils_PRIVATE_collectionUtils.findElementByKey(rootRef.current, key, ITEM_SELECTOR);
-
-          if (elem) {
-            const scroller = viewportConfig === null || viewportConfig === void 0 ? void 0 : viewportConfig.scroller();
-            scrollToVisible(elem, scroller != null ? scroller : rootRef.current);
-          }
-        }
-      }, handleSelectionRangeChange);
-
-      if (data && pendingSelection.current !== undefined && onSelectionChange) {
-        const keys = handleSelectionRange(pendingSelection.current.detail, data);
-
-        if (Array.isArray(keys)) {
-          onSelectionChange({
-            value: {
-              all: false,
-              keys: new Set(keys)
-            },
-            target: null
-          });
-        }
-
-        const range = pendingSelection.current ? pendingSelection.current.range : {
-          offset: data.offset,
-          count: data.data.length
-        };
-        data = adjustDataState(data, range);
-        pendingSelection.current = undefined;
-        onLoadRange(range);
-      }
-
-      const suggestions = hooks.useMemo(() => findSuggestions(data), [data]); // TODO: check suggestions before Sparkle would cause a scrolling issue
-
-      const sparkleIndicator = jsxRuntime.jsx(Sparkle, {
-        sparkleHeight: sparkleHeight
-      });
-
-      const itemActionProps = hooks_PRIVATE_useItemAction.useItemAction(currentKey, data, onItemAction, ITEM_SELECTOR);
-      hooks.useEffect(() => {
-        var _a, _b; // update sparkleHeight only when we have suggestions
-        // avoid unnecessary iterating through elements
-
-
-        if (suggestions) {
-          const placeholder = (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('.' + VirtualizedCollection.PLACEHOLDER_STYLE_CLASS);
-          let height = (placeholder === null || placeholder === void 0 ? void 0 : placeholder.offsetHeight) || 0;
-          const suggestionItems = (_b = rootRef.current) === null || _b === void 0 ? void 0 : _b.querySelectorAll('[data-oj-suggestion]');
-          suggestionItems === null || suggestionItems === void 0 ? void 0 : suggestionItems.forEach(item => height += item.offsetHeight);
-          setSparkleHeight(height);
-        }
-      }, [suggestions]); // returns an ListItemContext based on ItemContext (added metadata and selector)
-
-      const getItemContext = hooks.useCallback(context => {
-        const selectorRenderer = selectionMode === 'multiple' ? () => jsxRuntime.jsx(UNSAFE_Selector.Selector, {
-          onChange: handleSelectionChange,
-          rowKey: context.data.metadata.key,
-          selectedKeys: selectedKeys
-        }) : undefined;
-        return {
-          index: context.index,
-          data: context.data.data,
-          metadata: context.data.metadata,
-          selector: selectorRenderer
-        };
-      }, [selectionMode, selectedKeys, handleSelectionChange]);
-
-      const childrenComponent = context => {
-        const listItemContext = getItemContext(context);
-        const suggestion = suggestions === null || suggestions === void 0 ? void 0 : suggestions.get(listItemContext.metadata.key);
-        const isTabbable = allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key);
-        const isFocused = currentKey === listItemContext.metadata.key && !isTabbable;
-        const isSelected = utils_UNSAFE_keys.containsKey(selectedKeys, listItemContext.metadata.key);
-        return jsxRuntime.jsx(ListViewItem, Object.assign({
-          isFocused: isFocused,
-          isFocusRingVisible: showFocusRing && !pendingFocusRingChange,
-          isGridlineVisible: showGridline(listItemContext.index),
-          isSelected: isSelected,
-          isTabbable: allowTabbableMode && isCurrentTabbableKey(listItemContext.metadata.key),
-          itemIndex: listItemContext.index,
-          itemKey: listItemContext.metadata.key,
-          role: role,
-          selectionMode: selectionMode,
-          currentItemVariant: currentItemVariant
-        }, suggestion && {
-          suggestion
-        }, listItemContext.index === 0 && {
-          isTopGridlineVisible: showGridlineTop()
-        }, {
-          children: children(listItemContext)
-        }), listItemContext.metadata.key);
-      };
-
-      viewportConfig = getViewportConfig(rootRef, viewportConfig);
-      const collectionComponent = isVirtualized ? jsxRuntime.jsx(VirtualizedCollection.VirtualizedCollection, Object.assign({
-        data: data,
-        itemSelector: ITEM_SELECTOR,
-        loadMoreIndicator: defaultLoadMoreIndicator,
-        onLoadRange: onLoadRange,
-        rangeExtractor: rangeExtractor,
-        suggestions: sparkleIndicator,
-        viewportConfig: viewportConfig
-      }, {
-        children: childrenComponent
-      })) : jsxRuntime.jsx(LoadMoreCollection.LoadMoreCollection, Object.assign({
-        data: data,
-        loadMoreIndicator: defaultLoadMoreIndicator,
-        onLoadRange: onLoadRange,
-        suggestions: sparkleIndicator,
-        viewportConfig: viewportConfig
-      }, {
-        children: childrenComponent
-      }));
-      /**
-       * Need to track pointer down element to set currentItem when initial focus happens
-       */
-
-      const handlePointerDown = hooks.useCallback(event => {
-        const key = utils_PRIVATE_collectionUtils.keyExtractor(event.target, ITEM_SELECTOR);
-        if (utils_UNSAFE_keys.isKeyDefined(key)) pendingCurrentKey.current = key;
-      }, []); // if data is not specified, listview should show loading indicator
-      // todo: replace placeholder with actual SkeletonContainer component (Ash is working on)
-
-      return jsxRuntime.jsx("div", Object.assign({}, utils_UNSAFE_mergeProps.mergeProps(allowTabbableMode ? tabbableModeProps : {}, currentKeyProps, focusRingProps, selectionProps, itemActionProps, {
-        onFocus: handleFocus,
-        onPointerDown: handlePointerDown
-      }), {
-        role: role,
-        "aria-rowcount": ariaRowCount,
-        "aria-colcount": 1,
-        ref: rootRef,
-        class: classes,
-        tabIndex: 0,
-        "aria-label": accessibleSummary,
-        "aria-multiselectable": ariaMultiSelectable
-      }, {
-        children: data == null ? loadingIndicator : collectionComponent
-      }));
-    }
-    /**
-     * A helper function that finds the data with suggestions, and
-     * returns the corresponding keys
-     * @param dataState
-     */
-
-    const findSuggestions = dataState => {
-      const data = dataState === null || dataState === void 0 ? void 0 : dataState.data;
-      const count = getSuggestionsCount(data);
-
-      if (count === 0) {
-        return null;
-      }
-
-      const suggestionsData = data.slice(0, count);
-      return suggestionsData.reduce((suggestions, value, index) => {
-        const key = value.metadata.key;
-
-        if (index === count - 1) {
-          suggestions.set(key, 'end');
-        } else {
-          suggestions.set(key, true);
-        }
-
-        return suggestions;
-      }, new Map());
-    };
-    /**
-     * A helper function that finds the number of suggestions
-     * @param data
-     */
-
-
-    const getSuggestionsCount = data => {
-      if (!data) {
-        return 0;
-      }
-
-      const index = data.findIndex(value => !value.metadata.suggestion);
-      return index === -1 ? 0 : index;
-    };
-    /**
-     * A helper function to make sure specified elem is visible in the specified container
-     */
-
-
-    const scrollToVisible = (elem, scroller) => {
-      if (elem && scroller) {
-        const scrollerBounds = scroller.getBoundingClientRect();
-        const elemBounds = elem.getBoundingClientRect();
-
-        if (elemBounds.bottom > scrollerBounds.bottom) {
-          scroller.scrollTop = scroller.scrollTop + (elemBounds.bottom - scrollerBounds.bottom);
-        } else if (elemBounds.top < scrollerBounds.top) {
-          scroller.scrollTop = scroller.scrollTop - (scrollerBounds.top - elemBounds.top);
-        }
-      }
-    };
-
-    const getViewportConfig = (rootRef, config) => {
-      return config !== null && config !== void 0 ? config : {
-        scroller: () => {
-          return rootRef.current;
-        }
-      };
-    };
-
-    const emptyKeys = {
-      all: false,
-      keys: new Set()
-    };
-
-    const handleSelectionRange = (detail, dataState) => {
-      const keys = dataState.data.map(value => {
-        return value.metadata.key;
-      });
-      const startIndex = keys.indexOf(detail.value.start);
-      const endIndex = keys.indexOf(detail.value.end);
-      const minIndex = Math.min(startIndex, endIndex);
-      const maxIndex = Math.max(startIndex, endIndex);
-
-      if (minIndex === -1) {
-        // return a range to fetch so we can find all the keys, maxIndex should not be -1
-        return {
-          offset: 0,
-          count: dataState.totalSize
-        };
-      } else {
-        // range of keys are in the current viewport, return them
-        return keys.slice(minIndex, maxIndex + 1);
-      }
-    };
-    /**
-     * A sparkle component for smart suggestion indicator in ListView
-     * @param sparkleHeight the height of sparkle
-     */
-
-
-    function Sparkle({
-      sparkleHeight
-    }) {
-      if (sparkleHeight <= 0) {
-        return null;
-      }
-
-      const height = sparkleHeight + 'px';
-      const sparkleClasses = classNames.classNames([sparkleStyles.base]);
-      const containerClasses = classNames.classNames([sparkleStyles.container]);
-      return jsxRuntime.jsx("div", Object.assign({
-        class: containerClasses
-      }, {
-        children: jsxRuntime.jsx("div", {
-          class: sparkleClasses,
-          style: {
-            height
-          }
-        })
-      }), "sparkle");
-    }
-
-    const defaultLoadingIndicator = jsxRuntime.jsx(SkeletonContainer, Object.assign({
-      minimumCount: 25
-    }, {
-      children: () => {
-        return jsxRuntime.jsx(Flex.Flex, Object.assign({
-          height: "12x",
-          align: "center"
-        }, {
-          children: jsxRuntime.jsx(Skeleton.Skeleton, {
-            height: "4x"
-          })
-        }));
-      }
-    }));
-
-    const defaultLoadMoreIndicator = jsxRuntime.jsx(SkeletonContainer, Object.assign({
-      minimumCount: 3
-    }, {
-      children: () => {
-        return jsxRuntime.jsx(Flex.Flex, Object.assign({
-          height: "12x",
-          align: "center"
-        }, {
-          children: jsxRuntime.jsx(Skeleton.Skeleton, {
-            height: "4x"
-          })
-        }));
-      }
-    }));
-    /**
-     * Adjust the DataState as needed if it contains more than needed for the specified range
-     */
-
-
-    const adjustDataState = (dataState, range) => {
-      if (range) {
-        // prevent range offset from being larger than the data state
-        const safeRangeOffset = Math.min(range.offset, dataState.offset + dataState.totalSize);
-        const diff = safeRangeOffset - dataState.offset;
-
-        if (diff > 0) {
-          dataState = {
-            offset: safeRangeOffset,
-            data: dataState.data.slice(diff, diff + range.count),
-            totalSize: dataState.totalSize,
-            sizePrecision: dataState.sizePrecision
-          };
-        }
-      }
-
-      return dataState;
-    };
-
-    exports.List = List;
-    exports.SkeletonContainer = SkeletonContainer;
-
-}));
-/*  */
-//# sourceMappingURL=List-26b59d92.js.map