@ledgerhq/lumen-ui-rnative 0.1.12 → 0.1.14

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/dist/module/lib/Components/MediaBanner/MediaBanner.js +158 -0
  2. package/dist/module/lib/Components/MediaBanner/MediaBanner.js.map +1 -0
  3. package/dist/module/lib/Components/MediaBanner/MediaBanner.mdx +150 -0
  4. package/dist/module/lib/Components/MediaBanner/MediaBanner.stories.js +135 -0
  5. package/dist/module/lib/Components/MediaBanner/MediaBanner.stories.js.map +1 -0
  6. package/dist/module/lib/Components/MediaBanner/MediaBanner.test.js +83 -0
  7. package/dist/module/lib/Components/MediaBanner/MediaBanner.test.js.map +1 -0
  8. package/dist/module/lib/Components/MediaBanner/index.js +5 -0
  9. package/dist/module/lib/Components/MediaBanner/index.js.map +1 -0
  10. package/dist/module/lib/Components/MediaBanner/types.js +4 -0
  11. package/dist/module/lib/Components/MediaBanner/types.js.map +1 -0
  12. package/dist/module/lib/Components/Tag/Tag.js +1 -0
  13. package/dist/module/lib/Components/Tag/Tag.js.map +1 -1
  14. package/dist/module/lib/Components/Tag/Tag.mdx +6 -0
  15. package/dist/module/lib/Components/Tag/Tag.stories.js +10 -0
  16. package/dist/module/lib/Components/Tag/Tag.stories.js.map +1 -1
  17. package/dist/module/lib/Components/index.js +1 -0
  18. package/dist/module/lib/Components/index.js.map +1 -1
  19. package/dist/module/lib/Symbols/Icons/Csv.js +1 -1
  20. package/dist/module/lib/Symbols/Icons/Csv.js.map +1 -1
  21. package/dist/module/lib/Symbols/Icons/TriangleDown.js +47 -0
  22. package/dist/module/lib/Symbols/Icons/TriangleDown.js.map +1 -0
  23. package/dist/module/lib/Symbols/Icons/TriangleUp.js +47 -0
  24. package/dist/module/lib/Symbols/Icons/TriangleUp.js.map +1 -0
  25. package/dist/module/lib/Symbols/index.js +2 -0
  26. package/dist/module/lib/Symbols/index.js.map +1 -1
  27. package/dist/typescript/src/lib/Components/MediaBanner/MediaBanner.d.ts +16 -0
  28. package/dist/typescript/src/lib/Components/MediaBanner/MediaBanner.d.ts.map +1 -0
  29. package/dist/typescript/src/lib/Components/MediaBanner/index.d.ts +3 -0
  30. package/dist/typescript/src/lib/Components/MediaBanner/index.d.ts.map +1 -0
  31. package/dist/typescript/src/lib/Components/MediaBanner/types.d.ts +42 -0
  32. package/dist/typescript/src/lib/Components/MediaBanner/types.d.ts.map +1 -0
  33. package/dist/typescript/src/lib/Components/Tag/Tag.d.ts.map +1 -1
  34. package/dist/typescript/src/lib/Components/index.d.ts +1 -0
  35. package/dist/typescript/src/lib/Components/index.d.ts.map +1 -1
  36. package/dist/typescript/src/lib/Symbols/Icons/TriangleDown.d.ts +35 -0
  37. package/dist/typescript/src/lib/Symbols/Icons/TriangleDown.d.ts.map +1 -0
  38. package/dist/typescript/src/lib/Symbols/Icons/TriangleUp.d.ts +35 -0
  39. package/dist/typescript/src/lib/Symbols/Icons/TriangleUp.d.ts.map +1 -0
  40. package/dist/typescript/src/lib/Symbols/index.d.ts +2 -0
  41. package/dist/typescript/src/lib/Symbols/index.d.ts.map +1 -1
  42. package/package.json +2 -2
  43. package/src/lib/Components/MediaBanner/MediaBanner.mdx +150 -0
  44. package/src/lib/Components/MediaBanner/MediaBanner.stories.tsx +143 -0
  45. package/src/lib/Components/MediaBanner/MediaBanner.test.tsx +77 -0
  46. package/src/lib/Components/MediaBanner/MediaBanner.tsx +172 -0
  47. package/src/lib/Components/MediaBanner/index.ts +2 -0
  48. package/src/lib/Components/MediaBanner/types.ts +44 -0
  49. package/src/lib/Components/Tag/Tag.mdx +6 -0
  50. package/src/lib/Components/Tag/Tag.stories.tsx +8 -0
  51. package/src/lib/Components/Tag/Tag.tsx +3 -1
  52. package/src/lib/Components/index.ts +1 -0
  53. package/src/lib/Symbols/Icons/Csv.tsx +1 -1
  54. package/src/lib/Symbols/Icons/TriangleDown.tsx +42 -0
  55. package/src/lib/Symbols/Icons/TriangleUp.tsx +42 -0
  56. package/src/lib/Symbols/index.ts +2 -0
