@oracle/oraclejet-preact 18.1.5 → 18.1.6

package/cjs/UNSAFE_TagCloud.js

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var TagCloud = require('./TagCloud-0aee2c72.js');
+var TagCloud = require('./TagCloud-2715c0e8.js');
 require('preact/jsx-runtime');
 require('./TrackResizeContainer-96619aba.js');
 require('preact/hooks');
@@ -74,10 +74,10 @@ require('./hooks/PRIVATE_useDatatip/themes/useDatatip.css.js');
 require('./useId-6c0eeb27.js');
 require('./useTranslationBundle-40fa4c27.js');
 require('./useTextDimensions-b94e8899.js');
-require('./useSelection-810ecdc6.js');
-require('./BaseButton-97ec7696.js');
+require('./useSelection-8f68a23a.js');
+require('./BaseButton-590432e4.js');
 require('./usePress-886180e4.js');
-require('./usePressClick-421494df.js');
+require('./usePressClick-7a34624a.js');
 require('./useHover-c099039f.js');
 require('./useToggle-3ebba7d8.js');
 require('./useActive-6770f917.js');

package/cjs/UNSAFE_TextArea.js

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var TextArea = require('./TextArea-a11875f3.js');
+var TextArea = require('./TextArea-d8516f11.js');
 var MaxLengthCounter = require('./MaxLengthCounter-9ab3f74b.js');
 require('preact/jsx-runtime');
 require('preact/compat');
@@ -14,7 +14,7 @@ require('preact/hooks');
 require('./FormFieldContext-8418dc68.js');
 require('./useFocusableTextField-2c36840d.js');
 require('./useFocusWithin-eb7f956a.js');
-require('./Label-2e05c87f.js');
+require('./Label-c51bd5de.js');
 require('./useFormFieldContext-20f419ef.js');
 require('./classNames-c14c6ef3.js');
 require('./useComponentTheme-082fc8e4.js');
@@ -86,10 +86,10 @@ require('./UNSAFE_Floating/themes/redwood/FloatingVariants.css.js');
 require('./vanilla-extract-dynamic.esm-d5dffce7.js');
 require('./UNSAFE_Floating/themes/FloatingContract.css.js');
 
-require('./IconButton-e7a68b4b.js');
-require('./BaseButton-97ec7696.js');
+require('./IconButton-fad4e4b2.js');
+require('./BaseButton-590432e4.js');
 require('./usePress-886180e4.js');
-require('./usePressClick-421494df.js');
+require('./usePressClick-7a34624a.js');
 require('./useHover-c099039f.js');
 require('./useToggle-3ebba7d8.js');
 require('./useActive-6770f917.js');
@@ -236,8 +236,8 @@ require('./LiveRegion-e68b3027.js');
 require('./useTextField-3ce8f0d0.js');
 require('./useMessageSeverity-cfc4ae9d.js');
 require('./useFormFieldContextProps-8c04ed0f.js');
-require('./InlineUserAssistance-5d6bac7a.js');
-require('./ComponentMessageContainer-1cea67f6.js');
+require('./InlineUserAssistance-6c6d3250.js');
+require('./ComponentMessageContainer-f8dc57aa.js');
 require('./MessagesManager-62fc84b8.js');
 require('./SuccessS-035e292e.js');
 require('./ErrorS-e9799ab5.js');
@@ -255,7 +255,7 @@ require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceTheme.js');
 require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceBaseTheme.css.js');
 require('./InlineHelp-7c4897d2.js');
 require('./InlineHelpSource-d60cde6f.js');
-require('./CompactUserAssistance-b3c3929e.js');
+require('./CompactUserAssistance-54247e7e.js');
 require('./Separator-85962472.js');
 require('./useLengthFilter-d4cb6f47.js');
 require('./lengthFilter-88f15099.js');

package/cjs/UNSAFE_TextAreaAutosize.js

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var TextAreaAutosize = require('./TextAreaAutosize-5a8e8335.js');
+var TextAreaAutosize = require('./TextAreaAutosize-1797d5b7.js');
 require('preact/jsx-runtime');
 require('preact/compat');
 require('./FormContext-9452bd30.js');
@@ -13,7 +13,7 @@ require('preact/hooks');
 require('./FormFieldContext-8418dc68.js');
 require('./useFocusableTextField-2c36840d.js');
 require('./useFocusWithin-eb7f956a.js');
