@elliemae/ds-virtual-list 2.3.0-alpha.7 → 2.3.0-next.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/cjs/VirtualList.js +36 -0
  2. package/cjs/VirtualListDataTestID.js +9 -0
  3. package/cjs/hooks/useVirtualList.js +43 -0
  4. package/cjs/index.d.js +2 -0
  5. package/cjs/index.js +10 -0
  6. package/cjs/parts/List.js +52 -0
  7. package/cjs/props.js +27 -0
  8. package/cjs/styled.js +23 -0
  9. package/esm/VirtualList.js +27 -0
  10. package/esm/VirtualListDataTestID.js +5 -0
  11. package/esm/hooks/useVirtualList.js +35 -0
  12. package/esm/index.d.js +1 -0
  13. package/esm/index.js +1 -0
  14. package/esm/parts/List.js +43 -0
  15. package/esm/props.js +22 -0
  16. package/esm/styled.js +13 -0
  17. package/package.json +29 -31
  18. package/types/VirtualList.d.ts +5 -0
  19. package/types/VirtualListDataTestID.d.ts +3 -0
  20. package/types/hooks/useVirtualList.d.ts +9 -0
  21. package/types/index.d.ts +1 -0
  22. package/types/parts/List.d.ts +10 -0
  23. package/types/props.d.ts +20 -0
  24. package/types/styled.d.ts +5 -0
  25. package/dist/cjs/VirtualList.js +0 -50
  26. package/dist/cjs/VirtualList.js.map +0 -7
  27. package/dist/cjs/VirtualListDataTestID.js +0 -37
  28. package/dist/cjs/VirtualListDataTestID.js.map +0 -7
  29. package/dist/cjs/hooks/useVirtualList.js +0 -57
  30. package/dist/cjs/hooks/useVirtualList.js.map +0 -7
  31. package/dist/cjs/index.d.js +0 -27
  32. package/dist/cjs/index.d.js.map +0 -7
  33. package/dist/cjs/index.js +0 -28
  34. package/dist/cjs/index.js.map +0 -7
  35. package/dist/cjs/parts/List.js +0 -59
  36. package/dist/cjs/parts/List.js.map +0 -7
  37. package/dist/cjs/props.js +0 -57
  38. package/dist/cjs/props.js.map +0 -7
  39. package/dist/cjs/styled.js +0 -55
  40. package/dist/cjs/styled.js.map +0 -7
  41. package/dist/esm/VirtualList.js +0 -21
  42. package/dist/esm/VirtualList.js.map +0 -7
  43. package/dist/esm/VirtualListDataTestID.js +0 -8
  44. package/dist/esm/VirtualListDataTestID.js.map +0 -7
  45. package/dist/esm/hooks/useVirtualList.js +0 -28
  46. package/dist/esm/hooks/useVirtualList.js.map +0 -7
  47. package/dist/esm/index.d.js +0 -2
  48. package/dist/esm/index.d.js.map +0 -7
  49. package/dist/esm/index.js +0 -3
  50. package/dist/esm/index.js.map +0 -7
  51. package/dist/esm/parts/List.js +0 -30
  52. package/dist/esm/parts/List.js.map +0 -7
  53. package/dist/esm/props.js +0 -28
  54. package/dist/esm/props.js.map +0 -7
  55. package/dist/esm/styled.js +0 -26
  56. package/dist/esm/styled.js.map +0 -7