@@ -0,0 +1,158 @@
1
+ "use strict";
2
+
3
+ import { useEffect, useState } from 'react';
4
+ import { Image, StyleSheet } from 'react-native';
5
+ import { useCommonTranslation } from "../../../i18n/index.js";
6
+ import { useStyleSheet, useTheme } from "../../../styles/index.js";
7
+ import { Close } from "../../Symbols/index.js";
8
+ import { InteractiveIcon } from "../InteractiveIcon/index.js";
9
+ import { Box, LinearGradient, Pressable, Text } from "../Utility/index.js";
10
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
11
+ /**
12
+ * A promotional banner with a background image, title, description, and an optional close button.
13
+ *
14
+ * @see {@link https://ldls.vercel.app/?path=/docs/communication-mediabanner--docs Storybook}
15
+ */
16
+ export function MediaBanner({
17
+ lx,
18
+ style,
19
+ imageUrl,
20
+ onClose,
21
+ closeAccessibilityLabel,
22
+ children,
23
+ ...props
24
+ }) {
25
+ const {
26
+ t: translate
27
+ } = useCommonTranslation();
28
+ const {
29
+ theme: t
30
+ } = useTheme();
31
+ const [imageLoadError, setImageLoadError] = useState(false);
32
+ useEffect(() => {
33
+ setImageLoadError(false);
34
+ }, [imageUrl]);
35
+ const showImage = imageUrl && !imageLoadError;
36
+ const styles = useStyleSheet(t => ({
37
+ container: {
38
+ backgroundColor: t.colors.bg.surface,
39
+ borderRadius: t.borderRadius.md,
40
+ overflow: 'hidden',
41
+ flexDirection: 'row',
42
+ height: t.sizes.s72
43
+ },
44
+ contentWrapper: {
45
+ flex: 1,
46
+ overflow: 'hidden',
47
+ justifyContent: 'center',
48
+ paddingHorizontal: t.spacings.s12,
49
+ paddingVertical: t.spacings.s2
50
+ },
51
+ contentContainer: {
52
+ paddingVertical: t.spacings.s12,
53
+ gap: 4
54
+ },
55
+ closeButton: {
56
+ position: 'absolute',
57
+ top: 8.5,
58
+ right: 8.5
59
+ }
60
+ }), []);
61
+ return /*#__PURE__*/_jsxs(Pressable, {
62
+ lx: lx,
63
+ style: [styles.container, style],
64
+ ...props,
65
+ children: [/*#__PURE__*/_jsx(Box, {
66
+ style: styles.contentWrapper,
67
+ children: /*#__PURE__*/_jsx(Box, {
68
+ style: styles.contentContainer,
69
+ children: children
70
+ })
71
+ }), /*#__PURE__*/_jsxs(Box, {
72
+ style: {
73
+ width: 120
74
+ },
75
+ children: [showImage && /*#__PURE__*/_jsx(Image, {
76
+ source: {
77
+ uri: imageUrl
78
+ },
79
+ style: StyleSheet.absoluteFill,
80
+ resizeMode: "cover",
81
+ onError: () => setImageLoadError(true),
82
+ accessible: false
83
+ }), /*#__PURE__*/_jsx(LinearGradient, {
84
+ direction: "to-topright",
85
+ stops: [{
86
+ color: t.colors.bg.black,
87
+ opacity: 0,
88
+ offset: 0.67
89
+ }, {
90
+ color: t.colors.bg.black,
91
+ opacity: 0.8
92
+ }],
93
+ style: StyleSheet.absoluteFill,
94
+ accessible: false,
95
+ pointerEvents: "none"
96
+ })]
97
+ }), onClose && /*#__PURE__*/_jsx(Box, {
98
+ style: styles.closeButton,
99
+ children: /*#__PURE__*/_jsx(InteractiveIcon, {
100
+ testID: "media-banner-close-button",
101
+ iconType: "stroked",
102
+ appearance: "white",
103
+ onPress: onClose,
104
+ accessibilityLabel: closeAccessibilityLabel || translate('components.banner.closeAriaLabel'),
105
+ children: /*#__PURE__*/_jsx(Close, {
106
+ size: 16
107
+ })
108
+ })
109
+ })]
110
+ });
111
+ }
112
+
113
+ /**
114
+ * The title of the MediaBanner. Clamps at 1 line.
115
+ */
116
+ export function MediaBannerTitle({
117
+ lx,
118
+ style,
119
+ children,
120
+ ...props
121
+ }) {
122
+ const styles = useStyleSheet(t => ({
123
+ title: StyleSheet.flatten([t.typographies.body2SemiBold, {
124
+ color: t.colors.text.base
125
+ }])
126
+ }), []);
127
+ return /*#__PURE__*/_jsx(Text, {
128
+ lx: lx,
129
+ style: [styles.title, style],
130
+ numberOfLines: 1,
131
+ ...props,
132
+ children: children
133
+ });
134
+ }
135
+
136
+ /**
137
+ * The description of the MediaBanner. Clamps at 2 lines.
138
+ */
139
+ export function MediaBannerDescription({
140
+ lx,
141
+ style,
142
+ children,
143
+ ...props
144
+ }) {
145
+ const styles = useStyleSheet(t => ({
146
+ description: StyleSheet.flatten([t.typographies.body3, {
147
+ color: t.colors.text.muted
148
+ }])
149
+ }), []);
150
+ return /*#__PURE__*/_jsx(Text, {
151
+ lx: lx,
152
+ style: [styles.description, style],
153
+ numberOfLines: 2,
154
+ ...props,
155
+ children: children
156
+ });
157
+ }
158
+ //# sourceMappingURL=MediaBanner.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useEffect","useState","Image","StyleSheet","useCommonTranslation","useStyleSheet","useTheme","Close","InteractiveIcon","Box","LinearGradient","Pressable","Text","jsx","_jsx","jsxs","_jsxs","MediaBanner","lx","style","imageUrl","onClose","closeAccessibilityLabel","children","props","t","translate","theme","imageLoadError","setImageLoadError","showImage","styles","container","backgroundColor","colors","bg","surface","borderRadius","md","overflow","flexDirection","height","sizes","s72","contentWrapper","flex","justifyContent","paddingHorizontal","spacings","s12","paddingVertical","s2","contentContainer","gap","closeButton","position","top","right","width","source","uri","absoluteFill","resizeMode","onError","accessible","direction","stops","color","black","opacity","offset","pointerEvents","testID","iconType","appearance","onPress","accessibilityLabel","size","MediaBannerTitle","title","flatten","typographies","body2SemiBold","text","base","numberOfLines","MediaBannerDescription","description","body3","muted"],"sourceRoot":"../../../../../src","sources":["lib/Components/MediaBanner/MediaBanner.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,150 @@
1
+ import { Meta, Story, Canvas, Controls } from '@storybook/addon-docs/blocks';
2
+ import * as MediaBannerStories from './MediaBanner.stories';
3
+ import {
4
+ MediaBanner,
5
+ MediaBannerTitle,
6
+ MediaBannerDescription,
7
+ } from './MediaBanner';
8
+ import { Box } from '../Utility';
9
+ import { CustomTabs, Tab } from '../../../../.storybook/components';
10
+ import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
11
+ import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
12
+
13
+ <Meta title='Components/MediaBanner' of={MediaBannerStories} />
14
+
15
+ # 🖼️ MediaBanner
16
+
17
+ <CustomTabs>
18
+ <Tab label="Overview">
19
+
20
+ ## Introduction
21
+
22
+ MediaBanner is a promotional banner component that displays a background image alongside a title and description. It is designed for marketing or informational content and supports an optional close action for dismissibility.
23
+
24
+ > View in [Figma](https://www.figma.com/design/JxaLVMTWirCpU0rsbZ30k7/2.-Components-Library?node-id=11235-5982&m=dev).
25
+
26
+ ## Anatomy
27
+
28
+ <Canvas of={MediaBannerStories.Base} />
29
+
30
+ - **MediaBanner**: Root pressable container with surface background, rounded corners, and a fixed height
31
+ - **MediaBannerTitle**: The main label of the banner (clamps at 1 line)
32
+ - **MediaBannerDescription**: Additional context below the title (clamps at 2 lines)
33
+ - **Image**: Background image displayed on the right side with a gradient overlay
34
+ - **Close button**: Optional InteractiveIcon rendered in the top-right corner via the `onClose` prop
35
+
36
+ ## Properties
37
+
38
+ ### Overview
39
+
40
+ <Canvas of={MediaBannerStories.Base} />
41
+ <Controls of={MediaBannerStories.Base} />
42
+
43
+ ### Truncation
44
+
45
+ Title clamps at 1 line and description clamps at 2 lines when content overflows.
46
+
47
+ <Canvas of={MediaBannerStories.Truncation} />
48
+
49
+ ### Broken Image
50
+
51
+ When the `imageUrl` fails to load, the broken image is hidden while the gradient overlay and image space are preserved. The banner remains functional and visually consistent.
52
+
53
+ <Canvas of={MediaBannerStories.WithBrokenImage} />
54
+
55
+ ### Dismissible
56
+
57
+ When `onClose` is provided, the close button allows the user to dismiss the banner.
58
+
59
+ <Canvas of={MediaBannerStories.WithClose} />
60
+
61
+ ## Accessibility
62
+
63
+ - The close button uses `InteractiveIcon` with proper press states
64
+ - The root element is a `Pressable` for interactive use cases
65
+ - Title and description use semantic `Text` elements
66
+
67
+ </Tab>
68
+ <Tab label="Implementation">
69
+
70
+ ## Setup
71
+
72
+ Install and set up the library with our [Setup Guide →](?path=/docs/getting-started-setup--docs).
73
+
74
+ ## Basic Usage
75
+
76
+ MediaBanner uses a composite component pattern with `MediaBannerTitle` and `MediaBannerDescription`:
77
+
78
+ ```tsx
79
+ import {
80
+ MediaBanner,
81
+ MediaBannerTitle,
82
+ MediaBannerDescription,
83
+ } from '@ledgerhq/lumen-ui-rnative';
84
+
85
+ function MyComponent() {
86
+ return (
87
+ <MediaBanner imageUrl='https://example.com/promo.jpg'>
88
+ <MediaBannerTitle>Firmware Update</MediaBannerTitle>
89
+ <MediaBannerDescription>
90
+ Keep your Nano updated!
91
+ </MediaBannerDescription>
92
+ </MediaBanner>
93
+ );
94
+ }
95
+ ```
96
+
97
+ ### With Close Button
98
+
99
+ Add an `onClose` callback to make the banner dismissible:
100
+
101
+ ```tsx
102
+ import {
103
+ MediaBanner,
104
+ MediaBannerTitle,
105
+ MediaBannerDescription,
106
+ } from '@ledgerhq/lumen-ui-rnative';
107
+ import { useState } from 'react';
108
+
109
+ function DismissibleBanner() {
110
+ const [isVisible, setIsVisible] = useState(true);
111
+
112
+ if (!isVisible) return null;
113
+
114
+ return (
115
+ <MediaBanner
116
+ imageUrl='https://example.com/promo.jpg'
117
+ onClose={() => setIsVisible(false)}
118
+ >
119
+ <MediaBannerTitle>
120
+ Earn Up to 12% APY With Staking Now!
121
+ </MediaBannerTitle>
122
+ <MediaBannerDescription>
123
+ Put your idle crypto to work. Start staking SOL, ETH, ATOM and more
124
+ directly from Ledger Live
125
+ </MediaBannerDescription>
126
+ </MediaBanner>
127
+ );
128
+ }
129
+ ```
130
+
131
+ ### Layout Adjustments with lx
132
+
133
+ Use the `lx` prop for layout adjustments like margins or positioning:
134
+
135
+ ```tsx
136
+ <MediaBanner
137
+ imageUrl='https://example.com/promo.jpg'
138
+ lx={{ marginTop: 's16', marginBottom: 's8' }}
139
+ >
140
+ <MediaBannerTitle>With Margin</MediaBannerTitle>
141
+ <MediaBannerDescription>
142
+ This banner has layout adjustments via lx.
143
+ </MediaBannerDescription>
144
+ </MediaBanner>
145
+ ```
146
+
147
+ <CommonRulesDoAndDont />
148
+
149
+ </Tab>
150
+ </CustomTabs>
@@ -0,0 +1,135 @@
1
+ "use strict";
2
+
3
+ import { useState } from 'react';
4
+ import { Button } from "../Button/index.js";
5
+ import { Box } from "../Utility/index.js";
6
+ import { MediaBanner, MediaBannerDescription, MediaBannerTitle } from "./MediaBanner.js";
7
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
8
+ const IMAGE_URL = 'https://images.unsplash.com/photo-1663741954108-d15d514529ef';
9
+ const meta = {
10
+ component: MediaBanner,
11
+ title: 'Communication/MediaBanner',
12
+ subcomponents: {
13
+ MediaBannerTitle,
14
+ MediaBannerDescription
15
+ },
16
+ parameters: {
17
+ docs: {
18
+ source: {
19
+ language: 'tsx',
20
+ format: true,
21
+ type: 'code'
22
+ }
23
+ }
24
+ },
25
+ argTypes: {
26
+ imageUrl: {
27
+ control: 'text',
28
+ description: 'URL of the background image'
29
+ },
30
+ onClose: {
31
+ control: 'select',
32
+ description: 'Close action callback',
33
+ options: ['With Close', 'None'],
34
+ mapping: {
35
+ 'With Close': () => {
36
+ console.log('Close clicked');
37
+ },
38
+ None: undefined
39
+ }
40
+ }
41
+ }
42
+ };
43
+ export default meta;
44
+ export const Base = {
45
+ args: {
46
+ imageUrl: IMAGE_URL
47
+ },
48
+ render: args => /*#__PURE__*/_jsx(Box, {
49
+ lx: {
50
+ width: 's400'
51
+ },
52
+ children: /*#__PURE__*/_jsxs(MediaBanner, {
53
+ ...args,
54
+ children: [/*#__PURE__*/_jsx(MediaBannerTitle, {
55
+ children: "Firmware Update"
56
+ }), /*#__PURE__*/_jsx(MediaBannerDescription, {
57
+ children: "Keep your Nano updated!"
58
+ })]
59
+ })
60
+ }),
61
+ parameters: {
62
+ docs: {
63
+ source: {
64
+ code: `
65
+ <MediaBanner imageUrl="https://images.unsplash.com/photo-1663741954108-d15d514529ef">
66
+ <MediaBannerTitle>Firmware Update</MediaBannerTitle>
67
+ <MediaBannerDescription>
68
+ Keep your Nano updated!
69
+ </MediaBannerDescription>
70
+ </MediaBanner>
71
+ `
72
+ }
73
+ }
74
+ }
75
+ };
76
+ export const Truncation = {
77
+ render: () => /*#__PURE__*/_jsx(Box, {
78
+ lx: {
79
+ width: 's400'
80
+ },
81
+ children: /*#__PURE__*/_jsxs(MediaBanner, {
82
+ imageUrl: IMAGE_URL,
83
+ onClose: () => console.log('close'),
84
+ children: [/*#__PURE__*/_jsx(MediaBannerTitle, {
85
+ children: "Earn Up to 12% APY With Staking Now And Much More Rewards Awaiting You"
86
+ }), /*#__PURE__*/_jsx(MediaBannerDescription, {
87
+ children: "Put your idle crypto to work. Start staking SOL, ETH, ATOM and more directly from Ledger Live. Maximize your returns with our secure staking solutions."
88
+ })]
89
+ })
90
+ })
91
+ };
92
+ export const WithBrokenImage = {
93
+ render: () => /*#__PURE__*/_jsx(Box, {
94
+ lx: {
95
+ width: 's400'
96
+ },
97
+ children: /*#__PURE__*/_jsxs(MediaBanner, {
98
+ imageUrl: "https://broken-url.invalid/image.jpg",
99
+ onClose: () => console.log('close'),
100
+ children: [/*#__PURE__*/_jsx(MediaBannerTitle, {
101
+ children: "Sorry!"
102
+ }), /*#__PURE__*/_jsx(MediaBannerDescription, {
103
+ children: "The image failed to load so the banner decided to gracefully hide it."
104
+ })]
105
+ })
106
+ })
107
+ };
108
+ export const WithClose = {
109
+ render: () => {
110
+ const [visible, setVisible] = useState(true);
111
+ if (!visible) {
112
+ return /*#__PURE__*/_jsx(Button, {
113
+ appearance: "transparent",
114
+ size: "sm",
115
+ onPress: () => setVisible(true),
116
+ children: "Show banner"
117
+ });
118
+ }
119
+ return /*#__PURE__*/_jsx(Box, {
120
+ lx: {
121
+ width: 's400'
122
+ },
123
+ children: /*#__PURE__*/_jsxs(MediaBanner, {
124
+ imageUrl: IMAGE_URL,
125
+ onClose: () => setVisible(false),
126
+ children: [/*#__PURE__*/_jsx(MediaBannerTitle, {
127
+ children: "Earn Up to 12% APY With Staking Now!"
128
+ }), /*#__PURE__*/_jsx(MediaBannerDescription, {
129
+ children: "Put your idle crypto to work. Start staking SOL, ETH, ATOM and more directly from Ledger Live"
130
+ })]
131
+ })
132
+ });
133
+ }
134
+ };
135
+ //# sourceMappingURL=MediaBanner.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useState","Button","Box","MediaBanner","MediaBannerDescription","MediaBannerTitle","jsx","_jsx","jsxs","_jsxs","IMAGE_URL","meta","component","title","subcomponents","parameters","docs","source","language","format","type","argTypes","imageUrl","control","description","onClose","options","mapping","With Close","console","log","None","undefined","Base","args","render","lx","width","children","code","Truncation","WithBrokenImage","WithClose","visible","setVisible","appearance","size","onPress"],"sourceRoot":"../../../../../src","sources":["lib/Components/MediaBanner/MediaBanner.stories.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,83 @@
1
+ "use strict";
2
+
3
+ import { describe, it, expect, jest } from '@jest/globals';
4
+ import { ledgerLiveThemes } from '@ledgerhq/lumen-design-core';
5
+ import { fireEvent, render } from '@testing-library/react-native';
6
+ import { ThemeProvider } from "../ThemeProvider/ThemeProvider.js";
7
+ import { MediaBanner, MediaBannerTitle, MediaBannerDescription } from "./MediaBanner.js";
8
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
9
+ const TestWrapper = ({
10
+ children
11
+ }) => /*#__PURE__*/_jsx(ThemeProvider, {
12
+ themes: ledgerLiveThemes,
13
+ colorScheme: "dark",
14
+ locale: "en",
15
+ children: children
16
+ });
17
+ const IMAGE_URL = 'https://example.com/image.jpg';
18
+ describe('MediaBanner', () => {
19
+ it('should render title and description', () => {
20
+ const {
21
+ getByText
22
+ } = render(/*#__PURE__*/_jsx(TestWrapper, {
23
+ children: /*#__PURE__*/_jsxs(MediaBanner, {
24
+ imageUrl: IMAGE_URL,
25
+ children: [/*#__PURE__*/_jsx(MediaBannerTitle, {
26
+ children: "Banner Title"
27
+ }), /*#__PURE__*/_jsx(MediaBannerDescription, {
28
+ children: "Banner description"
29
+ })]
30
+ })
31
+ }));
32
+ getByText('Banner Title');
33
+ getByText('Banner description');
34
+ });
35
+ it('should call onClose when close button is pressed', () => {
36
+ const handleClose = jest.fn();
37
+ const {
38
+ getByTestId
39
+ } = render(/*#__PURE__*/_jsx(TestWrapper, {
40
+ children: /*#__PURE__*/_jsx(MediaBanner, {
41
+ imageUrl: IMAGE_URL,
42
+ onClose: handleClose,
43
+ children: /*#__PURE__*/_jsx(MediaBannerTitle, {
44
+ children: "Title"
45
+ })
46
+ })
47
+ }));
48
+ const closeButton = getByTestId('media-banner-close-button');
49
+ expect(closeButton).toBeTruthy();
50
+ fireEvent.press(closeButton);
51
+ expect(handleClose).toHaveBeenCalledTimes(1);
52
+ });
53
+ it('should apply surface background color', () => {
54
+ const {
55
+ getByTestId
56
+ } = render(/*#__PURE__*/_jsx(TestWrapper, {
57
+ children: /*#__PURE__*/_jsx(MediaBanner, {
58
+ testID: "media-banner",
59
+ imageUrl: IMAGE_URL,
60
+ children: /*#__PURE__*/_jsx(MediaBannerTitle, {
61
+ children: "Title"
62
+ })
63
+ })
64
+ }));
65
+ const banner = getByTestId('media-banner');
66
+ expect(banner.props.style.backgroundColor).toBe(ledgerLiveThemes.dark.colors.bg.surface);
67
+ });
68
+ it('should render with imageUrl prop', () => {
69
+ const {
70
+ getByTestId
71
+ } = render(/*#__PURE__*/_jsx(TestWrapper, {
72
+ children: /*#__PURE__*/_jsx(MediaBanner, {
73
+ testID: "media-banner",
74
+ imageUrl: IMAGE_URL,
75
+ children: /*#__PURE__*/_jsx(MediaBannerTitle, {
76
+ children: "Title"
77
+ })
78
+ })
79
+ }));
80
+ expect(getByTestId('media-banner')).toBeTruthy();
81
+ });
82
+ });
83
+ //# sourceMappingURL=MediaBanner.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["describe","it","expect","jest","ledgerLiveThemes","fireEvent","render","ThemeProvider","MediaBanner","MediaBannerTitle","MediaBannerDescription","jsx","_jsx","jsxs","_jsxs","TestWrapper","children","themes","colorScheme","locale","IMAGE_URL","getByText","imageUrl","handleClose","fn","getByTestId","onClose","closeButton","toBeTruthy","press","toHaveBeenCalledTimes","testID","banner","props","style","backgroundColor","toBe","dark","colors","bg","surface"],"sourceRoot":"../../../../../src","sources":["lib/Components/MediaBanner/MediaBanner.test.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ export * from "./MediaBanner.js";
4
+ export * from "./types.js";
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["lib/Components/MediaBanner/index.ts"],"mappings":";;AAAA,cAAc,kBAAe;AAC7B,cAAc,YAAS","ignoreList":[]}
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+
3
+ export {};
4
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["lib/Components/MediaBanner/types.ts"],"mappings":"","ignoreList":[]}
@@ -132,6 +132,7 @@ export const Tag = ({
132
132
  style: styles.icon
133
133
  }), /*#__PURE__*/_jsx(Text, {
134
134
  style: styles.text,
135
+ numberOfLines: 1,
135
136
  children: label
136
137
  })]
