{"version":3,"file":"PickerVirtualizationListBox.cjs","names":["_styled","_interopRequireDefault","require","_react","_reactWindow","_jsxRuntime","e","__esModule","default","ListboxContainer","styled","div","width","height","Row","data","index","setItemSize","style","rowRef","useRef","useEffect","current","firstChild","firstElementChild","clientHeight","baseOption","props","styles","useMemo","jsx","ref","children","OuterListboxContext","createContext","OuterListboxElementType","forwardRef","outerProps","useContext","useResetCache","length","resetCacheRef","resetAfterIndex","PickerVirtualizationListBox","listHeight","setListHeight","useState","other","itemData","Children","toArray","flatMap","child","concat","sizeMapRef","getListBoxHeight","useCallback","COMBINED_LISTBOX_PADDING","OVERSCAN_ROW_COUNT","itemsHeightCalculated","slice","map","_","reduce","prevItemHeight","nextItemHeight","gridRef","size","getItemSize","Provider","value","VariableSizeList","innerElementType","itemCount","itemSize","outerElementType","overscanCount","MemoizedPickerVirtualizationListBox","exports","memo","displayName"],"sources":["../../../../src/labs/OdysseyPickers/PickerVirtualizationListBox.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport styled from \"@emotion/styled\";\nimport { AutocompleteProps } from \"@mui/material\";\nimport {\n  Children,\n  createContext,\n  forwardRef,\n  memo,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { ListChildComponentProps, VariableSizeList } from \"react-window\";\n\ntype SetItemSize = (size: number) => void;\n\nconst ListboxContainer = styled.div({\n  width: \"100%\",\n  height: \"100%\",\n});\n\nconst Row = <Data extends { key: string; props: Record<string, unknown> }[]>({\n  data,\n  index,\n  setItemSize,\n  style,\n}: ListChildComponentProps<Data> & { setItemSize: SetItemSize }) => {\n  const rowRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (rowRef.current) {\n      /**\n       * Checking for child height to workaround a bug where the clientHeight of the row isn't updated correctly\n       * @see here if you need to know more: https://github.com/bvaughn/react-window/issues/582#issuecomment-1883074908\n       */\n      const firstChild = rowRef.current.firstElementChild;\n      const height = firstChild\n        ? firstChild.clientHeight\n        : rowRef.current.clientHeight;\n\n      setItemSize(height);\n    }\n  }, [index, rowRef, setItemSize]);\n\n  const baseOption = data[index];\n  const { props } = baseOption;\n\n  /**\n   * react-window calculates the absolute positions of the list items, via an inline style, so we need to add it to each list item that is being rendered in the viewable list window.\n   * @see here if you need to know more: https://github.com/bvaughn/react-window?tab=readme-ov-file#why-is-my-list-blank-when-i-scroll\n   */\n  const styles = useMemo(\n    () => ({\n      ...style,\n      height: \"auto\",\n    }),\n    [style],\n  );\n\n  return (\n    <div ref={rowRef}>\n      <li {...props} style={styles} />\n    </div>\n  );\n};\n\nconst OuterListboxContext = createContext({});\n\nconst OuterListboxElementType = forwardRef<HTMLDivElement>((props, ref) => {\n  const outerProps = useContext(OuterListboxContext);\n  return <div ref={ref} {...props} {...outerProps} />;\n});\n\nconst useResetCache = (length: number) => {\n  const resetCacheRef = useRef<VariableSizeList>(null);\n  useEffect(() => {\n    if (resetCacheRef.current) {\n      resetCacheRef.current.resetAfterIndex(0, true);\n    }\n  }, [length]);\n  return resetCacheRef;\n};\n\nconst PickerVirtualizationListBox = forwardRef<\n  HTMLDivElement,\n  AutocompleteProps<undefined, undefined, undefined, undefined>[\"ListboxProps\"]\n>((props = {}, ref) => {\n  const [listHeight, setListHeight] = useState(0);\n\n  const { children, ...other } = props;\n\n  const itemData = Children.toArray(children).flatMap<typeof children>(\n    (child) =>\n      typeof child === \"number\" || typeof child === \"string\"\n        ? [child]\n        : [child].concat(\"children\" in child ? Children.toArray(children) : []),\n  );\n\n  const sizeMapRef = useRef<number[]>([]);\n\n  const getListBoxHeight = useCallback(() => {\n    // 8px of padding top/bottom applied by MUI\n    const COMBINED_LISTBOX_PADDING = 16;\n\n    if (itemData.length > OVERSCAN_ROW_COUNT) {\n      // has a max-height of 40vh set in CSS. This is only set because height needs to be a number\n      return 9999;\n    } else {\n      const itemsHeightCalculated = sizeMapRef.current\n        .slice(0, itemData.length)\n        .map((_, index) => sizeMapRef.current[index] || 0)\n        .reduce(\n          (prevItemHeight, nextItemHeight) => prevItemHeight + nextItemHeight,\n          0,\n        );\n      return COMBINED_LISTBOX_PADDING + itemsHeightCalculated;\n    }\n  }, [itemData, sizeMapRef]);\n\n  useEffect(() => {\n    if (sizeMapRef.current.length && itemData.length) {\n      setListHeight(getListBoxHeight());\n    }\n  }, [getListBoxHeight, itemData, sizeMapRef]);\n\n  // The number of items (rows or columns) to render outside of the visible area for performance and scrolling reasons\n  const OVERSCAN_ROW_COUNT = 8;\n\n  const gridRef = useResetCache(itemData.length);\n\n  const setItemSize = useCallback<SetItemSize>(\n    (size) => {\n      gridRef?.current?.resetAfterIndex(0, true);\n      sizeMapRef.current = sizeMapRef.current.concat(size);\n    },\n    [gridRef, sizeMapRef],\n  );\n  const getItemSize = useCallback(\n    // using 45px as a sane default here to avoid a lot of content shift on repaint\n    (index: number) => sizeMapRef.current[index] || 45,\n    [sizeMapRef],\n  );\n\n  return (\n    <ListboxContainer ref={ref}>\n      <OuterListboxContext.Provider value={other}>\n        <VariableSizeList\n          height={listHeight}\n          innerElementType=\"ul\"\n          itemCount={itemData.length}\n          itemData={itemData}\n          itemSize={getItemSize}\n          outerElementType={OuterListboxElementType}\n          overscanCount={OVERSCAN_ROW_COUNT}\n          ref={gridRef}\n          width=\"100%\"\n        >\n          {({ data, index, style }) => (\n            <Row\n              // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n              data={data}\n              index={index}\n              setItemSize={setItemSize}\n              style={style}\n            />\n          )}\n        </VariableSizeList>\n      </OuterListboxContext.Provider>\n    </ListboxContainer>\n  );\n});\n\nconst MemoizedPickerVirtualizationListBox = memo(PickerVirtualizationListBox);\n\nMemoizedPickerVirtualizationListBox.displayName = \"PickerVirtualizationListBox\";\n\nexport { MemoizedPickerVirtualizationListBox as PickerVirtualizationListBox };\n"],"mappings":"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","ignoreList":[]}