@@ -1,57 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var useVirtualList_exports = {};
29
- __export(useVirtualList_exports, {
30
- useVirtualList: () => useVirtualList
31
- });
32
- var React = __toESM(require("react"));
33
- var import_react = __toESM(require("react"));
34
- var import_react_virtual = require("react-virtual");
35
- const useVirtualList = (config) => {
36
- const { children, actionRef } = config;
37
- const parentRef = import_react.default.useRef();
38
- const filteredChildren = import_react.default.useMemo(() => import_react.default.Children.toArray(children).filter((child) => child), [children]);
39
- const useVirtualHelpers = (0, import_react_virtual.useVirtual)({
40
- size: filteredChildren.length,
41
- parentRef,
42
- overscan: 15
43
- });
44
- import_react.default.useEffect(() => {
45
- if (actionRef) {
46
- actionRef.current.scrollTo = useVirtualHelpers.scrollToIndex;
47
- }
48
- }, [actionRef, useVirtualHelpers]);
49
- return {
50
- parentRef,
51
- virtualItems: useVirtualHelpers.virtualItems,
52
- filteredChildren,
53
- totalSize: useVirtualHelpers.totalSize
54
- };
55
- };
56
- module.exports = __toCommonJS(useVirtualList_exports);
57
- //# sourceMappingURL=useVirtualList.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/hooks/useVirtualList.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport { useVirtual, VirtualItem } from 'react-virtual';\nimport { DSVirtualListProps } from '../index.d';\n\nexport const useVirtualList = (\n config: DSVirtualListProps,\n): {\n parentRef: React.MutableRefObject<HTMLDivElement>;\n virtualItems: VirtualItem[];\n filteredChildren: React.ReactNode[];\n totalSize: number;\n} => {\n const { children, actionRef } = config;\n const parentRef = React.useRef<HTMLDivElement>();\n const filteredChildren = React.useMemo(\n () => React.Children.toArray(children).filter((child) => child),\n [children],\n ) as React.ReactNode[];\n const useVirtualHelpers = useVirtual({\n size: filteredChildren.length,\n parentRef,\n overscan: 15,\n });\n React.useEffect(() => {\n if (actionRef) {\n actionRef.current.scrollTo = useVirtualHelpers.scrollToIndex;\n }\n }, [actionRef, useVirtualHelpers]);\n\n return {\n parentRef,\n virtualItems: useVirtualHelpers.virtualItems,\n filteredChildren,\n totalSize: useVirtualHelpers.totalSize,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,2BAAwC;AAGjC,MAAM,iBAAiB,CAC5B,WAMG;AACH,QAAM,EAAE,UAAU,cAAc;AAChC,QAAM,YAAY,qBAAM;AACxB,QAAM,mBAAmB,qBAAM,QAC7B,MAAM,qBAAM,SAAS,QAAQ,UAAU,OAAO,CAAC,UAAU,QACzD,CAAC;AAEH,QAAM,oBAAoB,qCAAW;AAAA,IACnC,MAAM,iBAAiB;AAAA,IACvB;AAAA,IACA,UAAU;AAAA;AAEZ,uBAAM,UAAU,MAAM;AACpB,QAAI,WAAW;AACb,gBAAU,QAAQ,WAAW,kBAAkB;AAAA;AAAA,KAEhD,CAAC,WAAW;AAEf,SAAO;AAAA,IACL;AAAA,IACA,cAAc,kBAAkB;AAAA,IAChC;AAAA,IACA,WAAW,kBAAkB;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,27 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __reExport = (target, module2, copyDefault, desc) => {
9
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
10
- for (let key of __getOwnPropNames(module2))
11
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
12
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
13
- }
14
- return target;
15
- };
16
- var __toESM = (module2, isNodeMode) => {
17
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
18
- };
19
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
20
- return (module2, temp) => {
21
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
22
- };
23
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
24
- var index_d_exports = {};
25
- var React = __toESM(require("react"));
26
- module.exports = __toCommonJS(index_d_exports);
27
- //# sourceMappingURL=index.d.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/index.d.ts", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\n\nexport interface DSVirtualListProps {\n children: React.ReactNode[];\n actionRef: React.MutableRefObject<any>;\n}\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;",
6
- "names": []
7
- }
package/dist/cjs/index.js DELETED
@@ -1,28 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __reExport = (target, module2, copyDefault, desc) => {
9
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
10
- for (let key of __getOwnPropNames(module2))
11
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
12
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
13
- }
14
- return target;
15
- };
16
- var __toESM = (module2, isNodeMode) => {
17
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
18
- };
19
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
20
- return (module2, temp) => {
21
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
22
- };
23
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
24
- var src_exports = {};
25
- var React = __toESM(require("react"));
26
- __reExport(src_exports, require("./VirtualList"));
27
- module.exports = __toCommonJS(src_exports);
28
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["export * from './VirtualList';\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;ADAvB,wBAAc;",
6
- "names": []
7
- }
@@ -1,59 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var List_exports = {};
29
- __export(List_exports, {
30
- List: () => List
31
- });
32
- var React = __toESM(require("react"));
33
- var import_react = __toESM(require("react"));
34
- var import_styled = require("../styled");
35
- var import_VirtualListDataTestID = require("../VirtualListDataTestID");
36
- var import_useVirtualList = require("../hooks/useVirtualList");
37
- const List = (props) => {
38
- const { parentRef, virtualItems, filteredChildren, totalSize } = (0, import_useVirtualList.useVirtualList)(props);
39
- const virtualChildren = import_react.default.useMemo(() => virtualItems.map((virtualItem) => {
40
- const { index, measureRef, start } = virtualItem;
41
- const style = {
42
- transform: `translateY(${start}px)`
43
- };
44
- return /* @__PURE__ */ import_react.default.createElement(import_styled.VirtualItemStyled, {
45
- ref: measureRef,
46
- style,
47
- role: "listitem"
48
- }, filteredChildren[index]);
49
- }), [filteredChildren, virtualItems]);
50
- return /* @__PURE__ */ import_react.default.createElement(import_styled.StyledContainerContentList, {
51
- ref: parentRef,
52
- "data-testid": import_VirtualListDataTestID.LIST_DATA_TESTID.CONTAINER,
53
- role: "list"
54
- }, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledVirtualList, {
55
- height: `${totalSize}px`
56
- }, virtualChildren));
57
- };
58
- module.exports = __toCommonJS(List_exports);
59
- //# sourceMappingURL=List.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/parts/List.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport { VirtualItemStyled, StyledContainerContentList, StyledVirtualList } from '../styled';\n\nimport { LIST_DATA_TESTID } from '../VirtualListDataTestID';\n\nimport { DSVirtualListProps } from '../index.d';\nimport { useVirtualList } from '../hooks/useVirtualList';\n\n/**\n * List component: renders a list of items\n * Accessibility: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/List_role\n *\n * @param {DSVirtualListProps} props\n * @returns JSX\n */\nexport const List: React.FC<DSVirtualListProps> = (props: DSVirtualListProps) => {\n const { parentRef, virtualItems, filteredChildren, totalSize } = useVirtualList(props);\n const virtualChildren = React.useMemo(\n () =>\n virtualItems.map((virtualItem) => {\n const { index, measureRef, start } = virtualItem;\n const style = {\n transform: `translateY(${start}px)`,\n };\n return (\n <VirtualItemStyled ref={measureRef} style={style} role=\"listitem\">\n {filteredChildren[index]}\n </VirtualItemStyled>\n );\n }),\n [filteredChildren, virtualItems],\n );\n return (\n <StyledContainerContentList ref={parentRef} data-testid={LIST_DATA_TESTID.CONTAINER} role=\"list\">\n <StyledVirtualList height={`${totalSize}px`}>{virtualChildren}</StyledVirtualList>\n </StyledContainerContentList>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,oBAAiF;AAEjF,mCAAiC;AAGjC,4BAA+B;AASxB,MAAM,OAAqC,CAAC,UAA8B;AAC/E,QAAM,EAAE,WAAW,cAAc,kBAAkB,cAAc,0CAAe;AAChF,QAAM,kBAAkB,qBAAM,QAC5B,MACE,aAAa,IAAI,CAAC,gBAAgB;AAChC,UAAM,EAAE,OAAO,YAAY,UAAU;AACrC,UAAM,QAAQ;AAAA,MACZ,WAAW,cAAc;AAAA;AAE3B,WACE,mDAAC,iCAAD;AAAA,MAAmB,KAAK;AAAA,MAAY;AAAA,MAAc,MAAK;AAAA,OACpD,iBAAiB;AAAA,MAI1B,CAAC,kBAAkB;AAErB,SACE,mDAAC,0CAAD;AAAA,IAA4B,KAAK;AAAA,IAAW,eAAa,8CAAiB;AAAA,IAAW,MAAK;AAAA,KACxF,mDAAC,iCAAD;AAAA,IAAmB,QAAQ,GAAG;AAAA,KAAgB;AAAA;",
6
- "names": []
7
- }
package/dist/cjs/props.js DELETED
@@ -1,57 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var props_exports = {};
29
- __export(props_exports, {
30
- DSVirtualListSchema: () => DSVirtualListSchema,
31
- defaultProps: () => defaultProps
32
- });
33
- var React = __toESM(require("react"));
34
- var import_lodash = require("lodash");
35
- var import_react_desc = require("react-desc");
36
- const actionRef = {
37
- scrollTo: import_react_desc.PropTypes.func.description("Scroll to a index inside the list")
38
- };
39
- const DSVirtualListSchema = {
40
- children: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.node).description("Children list").defaultValue([]),
41
- actionRef: import_react_desc.PropTypes.shape({
42
- current: import_react_desc.PropTypes.shape(actionRef)
43
- }).description(`Action reference
44
-
45
- scrollTo: Function(index: number, { align: 'start' | 'center' | 'end' | 'auto' }) => void
46
- `)
47
- };
48
- const defaultProps = {
49
- children: [],
50
- actionRef: {
51
- current: {
52
- scrollTo: import_lodash.noop
53
- }
54
- }
55
- };
56
- module.exports = __toCommonJS(props_exports);
57
- //# sourceMappingURL=props.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/props.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { noop } from 'lodash';\nimport { PropTypes } from 'react-desc';\n\nconst actionRef = {\n scrollTo: PropTypes.func.description('Scroll to a index inside the list'),\n};\nexport const DSVirtualListSchema = {\n children: PropTypes.arrayOf(PropTypes.node).description('Children list').defaultValue([]),\n actionRef: PropTypes.shape({\n current: PropTypes.shape(actionRef),\n }).description(`Action reference\n \nscrollTo: Function(index: number, { align: 'start' | 'center' | 'end' | 'auto' }) => void\n `),\n};\n\nexport const defaultProps = {\n children: [],\n actionRef: {\n current: {\n scrollTo: noop,\n },\n },\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAqB;AACrB,wBAA0B;AAE1B,MAAM,YAAY;AAAA,EAChB,UAAU,4BAAU,KAAK,YAAY;AAAA;AAEhC,MAAM,sBAAsB;AAAA,EACjC,UAAU,4BAAU,QAAQ,4BAAU,MAAM,YAAY,iBAAiB,aAAa;AAAA,EACtF,WAAW,4BAAU,MAAM;AAAA,IACzB,SAAS,4BAAU,MAAM;AAAA,KACxB,YAAY;AAAA;AAAA;AAAA;AAAA;AAMV,MAAM,eAAe;AAAA,EAC1B,UAAU;AAAA,EACV,WAAW;AAAA,IACT,SAAS;AAAA,MACP,UAAU;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,55 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __reExport = (target, module2, copyDefault, desc) => {
13
- if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
- for (let key of __getOwnPropNames(module2))
15
- if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
- __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
- }
18
- return target;
19
- };
20
- var __toESM = (module2, isNodeMode) => {
21
- return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
- };
23
- var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
- return (module2, temp) => {
25
- return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
- };
27
- })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
- var styled_exports = {};
29
- __export(styled_exports, {
30
- StyledContainerContentList: () => StyledContainerContentList,
31
- StyledVirtualList: () => StyledVirtualList,
32
- VirtualItemStyled: () => VirtualItemStyled
33
- });
34
- var React = __toESM(require("react"));
35
- var import_styled_components = __toESM(require("styled-components"));
36
- const StyledContainerContentList = import_styled_components.default.div`
37
- width: 100%;
38
- height: 100%;
39
- padding-bottom: 0;
40
- overflow-y: auto;
41
- overflow-x: hidden;
42
- `;
43
- const StyledVirtualList = import_styled_components.default.div`
44
- width: 100%;
45
- height: ${(props) => props.height};
46
- position: relative;
47
- `;
48
- const VirtualItemStyled = import_styled_components.default.div`
49
- position: absolute;
50
- top: 0;
51
- left: 0;
52
- width: 100%;
53
- `;
54
- module.exports = __toCommonJS(styled_exports);
55
- //# sourceMappingURL=styled.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import styled from 'styled-components';\n\nexport const StyledContainerContentList = styled.div`\n width: 100%;\n height: 100%;\n padding-bottom: 0;\n overflow-y: auto;\n overflow-x: hidden;\n`;\nexport const StyledVirtualList = styled.div<{ height: string }>`\n width: 100%;\n height: ${(props) => props.height};\n position: relative;\n`;\nexport const VirtualItemStyled = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAmB;AAEZ,MAAM,6BAA6B,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAO1C,MAAM,oBAAoB,iCAAO;AAAA;AAAA,YAE5B,CAAC,UAAU,MAAM;AAAA;AAAA;AAGtB,MAAM,oBAAoB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,21 +0,0 @@
1
- import * as React from "react";
2
- import React2 from "react";
3
- import { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-props-helpers";
4
- import { describe } from "react-desc";
5
- import { List } from "./parts/List";
6
- import { DSVirtualListSchema, defaultProps } from "./props";
7
- const DSVirtualList = (props) => {
8
- const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
9
- useValidateTypescriptPropTypes(propsWithDefault, DSVirtualListSchema);
10
- return /* @__PURE__ */ React2.createElement(List, {
11
- ...propsWithDefault
12
- });
13
- };
14
- DSVirtualList.propTypes = DSVirtualListSchema;
15
- const DSVirtualListWithSchema = describe(DSVirtualList).description("DSVirtualList");
16
- DSVirtualListWithSchema.propTypes = DSVirtualListSchema;
17
- export {
18
- DSVirtualList,
19
- DSVirtualListWithSchema
20
- };
21
- //# sourceMappingURL=VirtualList.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/VirtualList.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport { describe } from 'react-desc';\nimport { List } from './parts/List';\nimport { DSVirtualListSchema, defaultProps } from './props';\nimport { DSVirtualListProps } from './index.d';\n\n\nconst DSVirtualList: React.ComponentType<DSVirtualListProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);\n useValidateTypescriptPropTypes(propsWithDefault, DSVirtualListSchema);\n\n return <List {...propsWithDefault} />;\n};\n\nDSVirtualList.propTypes = DSVirtualListSchema;\nconst DSVirtualListWithSchema = describe(DSVirtualList).description('DSVirtualList');\nDSVirtualListWithSchema.propTypes = DSVirtualListSchema;\n\nexport { DSVirtualList, DSVirtualListWithSchema };\n"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAIA,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,mBAAmB,6BAA6B,OAAO;AAC7D,iCAA+B,kBAAkB;AAEjD,SAAO,qCAAC,MAAD;AAAA,OAAU;AAAA;AAAA;AAGnB,cAAc,YAAY;AAC1B,MAAM,0BAA0B,SAAS,eAAe,YAAY;AACpE,wBAAwB,YAAY;",
6
- "names": []
7
- }
@@ -1,8 +0,0 @@
1
- import * as React from "react";
2
- const LIST_DATA_TESTID = {
3
- CONTAINER: "virtual-list-container"
4
- };
5
- export {
6
- LIST_DATA_TESTID
7
- };
8
- //# sourceMappingURL=VirtualListDataTestID.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/VirtualListDataTestID.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const LIST_DATA_TESTID = {\n CONTAINER: 'virtual-list-container',\n};\n"],
5
- "mappings": "AAAA;ACAO,MAAM,mBAAmB;AAAA,EAC9B,WAAW;AAAA;",
6
- "names": []
7
- }
@@ -1,28 +0,0 @@
1
- import * as React from "react";
2
- import React2 from "react";
3
- import { useVirtual } from "react-virtual";
4
- const useVirtualList = (config) => {
5
- const { children, actionRef } = config;
6
- const parentRef = React2.useRef();
7
- const filteredChildren = React2.useMemo(() => React2.Children.toArray(children).filter((child) => child), [children]);
8
- const useVirtualHelpers = useVirtual({
9
- size: filteredChildren.length,
10
- parentRef,
11
- overscan: 15
12
- });
13
- React2.useEffect(() => {
14
- if (actionRef) {
15
- actionRef.current.scrollTo = useVirtualHelpers.scrollToIndex;
16
- }
17
- }, [actionRef, useVirtualHelpers]);
18
- return {
19
- parentRef,
20
- virtualItems: useVirtualHelpers.virtualItems,
21
- filteredChildren,
22
- totalSize: useVirtualHelpers.totalSize
23
- };
24
- };
25
- export {
26
- useVirtualList
27
- };
28
- //# sourceMappingURL=useVirtualList.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useVirtualList.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useVirtual, VirtualItem } from 'react-virtual';\nimport { DSVirtualListProps } from '../index.d';\n\nexport const useVirtualList = (\n config: DSVirtualListProps,\n): {\n parentRef: React.MutableRefObject<HTMLDivElement>;\n virtualItems: VirtualItem[];\n filteredChildren: React.ReactNode[];\n totalSize: number;\n} => {\n const { children, actionRef } = config;\n const parentRef = React.useRef<HTMLDivElement>();\n const filteredChildren = React.useMemo(\n () => React.Children.toArray(children).filter((child) => child),\n [children],\n ) as React.ReactNode[];\n const useVirtualHelpers = useVirtual({\n size: filteredChildren.length,\n parentRef,\n overscan: 15,\n });\n React.useEffect(() => {\n if (actionRef) {\n actionRef.current.scrollTo = useVirtualHelpers.scrollToIndex;\n }\n }, [actionRef, useVirtualHelpers]);\n\n return {\n parentRef,\n virtualItems: useVirtualHelpers.virtualItems,\n filteredChildren,\n totalSize: useVirtualHelpers.totalSize,\n };\n};\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAGO,MAAM,iBAAiB,CAC5B,WAMG;AACH,QAAM,EAAE,UAAU,cAAc;AAChC,QAAM,YAAY,OAAM;AACxB,QAAM,mBAAmB,OAAM,QAC7B,MAAM,OAAM,SAAS,QAAQ,UAAU,OAAO,CAAC,UAAU,QACzD,CAAC;AAEH,QAAM,oBAAoB,WAAW;AAAA,IACnC,MAAM,iBAAiB;AAAA,IACvB;AAAA,IACA,UAAU;AAAA;AAEZ,SAAM,UAAU,MAAM;AACpB,QAAI,WAAW;AACb,gBAAU,QAAQ,WAAW,kBAAkB;AAAA;AAAA,KAEhD,CAAC,WAAW;AAEf,SAAO;AAAA,IACL;AAAA,IACA,cAAc,kBAAkB;AAAA,IAChC;AAAA,IACA,WAAW,kBAAkB;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- //# sourceMappingURL=index.d.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "AAAA;",
6
- "names": []
7
- }
package/dist/esm/index.js DELETED
@@ -1,3 +0,0 @@
1
- import * as React from "react";
2
- export * from "./VirtualList";
3
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './VirtualList';\n"],
5
- "mappings": "AAAA;ACAA;",
6
- "names": []
7
- }
@@ -1,30 +0,0 @@
1
- import * as React from "react";
2
- import React2 from "react";
3
- import { VirtualItemStyled, StyledContainerContentList, StyledVirtualList } from "../styled";
4
- import { LIST_DATA_TESTID } from "../VirtualListDataTestID";
5
- import { useVirtualList } from "../hooks/useVirtualList";
6
- const List = (props) => {
7
- const { parentRef, virtualItems, filteredChildren, totalSize } = useVirtualList(props);
8
- const virtualChildren = React2.useMemo(() => virtualItems.map((virtualItem) => {
9
- const { index, measureRef, start } = virtualItem;
10
- const style = {
11
- transform: `translateY(${start}px)`
12
- };
13
- return /* @__PURE__ */ React2.createElement(VirtualItemStyled, {
14
- ref: measureRef,
15
- style,
16
- role: "listitem"
17
- }, filteredChildren[index]);
18
- }), [filteredChildren, virtualItems]);
19
- return /* @__PURE__ */ React2.createElement(StyledContainerContentList, {
20
- ref: parentRef,
21
- "data-testid": LIST_DATA_TESTID.CONTAINER,
22
- role: "list"
23
- }, /* @__PURE__ */ React2.createElement(StyledVirtualList, {
24
- height: `${totalSize}px`
25
- }, virtualChildren));
26
- };
27
- export {
28
- List
29
- };
30
- //# sourceMappingURL=List.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/List.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { VirtualItemStyled, StyledContainerContentList, StyledVirtualList } from '../styled';\n\nimport { LIST_DATA_TESTID } from '../VirtualListDataTestID';\n\nimport { DSVirtualListProps } from '../index.d';\nimport { useVirtualList } from '../hooks/useVirtualList';\n\n/**\n * List component: renders a list of items\n * Accessibility: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/List_role\n *\n * @param {DSVirtualListProps} props\n * @returns JSX\n */\nexport const List: React.FC<DSVirtualListProps> = (props: DSVirtualListProps) => {\n const { parentRef, virtualItems, filteredChildren, totalSize } = useVirtualList(props);\n const virtualChildren = React.useMemo(\n () =>\n virtualItems.map((virtualItem) => {\n const { index, measureRef, start } = virtualItem;\n const style = {\n transform: `translateY(${start}px)`,\n };\n return (\n <VirtualItemStyled ref={measureRef} style={style} role=\"listitem\">\n {filteredChildren[index]}\n </VirtualItemStyled>\n );\n }),\n [filteredChildren, virtualItems],\n );\n return (\n <StyledContainerContentList ref={parentRef} data-testid={LIST_DATA_TESTID.CONTAINER} role=\"list\">\n <StyledVirtualList height={`${totalSize}px`}>{virtualChildren}</StyledVirtualList>\n </StyledContainerContentList>\n );\n};\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAEA;AAGA;AASO,MAAM,OAAqC,CAAC,UAA8B;AAC/E,QAAM,EAAE,WAAW,cAAc,kBAAkB,cAAc,eAAe;AAChF,QAAM,kBAAkB,OAAM,QAC5B,MACE,aAAa,IAAI,CAAC,gBAAgB;AAChC,UAAM,EAAE,OAAO,YAAY,UAAU;AACrC,UAAM,QAAQ;AAAA,MACZ,WAAW,cAAc;AAAA;AAE3B,WACE,qCAAC,mBAAD;AAAA,MAAmB,KAAK;AAAA,MAAY;AAAA,MAAc,MAAK;AAAA,OACpD,iBAAiB;AAAA,MAI1B,CAAC,kBAAkB;AAErB,SACE,qCAAC,4BAAD;AAAA,IAA4B,KAAK;AAAA,IAAW,eAAa,iBAAiB;AAAA,IAAW,MAAK;AAAA,KACxF,qCAAC,mBAAD;AAAA,IAAmB,QAAQ,GAAG;AAAA,KAAgB;AAAA;",
6
- "names": []
7
- }
package/dist/esm/props.js DELETED
@@ -1,28 +0,0 @@
1
- import * as React from "react";
2
- import { noop } from "lodash";
3
- import { PropTypes } from "react-desc";
4
- const actionRef = {
5
- scrollTo: PropTypes.func.description("Scroll to a index inside the list")
6
- };
7
- const DSVirtualListSchema = {
8
- children: PropTypes.arrayOf(PropTypes.node).description("Children list").defaultValue([]),
9
- actionRef: PropTypes.shape({
10
- current: PropTypes.shape(actionRef)
11
- }).description(`Action reference
12
-
13
- scrollTo: Function(index: number, { align: 'start' | 'center' | 'end' | 'auto' }) => void
14
- `)
15
- };
16
- const defaultProps = {
17
- children: [],
18
- actionRef: {
19
- current: {
20
- scrollTo: noop
21
- }
22
- }
23
- };
24
- export {
25
- DSVirtualListSchema,
26
- defaultProps
27
- };
28
- //# sourceMappingURL=props.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/props.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { noop } from 'lodash';\nimport { PropTypes } from 'react-desc';\n\nconst actionRef = {\n scrollTo: PropTypes.func.description('Scroll to a index inside the list'),\n};\nexport const DSVirtualListSchema = {\n children: PropTypes.arrayOf(PropTypes.node).description('Children list').defaultValue([]),\n actionRef: PropTypes.shape({\n current: PropTypes.shape(actionRef),\n }).description(`Action reference\n \nscrollTo: Function(index: number, { align: 'start' | 'center' | 'end' | 'auto' }) => void\n `),\n};\n\nexport const defaultProps = {\n children: [],\n actionRef: {\n current: {\n scrollTo: noop,\n },\n },\n};\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAEA,MAAM,YAAY;AAAA,EAChB,UAAU,UAAU,KAAK,YAAY;AAAA;AAEhC,MAAM,sBAAsB;AAAA,EACjC,UAAU,UAAU,QAAQ,UAAU,MAAM,YAAY,iBAAiB,aAAa;AAAA,EACtF,WAAW,UAAU,MAAM;AAAA,IACzB,SAAS,UAAU,MAAM;AAAA,KACxB,YAAY;AAAA;AAAA;AAAA;AAAA;AAMV,MAAM,eAAe;AAAA,EAC1B,UAAU;AAAA,EACV,WAAW;AAAA,IACT,SAAS;AAAA,MACP,UAAU;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }
@@ -1,26 +0,0 @@
1
- import * as React from "react";
2
- import styled from "styled-components";
3
- const StyledContainerContentList = styled.div`
4
- width: 100%;
5
- height: 100%;
6
- padding-bottom: 0;
7
- overflow-y: auto;
8
- overflow-x: hidden;
9
- `;
10
- const StyledVirtualList = styled.div`
11
- width: 100%;
12
- height: ${(props) => props.height};
13
- position: relative;
14
- `;
15
- const VirtualItemStyled = styled.div`
16
- position: absolute;
17
- top: 0;
18
- left: 0;
19
- width: 100%;
20
- `;
21
- export {
22
- StyledContainerContentList,
23
- StyledVirtualList,
24
- VirtualItemStyled
25
- };
26
- //# sourceMappingURL=styled.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\n\nexport const StyledContainerContentList = styled.div`\n width: 100%;\n height: 100%;\n padding-bottom: 0;\n overflow-y: auto;\n overflow-x: hidden;\n`;\nexport const StyledVirtualList = styled.div<{ height: string }>`\n width: 100%;\n height: ${(props) => props.height};\n position: relative;\n`;\nexport const VirtualItemStyled = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n`;\n"],
5
- "mappings": "AAAA;ACAA;AAEO,MAAM,6BAA6B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAO1C,MAAM,oBAAoB,OAAO;AAAA;AAAA,YAE5B,CAAC,UAAU,MAAM;AAAA;AAAA;AAGtB,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
- "names": []
7
- }