@ledgerhq/lumen-ui-rnative 0.1.37 → 0.1.39

package/src/lib/Components/Select/Select.stories.tsx

@@ -1,266 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import { useState } from 'react';
-import { Box } from '../Utility';
-import { GlobalSelectBottomSheet } from './GlobalSelectBottomSheet';
-import {
-  Select,
-  SelectTrigger,
-  SelectValue,
-  SelectContent,
-  SelectItem,
-  SelectItemText,
-  SelectGroup,
-  SelectLabel,
-  SelectSeparator,
-} from './Select';
-
-const meta: Meta<typeof Select> = {
-  component: Select,
-  tags: ['deprecated'],
-  subcomponents: {
-    SelectTrigger,
-    SelectValue,
-    SelectContent,
-    SelectItem,
-    SelectItemText,
-    SelectGroup,
-    SelectLabel,
-    SelectSeparator,
-  },
-  title: 'Selection/Select',
-  parameters: {
-    layout: 'fullscreen',
-  },
-};
-
-export default meta;
-type Story = StoryObj<typeof Select>;
-
-export const Base: Story = {
-  render: () => {
-    const [value, setValue] = useState<string>('apple');
-
-    return (
-      <>
-        <Box
-          style={{
-            flex: 1,
-            minHeight: 400,
-            padding: 24,
-            width: '100%',
-          }}
-        >
-          <Box style={{ width: '100%', maxWidth: 400 }}>
-            <Select value={value} onValueChange={setValue}>
-              <SelectTrigger label='Choose a fruit'>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value='apple'>
-                  <SelectItemText>Apple</SelectItemText>
-                </SelectItem>
-                <SelectItem value='banana'>
-                  <SelectItemText>Banana</SelectItemText>
-                </SelectItem>
-                <SelectItem value='orange'>
-                  <SelectItemText>Orange</SelectItemText>
-                </SelectItem>
-                <SelectItem value='grape'>
-                  <SelectItemText>Grape</SelectItemText>
-                </SelectItem>
-                <SelectItem value='mango'>
-                  <SelectItemText>Mango</SelectItemText>
-                </SelectItem>
-              </SelectContent>
-            </Select>
-          </Box>
-        </Box>
-        <GlobalSelectBottomSheet />
-      </>
-    );
-  },
-};
-
-export const WithGroups: Story = {
-  render: () => {
-    const [value, setValue] = useState<string>('btc');
-
-    return (
-      <>
-        <Box
-          style={{
-            flex: 1,
-            minHeight: 400,
-            padding: 24,
-            width: '100%',
-          }}
-        >
-          <Box style={{ width: '100%', maxWidth: 400 }}>
-            <Select value={value} onValueChange={setValue}>
-              <SelectTrigger label='Select cryptocurrency'>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectGroup>
-                  <SelectLabel>Popular</SelectLabel>
-                  <SelectItem value='btc'>
-                    <SelectItemText>Bitcoin</SelectItemText>
-                  </SelectItem>
-                  <SelectItem value='eth'>
-                    <SelectItemText>Ethereum</SelectItemText>
-                  </SelectItem>
-                </SelectGroup>
-                <SelectSeparator />
-                <SelectGroup>
-                  <SelectLabel>Altcoins</SelectLabel>
-                  <SelectItem value='ada'>
-                    <SelectItemText>Cardano</SelectItemText>
-                  </SelectItem>
-                  <SelectItem value='dot'>
-                    <SelectItemText>Polkadot</SelectItemText>
-                  </SelectItem>
-                  <SelectItem value='sol'>
-                    <SelectItemText>Solana</SelectItemText>
-                  </SelectItem>
-                </SelectGroup>
-              </SelectContent>
-            </Select>
-          </Box>
-        </Box>
-        <GlobalSelectBottomSheet />
-      </>
-    );
-  },
-};
-
-export const WithDisabledItems: Story = {
-  render: () => {
-    const [value, setValue] = useState<string>('option1');
-
-    return (
-      <>
-        <Box
-          style={{
-            flex: 1,
-            minHeight: 400,
-            padding: 24,
-            width: '100%',
-          }}
-        >
-          <Box style={{ width: '100%', maxWidth: 400 }}>
-            <Select value={value} onValueChange={setValue}>
-              <SelectTrigger label='Select option'>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value='option1'>
-                  <SelectItemText>Option 1</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option2' disabled>
-                  <SelectItemText>Option 2 (Disabled)</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option3'>
-                  <SelectItemText>Option 3</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option4' disabled>
-                  <SelectItemText>Option 4 (Disabled)</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option5'>
-                  <SelectItemText>Option 5</SelectItemText>
-                </SelectItem>
-              </SelectContent>
-            </Select>
-          </Box>
-        </Box>
-        <GlobalSelectBottomSheet />
-      </>
-    );
-  },
-};
-
-export const DisabledSelect: Story = {
-  render: () => {
-    const [value, setValue] = useState<string>('apple');
-
-    return (
-      <>
-        <Box
-          style={{
-            flex: 1,
-            minHeight: 400,
-            padding: 24,
-            width: '100%',
-          }}
-        >
-          <Box style={{ width: '100%', maxWidth: 400 }}>
-            <Select value={value} onValueChange={setValue} disabled>
-              <SelectTrigger label='Disabled select'>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value='apple'>
-                  <SelectItemText>Apple</SelectItemText>
-                </SelectItem>
-                <SelectItem value='banana'>
-                  <SelectItemText>Banana</SelectItemText>
-                </SelectItem>
-                <SelectItem value='orange'>
-                  <SelectItemText>Orange</SelectItemText>
-                </SelectItem>
-              </SelectContent>
-            </Select>
-          </Box>
-        </Box>
-        <GlobalSelectBottomSheet />
-      </>
-    );
-  },
-};
-
-export const WithChangeCallback: Story = {
-  render: () => {
-    const [value, setValue] = useState<string>('option1');
-
-    return (
-      <>
-        <Box
-          style={{
-            flex: 1,
-            minHeight: 400,
-            padding: 24,
-            width: '100%',
-          }}
-        >
-          <Box style={{ width: '100%', maxWidth: 400 }}>
-            <Select
-              value={value}
-              onValueChange={(newValue) => {
-                setValue(newValue);
-                alert(`Selected: ${newValue}`);
-              }}
-              onOpenChange={(open) => {
-                alert(`Select ${open ? 'opened' : 'closed'}`);
-              }}
-            >
-              <SelectTrigger label='Select with callbacks'>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value='option1'>
-                  <SelectItemText>Option 1</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option2'>
-                  <SelectItemText>Option 2</SelectItemText>
-                </SelectItem>
-                <SelectItem value='option3'>
-                  <SelectItemText>Option 3</SelectItemText>
-                </SelectItem>
-              </SelectContent>
-            </Select>
-          </Box>
-        </Box>
-        <GlobalSelectBottomSheet />
-      </>
-    );
-  },
-};