-require('./Label-2e05c87f.js');
+require('./Label-c51bd5de.js');
 require('./useFormFieldContext-20f419ef.js');
 require('./classNames-c14c6ef3.js');
 require('./useComponentTheme-082fc8e4.js');
@@ -85,10 +85,10 @@ require('./UNSAFE_Floating/themes/redwood/FloatingVariants.css.js');
 require('./vanilla-extract-dynamic.esm-d5dffce7.js');
 require('./UNSAFE_Floating/themes/FloatingContract.css.js');
 
-require('./IconButton-e7a68b4b.js');
-require('./BaseButton-97ec7696.js');
+require('./IconButton-fad4e4b2.js');
+require('./BaseButton-590432e4.js');
 require('./usePress-886180e4.js');
-require('./usePressClick-421494df.js');
+require('./usePressClick-7a34624a.js');
 require('./useHover-c099039f.js');
 require('./useToggle-3ebba7d8.js');
 require('./useActive-6770f917.js');
@@ -235,8 +235,8 @@ require('./LiveRegion-e68b3027.js');
 require('./useTextField-3ce8f0d0.js');
 require('./useMessageSeverity-cfc4ae9d.js');
 require('./useFormFieldContextProps-8c04ed0f.js');
-require('./InlineUserAssistance-5d6bac7a.js');
-require('./ComponentMessageContainer-1cea67f6.js');
+require('./InlineUserAssistance-6c6d3250.js');
+require('./ComponentMessageContainer-f8dc57aa.js');
 require('./MessagesManager-62fc84b8.js');
 require('./SuccessS-035e292e.js');
 require('./ErrorS-e9799ab5.js');
@@ -254,7 +254,7 @@ require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceTheme.js');
 require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceBaseTheme.css.js');
 require('./InlineHelp-7c4897d2.js');
 require('./InlineHelpSource-d60cde6f.js');
-require('./CompactUserAssistance-b3c3929e.js');
+require('./CompactUserAssistance-54247e7e.js');
 require('./Separator-85962472.js');
 require('./useLengthFilter-d4cb6f47.js');
 require('./lengthFilter-88f15099.js');

package/cjs/UNSAFE_ToggleButton.js

@@ -3,13 +3,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var ToggleButton = require('./ToggleButton-8ac0ff29.js');
+var ToggleButton = require('./ToggleButton-c614bbec.js');
 require('preact/jsx-runtime');
 require('preact/compat');
-require('./BaseButton-97ec7696.js');
+require('./BaseButton-590432e4.js');
 require('./usePress-886180e4.js');
 require('preact/hooks');
-require('./usePressClick-421494df.js');
+require('./usePressClick-7a34624a.js');
 require('./useHover-c099039f.js');
 require('./useToggle-3ebba7d8.js');
 require('./useActive-6770f917.js');

package/cjs/UNSAFE_Toolbar/tests/Toolbar.spec.js

@@ -6,11 +6,11 @@ var preact = require('@testing-library/preact');
 var chai = require('chai');
 var Toolbar = require('../../Toolbar-412dd092.js');
 var ToolbarSeparator = require('../../ToolbarSeparator-f64e1a37.js');
-var BaseButton = require('../../BaseButton-97ec7696.js');
+var BaseButton = require('../../BaseButton-590432e4.js');
 var userEvent = require('@testing-library/user-event');
-var Button = require('../../Button-371573d5.js');
-var MenuButton = require('../../MenuButton-b811e5e4.js');
-var SplitMenuButton = require('../../SplitMenuButton-e7fd9b79.js');
+var Button = require('../../Button-2427b7df.js');
+var MenuButton = require('../../MenuButton-e6eb6e3e.js');
+var SplitMenuButton = require('../../SplitMenuButton-9c1b081c.js');
 require('../../useRovingTabIndexContainer-c7777956.js');
 require('preact/hooks');
 require('../../useUser-3175822e.js');
@@ -43,7 +43,7 @@ require('../../classNames-c14c6ef3.js');
 require('../../UNSAFE_Separator/themes/SeparatorStyles.css.js');
 
 require('../../usePress-886180e4.js');
