diff --git a/apps/vr-tests-react-components/src/stories/Table.stories.tsx b/apps/vr-tests-react-components/src/stories/Table.stories.tsx index 1cdbaef5daf7c..4f18442262a7c 100644 --- a/apps/vr-tests-react-components/src/stories/Table.stories.tsx +++ b/apps/vr-tests-react-components/src/stories/Table.stories.tsx @@ -21,6 +21,7 @@ import { TableCellLayout, TableSelectionCell, TableCellActions, + TableProps, } from '@fluentui/react-table'; import { Button } from '@fluentui/react-button'; import { storiesOf } from '@storybook/react'; @@ -72,474 +73,486 @@ const columns = [ { columnKey: 'lastUpdate', label: 'Last update' }, ]; -storiesOf('Table - cell actions', module) - .addDecorator(story => ( - {story()} - )) - .addStory( - 'default', - () => ( - - - - {columns.map(column => ( - {column.label} - ))} - - - - {items.map(item => ( - - - - {item.file.label} - -
- ), - { includeDarkMode: true, includeHighContrast: true, includeRtl: true }, - ) - .addStory( - 'always visible', - () => ( - - - - {columns.map(column => ( - {column.label} - ))} - - - - {items.map(item => ( - - - - {item.file.label} - -
- ), - { includeDarkMode: true, includeHighContrast: true, includeRtl: true }, - ) - .addStory('in header cell', () => ( - - - - {columns.map(column => ( - {column.label} - ))} +interface SharedVrTestArgs { + layoutType: TableProps['layoutType']; +} + +const CellActionsDefault: React.FC = ({ layoutType }) => ( +
+ + + {columns.map(column => ( + {column.label} + ))} + + + + {items.map(item => ( + + + + {item.file.label} + +
+); + +const CellActionsAlwaysVisible: React.FC = ({ layoutType }) => ( + + + + {columns.map(column => ( + {column.label} ))} - -
- )); + + + + {items.map(item => ( + + + + {item.file.label} + + + + + ); +}; diff --git a/packages/react-components/react-table/src/stories/Table/SingleSelect.stories.tsx b/packages/react-components/react-table/src/stories/Table/SingleSelect.stories.tsx index c488d00e1c57d..30f68a2d53f1c 100644 --- a/packages/react-components/react-table/src/stories/Table/SingleSelect.stories.tsx +++ b/packages/react-components/react-table/src/stories/Table/SingleSelect.stories.tsx @@ -10,7 +10,7 @@ import { } from '@fluentui/react-icons'; import { PresenceBadgeStatus, Avatar } from '@fluentui/react-components'; import { TableBody, TableCell, TableRow, Table, TableHeader, TableHeaderCell, TableSelectionCell } from '../..'; -import { useTable, ColumnDefinition } from '../../hooks'; +import { useTable, ColumnDefinition, useSelection } from '../../hooks'; import { useNavigationMode } from '../../navigationModes/useNavigationMode'; import { TableCellLayout } from '../../components/TableCellLayout/TableCellLayout'; @@ -96,22 +96,34 @@ const columns: ColumnDefinition[] = [ ]; export const SingleSelect = () => { - const { rows } = useTable({ - columns, - items, - selectionMode: 'single', - defaultSelectedRows: new Set([1]), - rowEnhancer: (row, { selection }) => ({ - ...row, - selected: selection.isRowSelected(row.rowId), - onClick: () => selection.toggleRow(row.rowId), - onKeyDown: (e: React.KeyboardEvent) => { - if (e.key === ' ' || e.key === 'Enter') { - selection.toggleRow(row.rowId); - } - }, - }), - }); + const { + getRows, + selection: { toggleRow, isRowSelected }, + } = useTable( + { + columns, + items, + }, + [ + tableState => + useSelection(tableState, { + selectionMode: 'single', + defaultSelectedItems: new Set([1]), + }), + ], + ); + + const rows = getRows(row => ({ + ...row, + onClick: () => toggleRow(row.rowId), + onKeyDown: (e: React.KeyboardEvent) => { + if (e.key === ' ' || e.key === 'Enter') { + toggleRow(row.rowId); + } + }, + selected: isRowSelected(row.rowId), + })); + // eslint-disable-next-line deprecation/deprecation const ref = useNavigationMode('row'); diff --git a/packages/react-components/react-table/src/stories/Table/SingleSelectControlled.stories.tsx b/packages/react-components/react-table/src/stories/Table/SingleSelectControlled.stories.tsx index 95aea34239042..64fb3057f0763 100644 --- a/packages/react-components/react-table/src/stories/Table/SingleSelectControlled.stories.tsx +++ b/packages/react-components/react-table/src/stories/Table/SingleSelectControlled.stories.tsx @@ -10,7 +10,7 @@ import { } from '@fluentui/react-icons'; import { PresenceBadgeStatus, Avatar } from '@fluentui/react-components'; import { TableBody, TableCell, TableRow, Table, TableHeader, TableHeaderCell, TableSelectionCell } from '../..'; -import { useTable, ColumnDefinition, RowId } from '../../hooks'; +import { useTable, ColumnDefinition, RowId, useSelection } from '../../hooks'; import { useNavigationMode } from '../../navigationModes/useNavigationMode'; import { TableCellLayout } from '../../components/TableCellLayout/TableCellLayout'; @@ -97,23 +97,34 @@ const columns: ColumnDefinition[] = [ export const SingleSelectControlled = () => { const [selectedRows, setSelectedRows] = React.useState(new Set()); - const { rows } = useTable({ - columns, - items, - selectionMode: 'single', - selectedRows, - onSelectionChange: setSelectedRows, - rowEnhancer: (row, { selection }) => ({ - ...row, - selected: selection.isRowSelected(row.rowId), - onClick: () => selection.toggleRow(row.rowId), - onKeyDown: (e: React.KeyboardEvent) => { - if (e.key === ' ' || e.key === 'Enter') { - selection.toggleRow(row.rowId); - } - }, - }), - }); + const { + getRows, + selection: { toggleRow, isRowSelected }, + } = useTable( + { + columns, + items, + }, + [ + tableState => + useSelection(tableState, { + selectionMode: 'single', + selectedItems: selectedRows, + onSelectionChange: setSelectedRows, + }), + ], + ); + + const rows = getRows(row => ({ + ...row, + onClick: () => toggleRow(row.rowId), + onKeyDown: (e: React.KeyboardEvent) => { + if (e.key === ' ' || e.key === 'Enter') { + toggleRow(row.rowId); + } + }, + selected: isRowSelected(row.rowId), + })); // eslint-disable-next-line deprecation/deprecation const ref = useNavigationMode('row'); diff --git a/packages/react-components/react-table/src/stories/Table/Sort.stories.tsx b/packages/react-components/react-table/src/stories/Table/Sort.stories.tsx index b8de8eb98eadf..7d4a01cca792c 100644 --- a/packages/react-components/react-table/src/stories/Table/Sort.stories.tsx +++ b/packages/react-components/react-table/src/stories/Table/Sort.stories.tsx @@ -10,7 +10,7 @@ import { } from '@fluentui/react-icons'; import { PresenceBadgeStatus, Avatar } from '@fluentui/react-components'; import { TableBody, TableCell, TableRow, Table, TableHeader, TableHeaderCell } from '../..'; -import { useTable, ColumnDefinition, ColumnId } from '../../hooks'; +import { useTable, ColumnDefinition, ColumnId, useSort } from '../../hooks'; import { TableCellLayout } from '../../components/TableCellLayout/TableCellLayout'; type FileCell = { @@ -108,9 +108,15 @@ const columns: ColumnDefinition[] = [ export const Sort = () => { const { - rows, - sort: { getSortDirection, toggleColumnSort }, - } = useTable({ columns, items, defaultSortState: { sortColumn: 'file', sortDirection: 'ascending' } }); + getRows, + sort: { getSortDirection, toggleColumnSort, sort }, + } = useTable( + { + columns, + items, + }, + [tableState => useSort(tableState, { defaultSortState: { sortColumn: 'file', sortDirection: 'ascending' } })], + ); const headerSortProps = (columnId: ColumnId) => ({ onClick: () => { @@ -130,7 +136,7 @@ export const Sort = () => { - {rows.map(({ item }) => ( + {sort(getRows()).map(({ item }) => ( {item.file.label} diff --git a/packages/react-components/react-table/src/stories/Table/SortControlled.stories.tsx b/packages/react-components/react-table/src/stories/Table/SortControlled.stories.tsx index 22ca7cdc51aa8..16cf9b6aaa145 100644 --- a/packages/react-components/react-table/src/stories/Table/SortControlled.stories.tsx +++ b/packages/react-components/react-table/src/stories/Table/SortControlled.stories.tsx @@ -10,7 +10,7 @@ import { } from '@fluentui/react-icons'; import { PresenceBadgeStatus, Avatar } from '@fluentui/react-components'; import { TableBody, TableCell, TableRow, Table, TableHeader, TableHeaderCell } from '../..'; -import { useTable, ColumnDefinition, ColumnId, SortState } from '../../hooks'; +import { useTable, ColumnDefinition, ColumnId, SortState, useSort } from '../../hooks'; import { TableCellLayout } from '../../components/TableCellLayout/TableCellLayout'; type FileCell = { @@ -113,9 +113,9 @@ export const SortControlled = () => { }); const { - rows, - sort: { getSortDirection, toggleColumnSort }, - } = useTable({ columns, items, sortState, onSortChange: setSortState }); + getRows, + sort: { getSortDirection, toggleColumnSort, sort }, + } = useTable({ columns, items }, [tableState => useSort(tableState, { sortState, onSortChange: setSortState })]); const headerSortProps = (columnId: ColumnId) => ({ onClick: () => toggleColumnSort(columnId), @@ -133,7 +133,7 @@ export const SortControlled = () => { - {rows.map(({ item }) => ( + {sort(getRows()).map(({ item }) => ( {item.file.label} diff --git a/packages/react-components/react-table/src/stories/Table/VirtualizationReactVirtual.stories.tsx b/packages/react-components/react-table/src/stories/Table/VirtualizationReactVirtual.stories.tsx new file mode 100644 index 0000000000000..a000708ebdc79 --- /dev/null +++ b/packages/react-components/react-table/src/stories/Table/VirtualizationReactVirtual.stories.tsx @@ -0,0 +1,147 @@ +import * as React from 'react'; +import { Table, TableHeader, TableHeaderCell, TableCell, TableBody, TableRow, TableSelectionCell } from '../..'; +import { useVirtualizer } from '@tanstack/react-virtual'; +import { useTable } from '../../hooks/useTable'; +import { useSelection } from '../../hooks/useSelection'; +import { useSort } from '../../hooks/useSort'; +import { ColumnDefinition, ColumnId } from '../../hooks/types'; + +const columns: ColumnDefinition<{ index: number }>[] = [ + { + columnId: 'first', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'second', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'third', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'fourth', + compare: (a, b) => { + return a.index - b.index; + }, + }, +]; + +const items = new Array(1000).fill(0).map((_, i) => ({ index: i })); + +export const VirtualizationReactVirtual = () => { + // The scrollable element for your list + const parentRef = React.useRef(null); + + // The virtualizer + const rowVirtualizer = useVirtualizer({ + count: 1000, + getScrollElement: () => parentRef.current, + estimateSize: () => 35, + }); + + const { + getRows, + sort: { getSortDirection, toggleColumnSort, sort }, + selection: { allRowsSelected, someRowsSelected, toggleAllRows, toggleRow, isRowSelected }, + } = useTable( + { + columns, + items, + }, + [ + tableState => useSelection(tableState, { selectionMode: 'multiselect' }), + tableState => useSort(tableState, { defaultSortState: { sortColumn: 'first', sortDirection: 'ascending' } }), + ], + ); + + let rows = getRows(row => ({ + ...row, + onClick: () => toggleRow(row.rowId), + onKeyDown: (e: React.KeyboardEvent) => { + if (e.key === ' ' || e.key === 'Enter') { + toggleRow(row.rowId); + } + }, + selected: isRowSelected(row.rowId), + })); + + rows = sort(rows); + + const headerSortProps = (columnId: ColumnId) => ({ + onClick: () => { + toggleColumnSort(columnId); + }, + sortDirection: getSortDirection(columnId), + }); + + return ( + + + + + First + Second + Third + Fourth + + + + {/* The scrollable element for your list */} +
+ {/* The large inner element to hold all of the items */} +
+ {/* Only the visible items in the virtualizer, manually positioned to be in view */} + {rowVirtualizer.getVirtualItems().map(virtualItem => { + const { + selected, + onClick, + item: { index: userIndex }, + } = rows[virtualItem.index]; + + const style = { + position: 'absolute', + top: 0, + left: 0, + width: '100%', + height: `${virtualItem.size}px`, + transform: `translateY(${virtualItem.start}px)`, + }; + + return ( + + + First {userIndex} + Second {userIndex} + Third {userIndex} + Fourth {userIndex} + + ); + })} +
+
+ +
+ ); +}; diff --git a/packages/react-components/react-table/src/stories/Table/VirtualizationReactWindow.stories.tsx b/packages/react-components/react-table/src/stories/Table/VirtualizationReactWindow.stories.tsx new file mode 100644 index 0000000000000..c64fd9b403821 --- /dev/null +++ b/packages/react-components/react-table/src/stories/Table/VirtualizationReactWindow.stories.tsx @@ -0,0 +1,115 @@ +import * as React from 'react'; +import { Table, TableHeader, TableHeaderCell, TableCell, TableBody, TableRow } from '../..'; +import { FixedSizeList as List } from 'react-window'; +import { useTable } from '../../hooks/useTable'; +import { useColumnSizing } from '../../hooks/useColumnSizing'; +import { useSelection } from '../../hooks/useSelection'; +import { useSort } from '../../hooks/useSort'; +import { TableSelectionCell } from '../../components/TableSelectionCell/TableSelectionCell'; +import { ColumnDefinition, ColumnId } from '../../hooks/types'; + +const columns: ColumnDefinition<{ index: number }>[] = [ + { + columnId: 'first', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'second', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'third', + compare: (a, b) => { + return a.index - b.index; + }, + }, + { + columnId: 'fourth', + compare: (a, b) => { + return a.index - b.index; + }, + }, +]; + +const Row = ({ index, style, data }) => { + const { + selected, + onClick, + item: { index: userIndex }, + } = data[index]; + return ( + + + First {userIndex} + Second {userIndex} + Third {userIndex} + Fourth {userIndex} + + ); +}; + +const items = new Array(1000).fill(0).map((_, i) => ({ index: i })); + +export const VirtualizationReactWindow = () => { + const { + columnSizing: { getTotalWidth }, + tableRef, + getRows, + sort: { getSortDirection, toggleColumnSort, sort }, + selection: { allRowsSelected, someRowsSelected, toggleAllRows, toggleRow, isRowSelected }, + } = useTable( + { + columns, + items, + }, + [ + useColumnSizing, + tableState => useSelection(tableState, { selectionMode: 'multiselect' }), + tableState => useSort(tableState, { defaultSortState: { sortColumn: 'first', sortDirection: 'ascending' } }), + ], + ); + + const rows = getRows(row => ({ + ...row, + onClick: () => toggleRow(row.rowId), + onKeyDown: (e: React.KeyboardEvent) => { + if (e.key === ' ' || e.key === 'Enter') { + toggleRow(row.rowId); + } + }, + selected: isRowSelected(row.rowId), + })); + + const headerSortProps = (columnId: ColumnId) => ({ + onClick: () => { + toggleColumnSort(columnId); + }, + sortDirection: getSortDirection(columnId), + }); + + return ( + + + + + First + Second + Third + Fourth + + + + + {Row} + + +
+ ); +}; diff --git a/packages/react-components/react-table/src/stories/Table/VirtualizationRecyclerListView.stories.tsx b/packages/react-components/react-table/src/stories/Table/VirtualizationRecyclerListView.stories.tsx new file mode 100644 index 0000000000000..8319e357c12ef --- /dev/null +++ b/packages/react-components/react-table/src/stories/Table/VirtualizationRecyclerListView.stories.tsx @@ -0,0 +1,56 @@ +import * as React from 'react'; +import { Table, TableHeader, TableHeaderCell, TableCell, TableBody, TableRow } from '../..'; +import { RecyclerListView, LayoutProvider, DataProvider } from 'recyclerlistview/web'; +import { useTable } from '../../hooks/useTable'; + +const layoutProvider = new LayoutProvider( + () => 0, + (_, dimensions) => { + dimensions.width = window.innerWidth; + dimensions.height = 45; + }, +); + +const dataProvider = new DataProvider((r1, r2) => r1 !== r2); + +export const VirtualizationRecyclerListView = () => { + const { tableRef } = useTable( + { + columns: [{ columnId: 'first' }, { columnId: 'second' }, { columnId: 'third' }, { columnId: 'fourth' }], + items: [], + }, + [], + ); + + const items = new Array(10000).fill(0).map((_, i) => i); + + return ( + + + + First + Second + Third + Fourth + + + + { + return ( + + First + Second + Third + Fourth + + ); + }} + /> + +
+ ); +}; diff --git a/packages/react-components/react-table/src/stories/Table/VirtualizationResembli.stories.tsx b/packages/react-components/react-table/src/stories/Table/VirtualizationResembli.stories.tsx new file mode 100644 index 0000000000000..5426886455b92 --- /dev/null +++ b/packages/react-components/react-table/src/stories/Table/VirtualizationResembli.stories.tsx @@ -0,0 +1,41 @@ +import * as React from 'react'; +import { Table, TableHeader, TableHeaderCell, TableCell, TableBody, TableRow } from '../..'; +import { List } from '@resembli/react-virtualized-window'; + +const sampleData = Array.from({ length: 10000 }, (_, i) => i); + +const Row = ({ data, style }) => { + return ( + + First {data} + Second + Third + Fourth + + ); +}; + +export const VirtualizationResembli = () => { + return ( + + + + First + Second + Third + Fourth + + + + + + {Row} + + +
+ ); +}; diff --git a/packages/react-components/react-table/src/stories/Table/index.stories.tsx b/packages/react-components/react-table/src/stories/Table/index.stories.tsx index 9e4dced7261fb..f61d1d38a5a1b 100644 --- a/packages/react-components/react-table/src/stories/Table/index.stories.tsx +++ b/packages/react-components/react-table/src/stories/Table/index.stories.tsx @@ -16,6 +16,12 @@ export { SingleSelectControlled } from './SingleSelectControlled.stories'; export { CellNavigationMode } from './CellNavigationMode.stories'; export { RowNavigationMode } from './RowNavigationMode.stories'; export { CompositeNavigationMode } from './CompositeNavigationMode.stories'; +export { ColumnResize } from './ColumnResize.stories'; +export { Everything } from './Everything.stories'; +export { VirtualizationReactWindow } from './VirtualizationReactWindow.stories'; +export { VirtualizationReactVirtual } from './VirtualizationReactVirtual.stories'; +export { VirtualizationRecyclerListView } from './VirtualizationRecyclerListView.stories'; +export { VirtualizationResembli } from './VirtualizationResembli.stories'; export default { title: 'Preview Components/Table', diff --git a/yarn.lock b/yarn.lock index df23a510368ca..67e4de35b6e8f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3654,6 +3654,11 @@ resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.4.4.tgz#11d5db19bd178936ec89cd84519c4de439574398" integrity sha512-1oO6+dN5kdIA3sKPZhRGJTfGVP4SWV6KqlMOwry4J3HfyD68sl/3KmG7DeYUzvN+RbhXDnv/D8vNNB8168tAMg== +"@resembli/react-virtualized-window@0.8.6": + version "0.8.6" + resolved "https://registry.yarnpkg.com/@resembli/react-virtualized-window/-/react-virtualized-window-0.8.6.tgz#e1f6096b805e264db46fd53b00116760f8d67241" + integrity sha512-pJwEjGHqTQHV2nssp32iBWdToWDC13W471FXIfnwebzanhQAt44gu4awmeDDe/8Kr7jUZYBbqEl4Yb5yBhJZEQ== + "@rnx-kit/eslint-plugin@^0.2.5": version "0.2.5" resolved "https://registry.yarnpkg.com/@rnx-kit/eslint-plugin/-/eslint-plugin-0.2.5.tgz#30b4398e6db4f7a81b301c5e825341c4386f6821" @@ -4956,6 +4961,18 @@ dependencies: defer-to-connect "^2.0.1" +"@tanstack/react-virtual@3.0.0-beta.18": + version "3.0.0-beta.18" + resolved "https://registry.yarnpkg.com/@tanstack/react-virtual/-/react-virtual-3.0.0-beta.18.tgz#b97b2019f7d6a5770fb88ee1f7591da55b9059b4" + integrity sha512-mnyCZT6htcRNw1jVb+WyfMUMbd1UmXX/JWPuMf6Bmj92DB/V7Ogk5n5rby5Y5aste7c7mlsBeMF8HtpwERRvEQ== + dependencies: + "@tanstack/virtual-core" "3.0.0-beta.18" + +"@tanstack/virtual-core@3.0.0-beta.18": + version "3.0.0-beta.18" + resolved "https://registry.yarnpkg.com/@tanstack/virtual-core/-/virtual-core-3.0.0-beta.18.tgz#d4b0738c1d0aada922063c899675ff4df9f696b2" + integrity sha512-tcXutY05NpN9lp3+AXI9Sn85RxSPV0EJC0XMim9oeQj/E7bjXoL0qZ4Er4wwnvIbv/hZjC91EmbIQGjgdr6nZg== + "@testim/chrome-version@^1.1.2": version "1.1.2" resolved "https://registry.yarnpkg.com/@testim/chrome-version/-/chrome-version-1.1.2.tgz#092005c5b77bd3bb6576a4677110a11485e11864" @@ -6021,6 +6038,15 @@ "@types/scheduler" "*" csstype "^3.0.2" +"@types/react@^17.0.0": + version "17.0.50" + resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.50.tgz#39abb4f7098f546cfcd6b51207c90c4295ee81fc" + integrity sha512-ZCBHzpDb5skMnc1zFXAXnL3l1FAdi+xZvwxK+PkglMmBrwjpp9nKaWuEvrGnSifCJmBFGxZOOFuwC6KH/s0NuA== + dependencies: + "@types/prop-types" "*" + "@types/scheduler" "*" + csstype "^3.0.2" + "@types/read-pkg-up@^6.0.0": version "6.0.0" resolved "https://registry.yarnpkg.com/@types/read-pkg-up/-/read-pkg-up-6.0.0.tgz#7926c93cf14d906e9829a859e790323d0f338684" @@ -10005,6 +10031,15 @@ content-type@^1.0.4, content-type@~1.0.4: resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.4.tgz#e138cc75e040c727b1966fe5e5f8c9aee256fe3b" integrity sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA== +content-visibility@1.2.2: + version "1.2.2" + resolved "https://registry.yarnpkg.com/content-visibility/-/content-visibility-1.2.2.tgz#12a960da7ac15066f7f4b6d833e9371c08509a33" + integrity sha512-QnBSVsaxNCya+38TY+BVD8j5axLMPCDpBsRgQ9GyQoG+5nkaTCi0WoECNcHn31wFwli4HBJM668JuDHWFwyf8w== + dependencies: + "@types/react" "^17.0.0" + intersection-observer "^0.7.0" + lit-element "^2.3.1" + conventional-changelog-angular@^5.0.3: version "5.0.3" resolved "https://registry.yarnpkg.com/conventional-changelog-angular/-/conventional-changelog-angular-5.0.3.tgz#299fdd43df5a1f095283ac16aeedfb0a682ecab0" @@ -13243,6 +13278,19 @@ fbjs@^0.8.4: setimmediate "^1.0.5" ua-parser-js "^0.7.18" +fbjs@^0.8.9: + version "0.8.18" + resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.18.tgz#9835e0addb9aca2eff53295cd79ca1cfc7c9662a" + integrity sha512-EQaWFK+fEPSoibjNy8IxUtaFOMXcWsY0JaVrQoZR9zC8N2Ygf9iDITPWjUTVIax95b6I742JFLqASHfsag/vKA== + dependencies: + core-js "^1.0.0" + isomorphic-fetch "^2.1.1" + loose-envify "^1.0.0" + object-assign "^4.1.0" + promise "^7.1.1" + setimmediate "^1.0.5" + ua-parser-js "^0.7.30" + fd-slicer@~1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e" @@ -15947,6 +15995,11 @@ interpret@^2.2.0: resolved "https://registry.yarnpkg.com/interpret/-/interpret-2.2.0.tgz#1a78a0b5965c40a5416d007ad6f50ad27c417df9" integrity sha512-Ju0Bz/cEia55xDwUWEa8+olFpCiQoypjnQySseKtmjNrnps3P+xfpUmGr90T7yjlVJmOtybRvPXhKMbHr+fWnw== +intersection-observer@^0.7.0: + version "0.7.0" + resolved "https://registry.yarnpkg.com/intersection-observer/-/intersection-observer-0.7.0.tgz#ee16bee978db53516ead2f0a8154b09b400bbdc9" + integrity sha512-Id0Fij0HsB/vKWGeBe9PxeY45ttRiBmhFyyt/geBdDHBYNctMRTE3dC1U3ujzz3lap+hVXlEcVaB56kZP/eEUg== + into-stream@^3.1.0: version "3.1.0" resolved "https://registry.yarnpkg.com/into-stream/-/into-stream-3.1.0.tgz#96fb0a936c12babd6ff1752a17d05616abd094c6" @@ -18645,6 +18698,18 @@ listr2@^3.8.3: through "^2.3.8" wrap-ansi "^7.0.0" +lit-element@^2.3.1: + version "2.5.1" + resolved "https://registry.yarnpkg.com/lit-element/-/lit-element-2.5.1.tgz#3fa74b121a6cd22902409ae3859b7847d01aa6b6" + integrity sha512-ogu7PiJTA33bEK0xGu1dmaX5vhcRjBXCFexPja0e7P7jqLhTpNKYRPmE+GmiCaRVAbiQKGkUgkh/i6+bh++dPQ== + dependencies: + lit-html "^1.1.1" + +lit-html@^1.1.1: + version "1.4.1" + resolved "https://registry.yarnpkg.com/lit-html/-/lit-html-1.4.1.tgz#0c6f3ee4ad4eb610a49831787f0478ad8e9ae5e0" + integrity sha512-B9btcSgPYb1q4oSOb/PrOT6Z/H+r6xuNzfH4lFli/AWhYwdtrgQkQWBbIc6mdnf6E2IL3gDXdkkqNktpU0OZQA== + load-json-file@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0" @@ -18821,7 +18886,7 @@ lodash.clonedeep@^4.5.0: resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef" integrity sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8= -lodash.debounce@^4.0.8: +lodash.debounce@4.0.8, lodash.debounce@^4.0.8: version "4.0.8" resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168= @@ -22294,6 +22359,13 @@ promzard@^0.3.0: dependencies: read "1" +prop-types@15.5.8: + version "15.5.8" + resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.8.tgz#6b7b2e141083be38c8595aa51fc55775c7199394" + integrity sha512-QiDx7s0lWoAVxmEmOYnn3rIZGduup2PZgj3rta5O5y0NfPKu3ApWi+GdMfTto7PmO/5+p4yamSLMZkj0jaTL4A== + dependencies: + fbjs "^0.8.9" + prop-types@^15.0.0, prop-types@^15.5.10, prop-types@^15.5.6, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" @@ -23277,6 +23349,15 @@ rechoir@^0.7.0: dependencies: resolve "^1.9.0" +recyclerlistview@3.0.5: + version "3.0.5" + resolved "https://registry.yarnpkg.com/recyclerlistview/-/recyclerlistview-3.0.5.tgz#50bf5bcaa401d56bb6bb264354083f4d424408eb" + integrity sha512-JVHz13u520faEsbVqFrJOMuJjc4mJlOXODe5QdqAJHdl5/IpyYeo83uiHrpzxyLb8QtJ0889JMlDik+Z1Ed0QQ== + dependencies: + lodash.debounce "4.0.8" + prop-types "15.5.8" + ts-object-utils "0.0.5" + redent@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/redent/-/redent-1.0.0.tgz#cf916ab1fd5f1f16dfb20822dd6ec7f730c2afde" @@ -26553,6 +26634,11 @@ ts-node@~9.1.1: source-map-support "^0.5.17" yn "3.1.1" +ts-object-utils@0.0.5: + version "0.0.5" + resolved "https://registry.yarnpkg.com/ts-object-utils/-/ts-object-utils-0.0.5.tgz#95361cdecd7e52167cfc5e634c76345e90a26077" + integrity sha512-iV0GvHqOmilbIKJsfyfJY9/dNHCs969z3so90dQWsO1eMMozvTpnB1MEaUbb3FYtZTGjv5sIy/xmslEz0Rg2TA== + ts-pnp@^1.1.6: version "1.2.0" resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"