137
138
  });
@@ -1 +1 @@
1
- {"version":3,"names":["useDisabledContext","StyleSheet","Text","useStyleSheet","Box","jsx","_jsx","jsxs","_jsxs","useStyles","appearance","size","disabled","t","bgColors","base","colors","bg","mutedTransparent","gray","accent","success","error","warning","textColors","text","muted","onAccent","sizeStyles","md","height","sizes","s24","paddingHorizontal","spacings","s8","paddingVertical","s4","sm","s20","s2","textTypography","typographies","body3","body4","root","flatten","flexDirection","alignItems","justifyContent","gap","borderRadius","xs","backgroundColor","color","icon","flexShrink","iconSizeMap","Tag","label","disabledProp","lx","style","ref","props","consumerName","mergeWith","styles","IconComponent","iconSize","children","displayName"],"sourceRoot":"../../../../../src","sources":["lib/Components/Tag/Tag.tsx"],"mappings":";;AAAA,SAASA,kBAAkB,QAAQ,8BAA8B;AACjE,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAC/C,SAASC,aAAa,QAAQ,0BAAiB;AAE/C,SAASC,GAAG,QAAQ,qBAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAMjC,MAAMC,SAAS,GAAGA,CAAC;EACjBC,UAAU;EACVC,IAAI;EACJC;AAKF,CAAC,KAAK;EACJ,OAAOT,aAAa,CACjBU,CAAC,IAAK;IACL,MAAMC,QAAoC,GAAG;MAC3CC,IAAI,EAAEF,CAAC,CAACG,MAAM,CAACC,EAAE,CAACC,gBAAgB;MAClCC,IAAI,EAAEN,CAAC,CAACG,MAAM,CAACC,EAAE,CAACC,gBAAgB;MAClCE,MAAM,EAAEP,CAAC,CAACG,MAAM,CAACC,EAAE,CAACG,MAAM;MAC1BC,OAAO,EAAER,CAAC,CAACG,MAAM,CAACC,EAAE,CAACI,OAAO;MAC5BC,KAAK,EAAET,CAAC,CAACG,MAAM,CAACC,EAAE,CAACK,KAAK;MACxBC,OAAO,EAAEV,CAAC,CAACG,MAAM,CAACC,EAAE,CAACM;IACvB,CAAC;IAED,MAAMC,UAAsC,GAAG;MAC7CT,IAAI,EAAEF,CAAC,CAACG,MAAM,CAACS,IAAI,CAACV,IAAI;MACxBI,IAAI,EAAEN,CAAC,CAACG,MAAM,CAACS,IAAI,CAACC,KAAK;MACzBN,MAAM,EAAEP,CAAC,CAACG,MAAM,CAACS,IAAI,CAACE,QAAQ;MAC9BN,OAAO,EAAER,CAAC,CAACG,MAAM,CAACS,IAAI,CAACJ,OAAO;MAC9BC,KAAK,EAAET,CAAC,CAACG,MAAM,CAACS,IAAI,CAACH,KAAK;MAC1BC,OAAO,EAAEV,CAAC,CAACG,MAAM,CAACS,IAAI,CAACF;IACzB,CAAC;IAED,MAAMK,UAGL,GAAG;MACFC,EAAE,EAAE;QACFC,MAAM,EAAEjB,CAAC,CAACkB,KAAK,CAACC,GAAG;QACnBC,iBAAiB,EAAEpB,CAAC,CAACqB,QAAQ,CAACC,EAAE;QAChCC,eAAe,EAAEvB,CAAC,CAACqB,QAAQ,CAACG;MAC9B,CAAC;MACDC,EAAE,EAAE;QACFR,MAAM,EAAEjB,CAAC,CAACkB,KAAK,CAACQ,GAAG;QACnBN,iBAAiB,EAAEpB,CAAC,CAACqB,QAAQ,CAACG,EAAE;QAChCD,eAAe,EAAEvB,CAAC,CAACqB,QAAQ,CAACM;MAC9B;IACF,CAAC;IAED,MAAMC,cAAc,GAClB9B,IAAI,KAAK,IAAI,GAAGE,CAAC,CAAC6B,YAAY,CAACC,KAAK,GAAG9B,CAAC,CAAC6B,YAAY,CAACE,KAAK;IAE7D,OAAO;MACLC,IAAI,EAAE5C,UAAU,CAAC6C,OAAO,CAAC,CACvB;QACEC,aAAa,EAAE,KAAK;QACpBC,UAAU,EAAE,QAAQ;QACpBC,cAAc,EAAE,QAAQ;QACxBC,GAAG,EAAErC,CAAC,CAACqB,QAAQ,CAACG,EAAE;QAClBc,YAAY,EAAEtC,CAAC,CAACsC,YAAY,CAACC,EAAE;QAC/BC,eAAe,EAAEvC,QAAQ,CAACJ,UAAU,CAAC;QACrC,GAAGkB,UAAU,CAACjB,IAAI;MACpB,CAAC,EACDC,QAAQ,IAAI;QACVyC,eAAe,EAAExC,CAAC,CAACG,MAAM,CAACC,EAAE,CAACL;MAC/B,CAAC,CACF,CAAC;MACFa,IAAI,EAAExB,UAAU,CAAC6C,OAAO,CAAC,CACvBL,cAAc,EACd;QACEa,KAAK,EAAE9B,UAAU,CAACd,UAAU;MAC9B,CAAC,EACDE,QAAQ,IAAI;QACV0C,KAAK,EAAEzC,CAAC,CAACG,MAAM,CAACS,IAAI,CAACb;MACvB,CAAC,CACF,CAAC;MACF2C,IAAI,EAAEtD,UAAU,CAAC6C,OAAO,CAAC,CACvB;QACEU,UAAU,EAAE,CAAC;QACbF,KAAK,EAAE9B,UAAU,CAACd,UAAU;MAC9B,CAAC,EACDE,QAAQ,IAAI;QACV0C,KAAK,EAAEzC,CAAC,CAACG,MAAM,CAACS,IAAI,CAACb;MACvB,CAAC,CACF;IACH,CAAC;EACH,CAAC,EACD,CAACF,UAAU,EAAEC,IAAI,EAAEC,QAAQ,CAC7B,CAAC;AACH,CAAC;AAED,MAAM6C,WAAmC,GAAG;EAC1C5B,EAAE,EAAE,EAAE;EACNS,EAAE,EAAE;AACN,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMoB,GAAG,GAAGA,CAAC;EAClBhD,UAAU,GAAG,QAAQ;EACrBC,IAAI,GAAG,IAAI;EACX4C,IAAI;EACJI,KAAK;EACL/C,QAAQ,EAAEgD,YAAY,GAAG,KAAK;EAC9BC,EAAE,GAAG,CAAC,CAAC;EACPC,KAAK;EACLC,GAAG;EACH,GAAGC;AACK,CAAC,KAAK;EACd,MAAMpD,QAAQ,GAAGZ,kBAAkB,CAAC;IAClCiE,YAAY,EAAE,KAAK;IACnBC,SAAS,EAAE;MAAEtD,QAAQ,EAAEgD;IAAa;EACtC,CAAC,CAAC;EACF,MAAMO,MAAM,GAAG1D,SAAS,CAAC;IAAEC,UAAU;IAAEC,IAAI;IAAEC,QAAQ,EAAE,CAAC,CAACA;EAAS,CAAC,CAAC;EAEpE,MAAMwD,aAAa,GAAGb,IAAI;EAC1B,MAAMc,QAAQ,GAAGZ,WAAW,CAAC9C,IAAI,CAAC;EAElC,oBACEH,KAAA,CAACJ,GAAG;IACF2D,GAAG,EAAEA,GAAI;IACTF,EAAE,EAAEA,EAAG;IACPC,KAAK,EAAE7D,UAAU,CAAC6C,OAAO,CAAC,CAACqB,MAAM,CAACtB,IAAI,EAAEiB,KAAK,CAAC,CAAE;IAAA,GAC5CE,KAAK;IAAAM,QAAA,GAERF,aAAa,iBAAI9D,IAAA,CAAC8D,aAAa;MAACzD,IAAI,EAAE0D,QAAS;MAACP,KAAK,EAAEK,MAAM,CAACZ;IAAK,CAAE,CAAC,eACvEjD,IAAA,CAACJ,IAAI;MAAC4D,KAAK,EAAEK,MAAM,CAAC1C,IAAK;MAAA6C,QAAA,EAAEX;IAAK,CAAO,CAAC;EAAA,CACrC,CAAC;AAEV,CAAC;AAEDD,GAAG,CAACa,WAAW,GAAG,KAAK","ignoreList":[]}
1
+ {"version":3,"names":["useDisabledContext","StyleSheet","Text","useStyleSheet","Box","jsx","_jsx","jsxs","_jsxs","useStyles","appearance","size","disabled","t","bgColors","base","colors","bg","mutedTransparent","gray","accent","success","error","warning","textColors","text","muted","onAccent","sizeStyles","md","height","sizes","s24","paddingHorizontal","spacings","s8","paddingVertical","s4","sm","s20","s2","textTypography","typographies","body3","body4","root","flatten","flexDirection","alignItems","justifyContent","gap","borderRadius","xs","backgroundColor","color","icon","flexShrink","iconSizeMap","Tag","label","disabledProp","lx","style","ref","props","consumerName","mergeWith","styles","IconComponent","iconSize","children","numberOfLines","displayName"],"sourceRoot":"../../../../../src","sources":["lib/Components/Tag/Tag.tsx"],"mappings":"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","ignoreList":[]}
@@ -47,6 +47,12 @@ Tags can be displayed with or without an icon.
47
47
 