-require('../../usePressClick-421494df.js');
+require('../../usePressClick-7a34624a.js');
 require('../../useHover-c099039f.js');
 require('../../useToggle-3ebba7d8.js');
 require('../../useActive-6770f917.js');

package/cjs/UNSAFE_UserAssistance.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var InlineHelp = require('./InlineHelp-7c4897d2.js');
 var InlineHelpSource = require('./InlineHelpSource-d60cde6f.js');
-var InlineUserAssistance = require('./InlineUserAssistance-5d6bac7a.js');
-var CompactUserAssistance = require('./CompactUserAssistance-b3c3929e.js');
+var InlineUserAssistance = require('./InlineUserAssistance-6c6d3250.js');
+var CompactUserAssistance = require('./CompactUserAssistance-54247e7e.js');
 var CompactLabelAssistance = require('./CompactLabelAssistance-d0290426.js');
 var IconUserAssistance = require('./IconUserAssistance-11dc4c4f.js');
 require('preact/jsx-runtime');
@@ -89,10 +89,10 @@ require('./UNSAFE_Floating/themes/redwood/FloatingVariants.css.js');
 require('./vanilla-extract-dynamic.esm-d5dffce7.js');
 require('./UNSAFE_Floating/themes/FloatingContract.css.js');
 
-require('./IconButton-e7a68b4b.js');
-require('./BaseButton-97ec7696.js');
+require('./IconButton-fad4e4b2.js');
+require('./BaseButton-590432e4.js');
 require('./usePress-886180e4.js');
-require('./usePressClick-421494df.js');
+require('./usePressClick-7a34624a.js');
 require('./useHover-c099039f.js');
 require('./useToggle-3ebba7d8.js');
 require('./useActive-6770f917.js');
@@ -134,7 +134,7 @@ require('./MessagesContext-4e939750.js');
 
 
 require('./UNSAFE_ComponentMessage/themes/redwood/ComponentMessageVariants.css.js');
-require('./ComponentMessageContainer-1cea67f6.js');
+require('./ComponentMessageContainer-f8dc57aa.js');
 require('./MessagesManager-62fc84b8.js');
 require('./SuccessS-035e292e.js');
 require('./Icon-6baa1a6f.js');

package/cjs/UNSAFE_VirtualizedListView.js

@@ -3,18 +3,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var VirtualizedListView = require('./VirtualizedListView-0a4f07ca.js');
+var VirtualizedListView = require('./VirtualizedListView-ad3219ba.js');
 require('preact/jsx-runtime');
-require('./List-24abb3df.js');
+require('./List-bad74e43.js');
 require('preact/hooks');
 require('./classNames-c14c6ef3.js');
 require('./mergeProps-e3da7237.js');
 require('./keys-25710458.js');
-require('./LoadMoreCollection-69bc038c.js');
+require('./LoadMoreCollection-73112ff0.js');
 require('preact');
-require('./useViewportIntersect-ca1f958b.js');
 require('./Collection-9880039f.js');
-require('./VirtualizedCollection-9e8c48b9.js');
+require('./useViewportIntersect-ca1f958b.js');
+require('./VirtualizedCollection-00aedb8b.js');
 require('preact/compat');
 require('./TabbableModeContext-e99d527e.js');
 require('./useId-6c0eeb27.js');

package/cjs/VirtualizedCollection-00aedb8b.js

