@momentum-design/components 0.22.6 → 0.23.0

package/dist/index.d.ts

@@ -16,7 +16,8 @@ import Toggle from './components/toggle';
 import Checkbox from './components/checkbox';
 import CheckboxGroup from './components/checkboxgroup';
 import Radio from './components/radio';
+import VirtualizedList from './components/virtualizedlist';
 import Tab from './components/tab';
 import type { TextType } from './components/text/text.types';
-export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, AvatarButton, Input, Link, Toggle, Checkbox, CheckboxGroup, Radio, Tab, };
+export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, AvatarButton, Input, Link, Toggle, Checkbox, CheckboxGroup, Radio, VirtualizedList, Tab, };
 export type { TextType, };

package/dist/index.js

@@ -16,5 +16,6 @@ import Toggle from './components/toggle';
 import Checkbox from './components/checkbox';
 import CheckboxGroup from './components/checkboxgroup';
 import Radio from './components/radio';
+import VirtualizedList from './components/virtualizedlist';
 import Tab from './components/tab';
-export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, AvatarButton, Input, Link, Toggle, Checkbox, CheckboxGroup, Radio, Tab, };
+export { ThemeProvider, Icon, IconProvider, Avatar, Badge, Presence, Text, Button, Bullet, Marker, Divider, AvatarButton, Input, Link, Toggle, Checkbox, CheckboxGroup, Radio, VirtualizedList, Tab, };

package/dist/react/index.d.ts

@@ -1,14 +1,14 @@
-export { default as Avatar } from './avatar';
 export { default as AvatarButton } from './avatarbutton';
-export { default as Badge } from './badge';
+export { default as Avatar } from './avatar';
 export { default as Bullet } from './bullet';
-export { default as Checkbox } from './checkbox';
-export { default as Buttonsimple } from './buttonsimple';
 export { default as Button } from './button';
+export { default as Badge } from './badge';
+export { default as Buttonsimple } from './buttonsimple';
+export { default as Checkbox } from './checkbox';
 export { default as Checkboxgroup } from './checkboxgroup';
 export { default as Divider } from './divider';
-export { default as FormfieldWrapper } from './formfieldwrapper';
 export { default as Icon } from './icon';
+export { default as FormfieldWrapper } from './formfieldwrapper';
 export { default as IconProvider } from './iconprovider';
 export { default as Input } from './input';
 export { default as Link } from './link';
@@ -20,3 +20,4 @@ export { default as Tab } from './tab';
 export { default as Text } from './text';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toggle } from './toggle';
+export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/index.js

@@ -1,14 +1,14 @@
-export { default as Avatar } from './avatar';
 export { default as AvatarButton } from './avatarbutton';
-export { default as Badge } from './badge';
+export { default as Avatar } from './avatar';
 export { default as Bullet } from './bullet';
-export { default as Checkbox } from './checkbox';
-export { default as Buttonsimple } from './buttonsimple';
 export { default as Button } from './button';
+export { default as Badge } from './badge';
+export { default as Buttonsimple } from './buttonsimple';
+export { default as Checkbox } from './checkbox';
 export { default as Checkboxgroup } from './checkboxgroup';
 export { default as Divider } from './divider';
-export { default as FormfieldWrapper } from './formfieldwrapper';
 export { default as Icon } from './icon';
+export { default as FormfieldWrapper } from './formfieldwrapper';
 export { default as IconProvider } from './iconprovider';
 export { default as Input } from './input';
 export { default as Link } from './link';
@@ -20,3 +20,4 @@ export { default as Tab } from './tab';
 export { default as Text } from './text';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toggle } from './toggle';
+export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/virtualizedlist/index.d.ts

@@ -0,0 +1,15 @@
+import Component from '../../components/virtualizedlist';
+/**
+ * `mdc-virtualizedlist` component for creating custom virtualized lists.
+ * IMPORTANT: This component does not create it's own list/list items.
+ * Use the setlistdata callback prop to update client state in order to
+ * Pass list/listitems as a child of this component, which this will virtuailze
+ * This implementation handles dynamic lists as well as fixed sized lists.
+ * Please refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.
+ *
+ * @tagname mdc-virtualizedlist
+ *
+ * @slot - Client side List with nested list items.
+ */
+declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
+export default reactWrapper;

package/dist/react/virtualizedlist/index.js

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { createComponent } from '@lit/react';
+import Component from '../../components/virtualizedlist';
+import { TAG_NAME } from '../../components/virtualizedlist/virtualizedlist.constants';
+/**
+ * `mdc-virtualizedlist` component for creating custom virtualized lists.
+ * IMPORTANT: This component does not create it's own list/list items.
+ * Use the setlistdata callback prop to update client state in order to
+ * Pass list/listitems as a child of this component, which this will virtuailze
+ * This implementation handles dynamic lists as well as fixed sized lists.
+ * Please refer to [Tanstack Virtual Docs](https://tanstack.com/virtual/latest) for more in depth documentation.
+ *
+ * @tagname mdc-virtualizedlist
+ *
+ * @slot - Client side List with nested list items.
+ */
+const reactWrapper = createComponent({
+    tagName: TAG_NAME,
+    elementClass: Component,
+    react: React,
+    events: {},
+    displayName: 'VirtualizedList',
+});
+export default reactWrapper;

package/package.json

@@ -33,8 +33,9 @@
     "@momentum-design/fonts": "*",
     "@momentum-design/icons": "*",
     "@momentum-design/tokens": "*",
+    "@tanstack/lit-virtual": "^3.11.3",
     "lit": "^3.2.0",
     "uuid": "^11.0.5"
   },
-  "version": "0.22.6"
+  "version": "0.23.0"
 }