package/src/lib/Components/Select/Select.test.tsx

@@ -1,117 +0,0 @@
-import { describe, it, expect, jest } from '@jest/globals';
-import { ledgerLiveThemes } from '@ledgerhq/lumen-design-core';
-import { render, fireEvent } from '@testing-library/react-native';
-import { ThemeProvider } from '../ThemeProvider/ThemeProvider';
-import { GlobalSelectBottomSheet } from './GlobalSelectBottomSheet';
-import { GlobalSelectProvider } from './GlobalSelectContext';
-import {
-  Select,
-  SelectTrigger,
-  SelectValue,
-  SelectContent,
-  SelectItem,
-  SelectItemText,
-} from './Select';
-
-const TestWrapper = ({ children }: { children: React.ReactNode }) => (
-  <ThemeProvider themes={ledgerLiveThemes} colorScheme='dark' locale='en'>
-    <GlobalSelectProvider>
-      {children}
-      <GlobalSelectBottomSheet />
-    </GlobalSelectProvider>
-  </ThemeProvider>
-);
-
-describe('Select', () => {
-  it('renders and displays selected value', () => {
-    const { getByText } = render(
-      <TestWrapper>
-        <Select value='option1'>
-          <SelectTrigger label='Choose option'>
-            <SelectValue />
-          </SelectTrigger>
-          <SelectContent>
-            <SelectItem value='option1'>
-              <SelectItemText>Option 1</SelectItemText>
-            </SelectItem>
-            <SelectItem value='option2'>
-              <SelectItemText>Option 2</SelectItemText>
-            </SelectItem>
-          </SelectContent>
-        </Select>
-      </TestWrapper>,
-    );
-
-    expect(getByText('Choose option')).toBeTruthy();
-    expect(getByText('Option 1')).toBeTruthy();
-  });
-
-  it('opens and selects item on press', () => {
-    const onValueChange = jest.fn();
-    const { getByText, getByTestId } = render(
-      <TestWrapper>
-        <Select onValueChange={onValueChange}>
-          <SelectTrigger testID='select-trigger'>
-            <SelectValue />
-          </SelectTrigger>
-          <SelectContent>
-            <SelectItem value='option1'>
-              <SelectItemText>Option 1</SelectItemText>
-            </SelectItem>
-            <SelectItem value='option2'>
-              <SelectItemText>Option 2</SelectItemText>
-            </SelectItem>
-          </SelectContent>
-        </Select>
-      </TestWrapper>,
-    );
-
-    fireEvent.press(getByTestId('select-trigger'));
-    fireEvent.press(getByText('Option 2'));
-
-    expect(onValueChange).toHaveBeenCalledWith('option2');
-  });
-
-  it('respects disabled state', () => {
-    const onOpenChange = jest.fn();
-    const { getByTestId } = render(
-      <TestWrapper>
-        <Select disabled onOpenChange={onOpenChange}>
-          <SelectTrigger testID='select-trigger'>
-            <SelectValue />
-          </SelectTrigger>
-          <SelectContent>
-            <SelectItem value='option1'>
-              <SelectItemText>Option 1</SelectItemText>
-            </SelectItem>
-          </SelectContent>
-        </Select>
-      </TestWrapper>,
-    );
-
-    fireEvent.press(getByTestId('select-trigger'));
-    expect(onOpenChange).not.toHaveBeenCalled();
-  });
-
-  it('requires GlobalSelectProvider', () => {
-    const originalError = console.error;
-    console.error = jest.fn();
-
-    expect(() => {
-      render(
-        <Select>
-          <SelectTrigger>
-            <SelectValue />
-          </SelectTrigger>
-          <SelectContent>
-            <SelectItem value='option1'>
-              <SelectItemText>Option 1</SelectItemText>
-            </SelectItem>
-          </SelectContent>
-        </Select>,
-      );
-    }).toThrow();
-
-    console.error = originalError;
-  });
-});