@@ -0,0 +1,180 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var hooks = require('preact/hooks');
+var Collection = require('./Collection-9880039f.js');
+var useViewportIntersect = require('./useViewportIntersect-ca1f958b.js');
+
+const PLACEHOLDER_STYLE_CLASS = 'oj-collection-placeholder';
+const DEFAULT_PLACEHOLDER_SIZE = 48; // min-height defined in Redwood spec for item
+const TOP_PLACEHOLDER_KEY = '_topPlaceholder';
+const BOTTOM_PLACEHOLDER_KEY = '_bottomPlaceholder';
+/**
+ * A component that renders placeholder which is used internally by VirtualizeViewportCollection
+ */
+const Placeholder = ({ context, placeholderHeight }) => {
+    const { fromIndex, toIndex, which, estimateItemSize } = context;
+    let totalHeight = 0;
+    if (placeholderHeight) {
+        totalHeight = placeholderHeight(context);
+    }
+    else {
+        const placeholderUnitHeight = estimateItemSize === 0 ? DEFAULT_PLACEHOLDER_SIZE : estimateItemSize;
+        totalHeight = Math.max(0, toIndex - fromIndex) * placeholderUnitHeight;
+    }
+    const key = which === 'topPlaceholder' ? TOP_PLACEHOLDER_KEY : BOTTOM_PLACEHOLDER_KEY;
+    const style = { height: totalHeight + 'px' };
+    if (totalHeight === 0) {
+        style.display = 'none';
+    }
+    return jsxRuntime.jsx("div", { className: PLACEHOLDER_STYLE_CLASS, style: style }, key);
+};
+
+/**
+ * A function that returns the default range extractor
+ * @param fetchSize
+ */
+function getVirtualizedRangeExtractor(fetchSize) {
+    return function ({ itemSize, viewportHeight, scrollOffset, overscan = 0 }) {
+        // if any of these is missing then return default initial range
+        if (itemSize === undefined ||
+            itemSize === 0 ||
+            viewportHeight === undefined ||
+            scrollOffset === undefined) {
+            return { offset: 0, count: fetchSize };
+        }
+        const offset = Math.ceil(scrollOffset / itemSize);
+        const count = Math.ceil(viewportHeight / itemSize);
+        return {
+            offset: Math.max(0, offset - overscan),
+            count: count + overscan * (offset > 0 ? 2 : 1)
+        };
+    };
+}
+/**
+ * Helper function to find the top and bottom of an element relative to the viewport
+ * @param elem
+ */
+const getElementTopBottom = (elem) => {
+    let top;
+    let bottom;
+    if (elem === document.documentElement) {
+        top = 0;
+        bottom = document.documentElement.clientHeight;
+    }
+    else {
+        const scrollerBounds = elem.getBoundingClientRect();
+        top = scrollerBounds.top;
+        bottom = scrollerBounds.bottom;
+    }
+    return { top, bottom };
+};
+const isDataStateValid = (dataState) => {
+    return dataState && dataState.data && dataState.offset >= 0 && dataState.totalSize >= 0;
+};
+const DEFAULT_MARGIN = 1;
+/**
+ * Returns the range for the current viewport
+ */
+const getViewportRange = (scroller, root, overscan, rangeExtractor, estimateItemSize) => {
+    let scrollOffset;
+    let viewportHeight;
+    if (scroller && root) {
+        const rootRect = root.getBoundingClientRect();
+        const viewportRect = getElementTopBottom(scroller);
+        if (rootRect && viewportRect) {
+            scrollOffset = viewportRect.top - rootRect.top - DEFAULT_MARGIN;
+            viewportHeight = viewportRect.bottom - viewportRect.top + DEFAULT_MARGIN;
+        }
+    }
+    if (scrollOffset !== undefined && viewportHeight !== undefined) {
+        // figure out what the new range should be
+        const range = rangeExtractor({
+            scrollOffset,
+            viewportHeight,
+            overscan: overscan,
+            itemSize: estimateItemSize
+        });
+        return range;
+    }
+    return null;
+};
+const DEFAULT_OVERSCAN = 1;
+const DEFAULT_END_INDEX = 25; // match default fetch size
+const LOADMORE_STYLE_CLASS = 'oj-collection-loadmore';
+const LOAD_MORE_AND_PLACEHOLDER_SELECTOR = `.${LOADMORE_STYLE_CLASS}, .${PLACEHOLDER_STYLE_CLASS}`;
+const DEFAULT_RANGE_EXTRACTOR = getVirtualizedRangeExtractor(DEFAULT_END_INDEX);
+/**
+ * Component that only render items in the specified viewport.
+ * @param props
+ */
+function VirtualizedCollection({ data, children, viewportConfig, itemSelector, placeholderHeight, rangeExtractor = DEFAULT_RANGE_EXTRACTOR, overscan = DEFAULT_OVERSCAN, onLoadRange, loadMoreIndicator, suggestions }) {
+    const rootRef = hooks.useRef(null);
+    const estimateItemSizeRef = hooks.useRef(0);
+    // detect if viewport has changed and it needs to re-render based on a new range
+    useViewportIntersect.useViewportIntersect(viewportConfig, DEFAULT_MARGIN, 0, LOAD_MORE_AND_PLACEHOLDER_SELECTOR, () => {
+        const range = getViewportRange(viewportConfig.scroller(), rootRef.current, overscan, rangeExtractor, estimateItemSizeRef.current ?? 0);
+        if (range) {
+            onLoadRange(range);
+        }
+    });
+    // calculate average item height.  For now, we'll just do this once, but we can
+    // do a rolling average where we'll adjust on every render.
+    hooks.useEffect(() => {
+        if (estimateItemSizeRef.current === 0) {
+            let totalHeight = 0;
+            const nodes = rootRef.current.querySelectorAll(itemSelector);
+            if (nodes.length > 0) {
+                nodes.forEach((item) => {
+                    totalHeight += item.offsetHeight;
+                });
+                estimateItemSizeRef.current = totalHeight / nodes.length;
+            }
+        }
+    });
+    // override itemRenderer to adjust the index
+    const _getItemRenderer = (startIndex) => {
+        // returns a new render function
+        return (context) => {
+            const itemContext = {
+                index: startIndex + context.index,
+                data: context.data
+            };
+            return children(itemContext);
+        };
+    };
+    // if DataState is invalid (including not specified), just render blank
+    if (!data || !isDataStateValid(data)) {
+        return jsxRuntime.jsx("div", { ref: rootRef });
+    }
+    const rangeData = data.data;
+    const offset = data.offset;
+    const endIndex = offset + rangeData.length;
+    const itemCount = data.totalSize;
+    const topPlaceholderContext = offset >= 0
+        ? {
+            fromIndex: 0,
+            toIndex: offset,
+            which: 'topPlaceholder',
+            estimateItemSize: estimateItemSizeRef.current ?? 0
+        }
+        : undefined;
+    const bottomPlaceholderContext = endIndex && endIndex <= itemCount
+        ? {
+            fromIndex: endIndex,
+            toIndex: itemCount,
+            which: 'bottomPlaceholder',
+            estimateItemSize: estimateItemSizeRef.current ?? 0
+        }
+        : undefined;
+    const renderLoadMore = loadMoreIndicator && data.sizePrecision === 'atLeast' && endIndex <= itemCount;
+    // might need to support elementType prop in the future to allow customization of what
+    // type of element to render for the root
+    return (jsxRuntime.jsxs("div", { ref: rootRef, style: "will-change: contents", children: [suggestions, topPlaceholderContext && (jsxRuntime.jsx(Placeholder, { context: topPlaceholderContext, placeholderHeight: placeholderHeight })), jsxRuntime.jsx(Collection.Collection, { items: rangeData, children: _getItemRenderer(offset) }), bottomPlaceholderContext && (jsxRuntime.jsx(Placeholder, { context: bottomPlaceholderContext, placeholderHeight: placeholderHeight })), renderLoadMore && loadMoreIndicator] }));
+}
+
+exports.PLACEHOLDER_STYLE_CLASS = PLACEHOLDER_STYLE_CLASS;
+exports.VirtualizedCollection = VirtualizedCollection;
+exports.getVirtualizedRangeExtractor = getVirtualizedRangeExtractor;
+//# sourceMappingURL=VirtualizedCollection-00aedb8b.js.map

