@momentum-design/components 0.71.1 → 0.72.0

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.
package/dist/index.d.ts CHANGED
@@ -54,6 +54,7 @@ import Tooltip from './components/tooltip';
54
54
  import VirtualizedList from './components/virtualizedlist';
55
55
  import MenuItemRadio from './components/menuitemradio';
56
56
  import MenuItemCheckbox from './components/menuitemcheckbox';
57
+ import Animation from './components/animation';
57
58
  import type { BadgeType } from './components/badge/badge.types';
58
59
  import type { ButtonColor, ButtonVariant, IconButtonSize, PillButtonSize } from './components/button/button.types';
59
60
  import type { PopoverPlacement } from './components/popover/popover.types';
@@ -61,6 +62,6 @@ import type { SpinnerSize, SpinnerVariant } from './components/spinner/spinner.t
61
62
  import type { TextType } from './components/text/text.types';
62
63
  import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
63
64
  import { BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES } from './components/button/button.constants';
64
- export { AlertChip, Appheader, Avatar, AvatarButton, Badge, Brandvisual, Bullet, Button, ButtonLink, Card, CardButton, CardCheckbox, CardRadio, Checkbox, Chip, Coachmark, Dialog, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, Linksimple, List, ListItem, Marker, MenuItem, OptGroup, Option, Popover, Presence, Progressbar, Progressspinner, Radio, RadioGroup, ScreenreaderAnnouncer, Searchfield, Select, Spinner, Tab, TabList, Text, Textarea, ThemeProvider, Toggle, VirtualizedList, StaticCheckbox, StaticRadio, StaticToggle, ToggleTip, Tooltip, MenuItemRadio, MenuItemCheckbox, };
65
+ export { AlertChip, Animation, Appheader, Avatar, AvatarButton, Badge, Brandvisual, Bullet, Button, ButtonLink, Card, CardButton, CardCheckbox, CardRadio, Checkbox, Chip, Coachmark, Dialog, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, Linksimple, List, ListItem, Marker, MenuItem, OptGroup, Option, Popover, Presence, Progressbar, Progressspinner, Radio, RadioGroup, ScreenreaderAnnouncer, Searchfield, Select, Spinner, Tab, TabList, Text, Textarea, ThemeProvider, Toggle, VirtualizedList, StaticCheckbox, StaticRadio, StaticToggle, ToggleTip, Tooltip, MenuItemRadio, MenuItemCheckbox, };
65
66
  export type { TextType, SpinnerSize, SpinnerVariant, PopoverPlacement, BadgeType, IconButtonSize, PillButtonSize, ButtonVariant, ButtonColor, };
66
67
  export { inMemoryCache, webAPIIconsCache, BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES };
package/dist/index.js CHANGED
@@ -55,10 +55,11 @@ import Tooltip from './components/tooltip';
55
55
  import VirtualizedList from './components/virtualizedlist';
56
56
  import MenuItemRadio from './components/menuitemradio';
57
57
  import MenuItemCheckbox from './components/menuitemcheckbox';
58
+ import Animation from './components/animation';
58
59
  import { inMemoryCache, webAPIIconsCache } from './utils/icon-cache';
59
60
  // Constants / Utils Imports
60
61
  import { BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES, } from './components/button/button.constants';
61
62
  // Components Exports
62
- export { AlertChip, Appheader, Avatar, AvatarButton, Badge, Brandvisual, Bullet, Button, ButtonLink, Card, CardButton, CardCheckbox, CardRadio, Checkbox, Chip, Coachmark, Dialog, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, Linksimple, List, ListItem, Marker, MenuItem, OptGroup, Option, Popover, Presence, Progressbar, Progressspinner, Radio, RadioGroup, ScreenreaderAnnouncer, Searchfield, Select, Spinner, Tab, TabList, Text, Textarea, ThemeProvider, Toggle, VirtualizedList, StaticCheckbox, StaticRadio, StaticToggle, ToggleTip, Tooltip, MenuItemRadio, MenuItemCheckbox, };
63
+ export { AlertChip, Animation, Appheader, Avatar, AvatarButton, Badge, Brandvisual, Bullet, Button, ButtonLink, Card, CardButton, CardCheckbox, CardRadio, Checkbox, Chip, Coachmark, Dialog, Divider, FilterChip, FormfieldGroup, Icon, IconProvider, Input, InputChip, Link, Linksimple, List, ListItem, Marker, MenuItem, OptGroup, Option, Popover, Presence, Progressbar, Progressspinner, Radio, RadioGroup, ScreenreaderAnnouncer, Searchfield, Select, Spinner, Tab, TabList, Text, Textarea, ThemeProvider, Toggle, VirtualizedList, StaticCheckbox, StaticRadio, StaticToggle, ToggleTip, Tooltip, MenuItemRadio, MenuItemCheckbox, };
63
64
  // Constants / Utils Exports