48
48
  <Canvas of={TagStories.ContentTypeShowcase} />
49
49
 
50
+ ### Truncation
51
+
52
+ When a tag's label exceeds the available space, the text is automatically truncated with an ellipsis.
53
+
54
+ <Canvas of={TagStories.TruncateShowcase} />
55
+
50
56
  ### Accessibility
51
57
 
52
58
  To be implemented:
@@ -140,4 +140,14 @@ export const ContentTypeShowcase = {
140
140
  })]
141
141
  })
142
142
  };
143
+ export const TruncateShowcase = {
144
+ render: () => /*#__PURE__*/_jsx(Box, {
145
+ lx: {
146
+ width: 's176'
147
+ },
148
+ children: /*#__PURE__*/_jsx(Tag, {
149
+ label: "Very long custom Tag text that should truncate"
150
+ })
151
+ })
152
+ };
143
153
  //# sourceMappingURL=Tag.stories.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["Check","Box","Tag","jsx","_jsx","jsxs","_jsxs","meta","component","title","argTypes","appearance","control","options","size","label","icon","type","description","Base","args","render","undefined","AppearanceShowcase","lx","flexDirection","gap","children","disabled","SizeShowcase","alignItems","ContentTypeShowcase"],"sourceRoot":"../../../../../src","sources":["lib/Components/Tag/Tag.stories.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["Check","Box","Tag","jsx","_jsx","jsxs","_jsxs","meta","component","title","argTypes","appearance","control","options","size","label","icon","type","description","Base","args","render","undefined","AppearanceShowcase","lx","flexDirection","gap","children","disabled","SizeShowcase","alignItems","ContentTypeShowcase","TruncateShowcase","width"],"sourceRoot":"../../../../../src","sources":["lib/Components/Tag/Tag.stories.tsx"],"mappings":"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","ignoreList":[]}