package/cjs/VirtualizedCollection-00aedb8b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualizedCollection-00aedb8b.js","sources":["../../src/PRIVATE_VirtualizedCollection/Placeholder.tsx","../../src/PRIVATE_VirtualizedCollection/VirtualizedCollection.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { JSX } from 'preact';\n\nexport const placeholderTypes = ['topPlaceholder', 'bottomPlaceholder'] as const;\n/**\n * Type of placeholder (top which is before the data content and bottom which is after the data content)\n */\nexport type PlaceholderType = (typeof placeholderTypes)[number];\n\n/**\n * Context object which is pass to the placeholderHeight function callback\n */\nexport type PlaceholderContext = {\n  fromIndex: number;\n  toIndex: number;\n  estimateItemSize: number;\n  which: PlaceholderType;\n};\n\nexport const PLACEHOLDER_STYLE_CLASS = 'oj-collection-placeholder';\n\nconst DEFAULT_PLACEHOLDER_SIZE = 48; // min-height defined in Redwood spec for item\nconst TOP_PLACEHOLDER_KEY = '_topPlaceholder';\nconst BOTTOM_PLACEHOLDER_KEY = '_bottomPlaceholder';\n\ntype Props = {\n  context: PlaceholderContext;\n  placeholderHeight?: (context: PlaceholderContext) => number;\n};\n\n/**\n * A component that renders placeholder which is used internally by VirtualizeViewportCollection\n */\nexport const Placeholder = ({ context, placeholderHeight }: Props) => {\n  const { fromIndex, toIndex, which, estimateItemSize } = context;\n  let totalHeight = 0;\n  if (placeholderHeight) {\n    totalHeight = placeholderHeight(context);\n  } else {\n    const placeholderUnitHeight =\n      estimateItemSize === 0 ? DEFAULT_PLACEHOLDER_SIZE : estimateItemSize;\n    totalHeight = Math.max(0, toIndex - fromIndex) * placeholderUnitHeight;\n  }\n\n  const key = which === 'topPlaceholder' ? TOP_PLACEHOLDER_KEY : BOTTOM_PLACEHOLDER_KEY;\n  const style: JSX.CSSProperties = { height: totalHeight + 'px' };\n  if (totalHeight === 0) {\n    style.display = 'none';\n  }\n  return <div key={key} className={PLACEHOLDER_STYLE_CLASS} style={style}></div>;\n};\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { RefObject, ComponentChildren } from 'preact';\nimport { useEffect, useRef } from 'preact/hooks';\nimport { DataState, ItemContext, Range, Metadata, ViewportInfo } from '../UNSAFE_Collection';\nimport { Collection } from '../PRIVATE_Collection';\nimport {\n  Placeholder,\n  PlaceholderContext,\n  PlaceholderType,\n  PLACEHOLDER_STYLE_CLASS\n} from './Placeholder';\nimport { useViewportIntersect, ViewportConfig } from '../hooks/UNSAFE_useViewportIntersect';\n\n/**\n * Props for the VirtualizedCollection component\n */\ntype Props<K, D> = {\n  /**\n   * A DataState object that provide information including data and metadata to the VirtualizedCollection.\n   */\n  data: DataState<K, D> | null;\n\n  /**\n   * Renderer callback used to render each item\n   */\n  children: (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => ComponentChildren;\n\n  /**\n   * Callback to calculate placeholder height\n   */\n  placeholderHeight?: (context: PlaceholderContext) => number;\n\n  /**\n   * Viewport configuration including specifying the element which is used to determine what range\n   * of data to render\n   */\n  viewportConfig: ViewportConfig;\n\n  /**\n   * The selector string to identify the children items\n   */\n  itemSelector: string;\n\n  /**\n   * Callback function to handle when viewport has changed, including the case\n   * where user scrolls to the end of the component and there are more items to load.\n   * The function should sets a new DataState on the component for the specified range.\n   */\n  onLoadRange: (range: Range) => void;\n\n  /**\n   * The number of additional items to render before and after the current viewport.  This is\n   * mainly used for performance tuning.  Increase the overscan will result in less frequent\n   * rendering when scroll but at the same time each render will take longer depending on the\n   * item content.\n   */\n  overscan?: number;\n\n  /**\n   * Optionally provide a custom callback to return the range to render based on viewport info\n   */\n  rangeExtractor?: (info: ViewportInfo) => Range;\n\n  /**\n   * Optionally specify the custom load more indicator\n   */\n  loadMoreIndicator?: ComponentChildren;\n\n  /**\n   * Optionally provide the suggestion indicator sparkle\n   */\n  suggestions?: ComponentChildren;\n};\n\n/**\n * A function that returns the default range extractor\n * @param fetchSize\n */\nexport function getVirtualizedRangeExtractor(fetchSize: number) {\n  return function ({ itemSize, viewportHeight, scrollOffset, overscan = 0 }: ViewportInfo): Range {\n    // if any of these is missing then return default initial range\n    if (\n      itemSize === undefined ||\n      itemSize === 0 ||\n      viewportHeight === undefined ||\n      scrollOffset === undefined\n    ) {\n      return { offset: 0, count: fetchSize };\n    }\n    const offset = Math.ceil(scrollOffset / itemSize);\n    const count = Math.ceil(viewportHeight / itemSize);\n    return {\n      offset: Math.max(0, offset - overscan),\n      count: count + overscan * (offset > 0 ? 2 : 1)\n    };\n  };\n}\n\n/**\n * Helper function to find the top and bottom of an element relative to the viewport\n * @param elem\n */\nconst getElementTopBottom = (elem: HTMLElement): { top: number; bottom: number } => {\n  let top;\n  let bottom;\n  if (elem === document.documentElement) {\n    top = 0;\n    bottom = document.documentElement.clientHeight;\n  } else {\n    const scrollerBounds = elem.getBoundingClientRect();\n    top = scrollerBounds.top;\n    bottom = scrollerBounds.bottom;\n  }\n  return { top, bottom };\n};\n\nconst isDataStateValid = <K, D>(dataState: DataState<K, D>) => {\n  return dataState && dataState.data && dataState.offset >= 0 && dataState.totalSize >= 0;\n};\n\nconst DEFAULT_MARGIN = 1;\n\n/**\n * Returns the range for the current viewport\n */\nconst getViewportRange = (\n  scroller: HTMLElement | null,\n  root: HTMLElement,\n  overscan: number,\n  rangeExtractor: (info: ViewportInfo) => Range,\n  estimateItemSize: number\n) => {\n  let scrollOffset;\n  let viewportHeight;\n\n  if (scroller && root) {\n    const rootRect = root.getBoundingClientRect();\n    const viewportRect = getElementTopBottom(scroller);\n    if (rootRect && viewportRect) {\n      scrollOffset = viewportRect.top - rootRect.top - DEFAULT_MARGIN;\n      viewportHeight = viewportRect.bottom - viewportRect.top + DEFAULT_MARGIN;\n    }\n  }\n\n  if (scrollOffset !== undefined && viewportHeight !== undefined) {\n    // figure out what the new range should be\n    const range = rangeExtractor({\n      scrollOffset,\n      viewportHeight,\n      overscan: overscan,\n      itemSize: estimateItemSize\n    });\n\n    return range;\n  }\n  return null;\n};\n\nconst DEFAULT_OVERSCAN = 1;\nconst DEFAULT_END_INDEX = 25; // match default fetch size\nconst LOADMORE_STYLE_CLASS = 'oj-collection-loadmore';\nconst LOAD_MORE_AND_PLACEHOLDER_SELECTOR = `.${LOADMORE_STYLE_CLASS}, .${PLACEHOLDER_STYLE_CLASS}`;\nconst DEFAULT_RANGE_EXTRACTOR = getVirtualizedRangeExtractor(DEFAULT_END_INDEX);\n\n/**\n * Component that only render items in the specified viewport.\n * @param props\n */\nexport function VirtualizedCollection<K, D>({\n  data,\n  children,\n  viewportConfig,\n  itemSelector,\n  placeholderHeight,\n  rangeExtractor = DEFAULT_RANGE_EXTRACTOR,\n  overscan = DEFAULT_OVERSCAN,\n  onLoadRange,\n  loadMoreIndicator,\n  suggestions\n}: Props<K, D>) {\n  const rootRef: RefObject<any> = useRef<HTMLElement>(null);\n  const estimateItemSizeRef: RefObject<number> = useRef(0);\n\n  // detect if viewport has changed and it needs to re-render based on a new range\n  useViewportIntersect(\n    viewportConfig,\n    DEFAULT_MARGIN,\n    0,\n    LOAD_MORE_AND_PLACEHOLDER_SELECTOR,\n    () => {\n      const range = getViewportRange(\n        viewportConfig.scroller(),\n        rootRef.current,\n        overscan,\n        rangeExtractor,\n        estimateItemSizeRef.current ?? 0\n      );\n      if (range) {\n        onLoadRange(range);\n      }\n    }\n  );\n\n  // calculate average item height.  For now, we'll just do this once, but we can\n  // do a rolling average where we'll adjust on every render.\n  useEffect(() => {\n    if (estimateItemSizeRef.current === 0) {\n      let totalHeight = 0;\n      const nodes = rootRef.current.querySelectorAll(itemSelector);\n      if (nodes.length > 0) {\n        nodes.forEach((item: HTMLElement) => {\n          totalHeight += item.offsetHeight;\n        });\n        estimateItemSizeRef.current = totalHeight / nodes.length;\n      }\n    }\n  });\n\n  // override itemRenderer to adjust the index\n  const _getItemRenderer = (startIndex: number) => {\n    // returns a new render function\n    return (context: ItemContext<{ data: D; metadata: Metadata<K> }>) => {\n      const itemContext: ItemContext<{ data: D; metadata: Metadata<K> }> = {\n        index: startIndex + context.index,\n        data: context.data\n      };\n      return children(itemContext);\n    };\n  };\n\n  // if DataState is invalid (including not specified), just render blank\n  if (!data || !isDataStateValid(data)) {\n    return <div ref={rootRef} />;\n  }\n\n  const rangeData = data.data;\n  const offset = data.offset;\n  const endIndex = offset + rangeData.length;\n  const itemCount = data.totalSize;\n  const topPlaceholderContext =\n    offset >= 0\n      ? {\n          fromIndex: 0,\n          toIndex: offset,\n          which: 'topPlaceholder' as PlaceholderType,\n          estimateItemSize: estimateItemSizeRef.current ?? 0\n        }\n      : undefined;\n  const bottomPlaceholderContext =\n    endIndex && endIndex <= itemCount\n      ? {\n          fromIndex: endIndex,\n          toIndex: itemCount,\n          which: 'bottomPlaceholder' as PlaceholderType,\n          estimateItemSize: estimateItemSizeRef.current ?? 0\n        }\n      : undefined;\n\n  const renderLoadMore =\n    loadMoreIndicator && data.sizePrecision === 'atLeast' && endIndex <= itemCount;\n\n  // might need to support elementType prop in the future to allow customization of what\n  // type of element to render for the root\n  return (\n    <div ref={rootRef} style=\"will-change: contents\">\n      {suggestions}\n      {topPlaceholderContext && (\n        <Placeholder\n          context={topPlaceholderContext}\n          placeholderHeight={placeholderHeight}></Placeholder>\n      )}\n      <Collection items={rangeData}>{_getItemRenderer(offset)}</Collection>\n      {bottomPlaceholderContext && (\n        <Placeholder\n          context={bottomPlaceholderContext}\n          placeholderHeight={placeholderHeight}></Placeholder>\n      )}\n      {renderLoadMore && loadMoreIndicator}\n    </div>\n  );\n}\n"],"names":["_jsx","useRef","useViewportIntersect","useEffect","_jsxs","Collection"],"mappings":"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"}