64
65
  export { inMemoryCache, webAPIIconsCache, BUTTON_COLORS, BUTTON_VARIANTS, ICON_BUTTON_SIZES, PILL_BUTTON_SIZES };
@@ -0,0 +1,18 @@
1
+ import { type EventName } from '@lit/react';
2
+ import Component from '../../components/animation';
3
+ /**
4
+ * The `mdc-animation` component is a wrapper around the Lottie animation library.
5
+ * It fetches the animation data dynamically based on the provided name and renders it.
6
+ * This is a display only component that does not have any interactive functionality.
7
+ * From accessibility perspective, (by default) it is a decorative image component.
8
+ *
9
+ * @tagname mdc-animation
10
+ *
11
+ * @event complete - (React: onComplete) This event is dispatched when all animation loops completed
12
+ * @event error - (React: onError) This event is dispatched when animation loading failed
13
+ */
14
+ declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
15
+ onComplete: EventName<Event>;
16
+ onError: EventName<Event>;
17
+ }>;
18
+ export default reactWrapper;
@@ -0,0 +1,26 @@
1
+ import * as React from 'react';
2
+ import { createComponent } from '@lit/react';
3
+ import Component from '../../components/animation';
4
+ import { TAG_NAME } from '../../components/animation/animation.constants';
5
+ /**
6
+ * The `mdc-animation` component is a wrapper around the Lottie animation library.
7
+ * It fetches the animation data dynamically based on the provided name and renders it.
8
+ * This is a display only component that does not have any interactive functionality.
9
+ * From accessibility perspective, (by default) it is a decorative image component.
10
+ *
11
+ * @tagname mdc-animation
12
+ *
13
+ * @event complete - (React: onComplete) This event is dispatched when all animation loops completed
14
+ * @event error - (React: onError) This event is dispatched when animation loading failed
15
+ */
16
+ const reactWrapper = createComponent({
17
+ tagName: TAG_NAME,
18
+ elementClass: Component,
19
+ react: React,
20
+ events: {
21
+ onComplete: 'complete',
22
+ onError: 'error',
23
+ },
24
+ displayName: 'Animation',
25
+ });
26
+ export default reactWrapper;
@@ -1,5 +1,6 @@
1
- export { default as AlertChip } from './alertchip';
1
+ export { default as Animation } from './animation';
2
2
  export { default as Appheader } from './appheader';
3
+ export { default as AlertChip } from './alertchip';
3
4
  export { default as Avatar } from './avatar';
4
5
  export { default as AvatarButton } from './avatarbutton';
5
6
  export { default as Badge } from './badge';
@@ -23,8 +24,8 @@ export { default as FormfieldWrapper } from './formfieldwrapper';
23
24
  export { default as Icon } from './icon';
24
25
  export { default as IconProvider } from './iconprovider';
25
26
  export { default as Input } from './input';
26
- export { default as InputChip } from './inputchip';
27
27
  export { default as Link } from './link';
28
+ export { default as InputChip } from './inputchip';
28
29
  export { default as Linksimple } from './linksimple';
29
30
  export { default as List } from './list';
30
31
  export { default as ListItem } from './listitem';
@@ -1,5 +1,6 @@
1
- export { default as AlertChip } from './alertchip';
1
+ export { default as Animation } from './animation';
2
2
  export { default as Appheader } from './appheader';
3
+ export { default as AlertChip } from './alertchip';
3
4
  export { default as Avatar } from './avatar';
4
5
  export { default as AvatarButton } from './avatarbutton';
5
6
  export { default as Badge } from './badge';
@@ -23,8 +24,8 @@ export { default as FormfieldWrapper } from './formfieldwrapper';
23
24
  export { default as Icon } from './icon';
24
25
  export { default as IconProvider } from './iconprovider';
25
26
  export { default as Input } from './input';
26
- export { default as InputChip } from './inputchip';
27
27
  export { default as Link } from './link';
28
+ export { default as InputChip } from './inputchip';
28
29
  export { default as Linksimple } from './linksimple';
29
30
  export { default as List } from './list';
30
31
  export { default as ListItem } from './listitem';
package/package.json CHANGED
@@ -31,13 +31,15 @@
31
31
  "@floating-ui/dom": "^1.6.12",
32
32
  "@lit/context": "^1.1.2",
33
33
  "@lit/react": "^1.0.5",
34
+ "@momentum-design/animations": "*",
34
35
  "@momentum-design/brand-visuals": "*",
35
36
  "@momentum-design/fonts": "*",
36
37
  "@momentum-design/icons": "*",
37
38
  "@momentum-design/tokens": "*",
38
39
  "@tanstack/lit-virtual": "^3.11.3",
39
40
  "lit": "^3.2.0",
41
+ "lottie-web": "^5.12.2",
40
42
  "uuid": "^11.0.5"
41
43
  },
42
- "version": "0.71.1"
44
+ "version": "0.72.0"
43
45
  }