package/cjs/VirtualizedListView-ad3219ba.js

@@ -0,0 +1,16 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var List = require('./List-bad74e43.js');
+
+/**
+ * Component that renders items as a flat list.
+ * In order to maximize performance, only items that are visible in the viewport are rendered.
+ */
+function VirtualizedListView(props) {
+    return (jsxRuntime.jsx(List.List, { isVirtualized: true, ...props, children: props.children }));
+}
+
+exports.VirtualizedListView = VirtualizedListView;
+//# sourceMappingURL=VirtualizedListView-ad3219ba.js.map

package/cjs/VirtualizedListView-ad3219ba.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VirtualizedListView-ad3219ba.js","sources":["../../src/UNSAFE_VirtualizedListView/VirtualizedListView.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { List } from '../PRIVATE_List';\nimport { ListProps } from '../UNSAFE_ListView/List.types';\n\n/**\n * Props for the VirtualizedListView Component\n */\nexport type Props<K, D> = Pick<\n  ListProps<K, D>,\n  | 'aria-label'\n  | 'aria-labelledby'\n  | 'children'\n  | 'currentItemVariant'\n  | 'currentItemOverride'\n  | 'data'\n  | 'gridlines'\n  | 'onPersistCurrentItem'\n  | 'onItemAction'\n  | 'onLoadRange'\n  | 'onSelectionChange'\n  | 'selectedKeys'\n  | 'selectionMode'\n  | 'viewportConfig'\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 */\n\nexport function VirtualizedListView<K extends string | number, D>(props: Props<K, D>) {\n  return (\n    <List isVirtualized={true} {...props}>\n      {props.children}\n    </List>\n  );\n}\n"],"names":["_jsx","List"],"mappings":";;;;;;AA+BA;;;AAGG;AAEG,SAAU,mBAAmB,CAA+B,KAAkB,EAAA;AAClF,IAAA,QACEA,cAAA,CAACC,SAAI,EAAA,EAAC,aAAa,EAAE,IAAI,EAAM,GAAA,KAAK,YACjC,KAAK,CAAC,QAAQ,EAAA,CACV,EACP;AACJ;;;;"}