@ledgerhq/lumen-ui-rnative 0.0.46 → 0.0.47

package/src/lib/Components/ListItem/types.ts

@@ -0,0 +1,121 @@
+import React from 'react';
+import {
+  LumenTextStyle,
+  StyledPressableProps,
+  StyledTextProps,
+  StyledViewProps,
+} from '../../../styles';
+import { DiscriminatedSpotProps } from '../Spot';
+
+/**
+ * Context value for passing state to sub-components
+ */
+export type ListItemContextValue = {
+  disabled?: boolean;
+};
+
+/**
+ * Props for the ListItem root component
+ */
+export type ListItemProps = {
+  /**
+   * The content of the list item (ListItemLeading, ListItemTrailing)
+   */
+  children: React.ReactNode;
+  /**
+   * Whether the list item is disabled.
+   */
+  disabled?: boolean;
+  /**
+   * Callback function when the list item is pressed.
+   */
+  onPress?: StyledPressableProps['onPress'];
+} & Omit<StyledPressableProps, 'disabled' | 'children'>;
+
+/**
+ * Props for the ListItemLeading component
+ */
+export type ListItemLeadingProps = {
+  /**
+   * The content of the leading area (visual element + ListItemContent)
+   */
+  children: React.ReactNode;
+} & Omit<StyledViewProps, 'children'>;
+
+/**
+ * Props for the ListItemContent component
+ */
+export type ListItemContentProps = {
+  /**
+   * The content (ListItemTitle, ListItemDescription)
+   */
+  children: React.ReactNode;
+} & Omit<StyledViewProps, 'children'>;
+
+/**
+ * Props for the ListItemTitle component
+ */
+export type ListItemTitleProps = {
+  /**
+   * The title text or custom content
+   */
+  children: React.ReactNode;
+} & Omit<StyledTextProps, 'children'>;
+
+/**
+ * Props for the ListItemDescription component
+ */
+export type ListItemDescriptionProps = {
+  /**
+   * The description text or custom content
+   */
+  children: React.ReactNode;
+} & Omit<StyledTextProps, 'children'>;
+
+/**
+ * Props for the ListItemTrailing component
+ */
+export type ListItemTrailingProps = {
+  /**
+   * The trailing content (icons, switches, values, etc.)
+   */
+  children: React.ReactNode;
+} & Omit<StyledViewProps, 'children'>;
+
+/**
+ * Props for the ListItemTruncate component
+ * Used to truncate text that should when ListItemDescription or ListItemTitle contain custom content
+ */
+export type ListItemTruncateProps = {
+  /**
+   * The text content to truncate
+   */
+  children: string;
+  /**
+   * The variant determines typography and color styling.
+   * Use 'title' inside ListItemTitle and 'description' inside ListItemDescription.
+   * @default 'description'
+   */
+  variant?: 'title' | 'description';
+} & Omit<StyledTextProps, 'children'>;
+
+/**
+ * Props for the ListItemSpot component
+ * Spot adapter that inherits disabled state from parent ListItem
+ */
+export type ListItemSpotProps = DiscriminatedSpotProps &
+  Omit<StyledViewProps, 'children'>;
+
+/**
+ * Props for the ListItemIcon component
+ */
+export type ListItemIconProps = {
+  /**
+   * The icon component to render
+   */
+  icon: React.ComponentType<any>;
+  /**
+   * Optional color override. If not provided, uses theme color with disabled state handling.
+   */
+  color?: LumenTextStyle['color'];
+} & Omit<StyledViewProps, 'children'>;

package/src/lib/Components/Spot/types.ts

@@ -41,7 +41,11 @@ type StatusSpotProps = {
   appearance: Exclude<SpotAppearance, 'icon' | 'number'>;
 };
 
-type DiscriminatedSpotProps = IconSpotProps | NumberSpotProps | StatusSpotProps;
+export type DiscriminatedSpotProps =
+  | IconSpotProps
+  | NumberSpotProps
+  | StatusSpotProps;
+
 export type SpotSize = 48 | 56 | 72;
 
 export type SpotProps = {

package/src/lib/Components/Switch/Switch.mdx

@@ -1,6 +1,7 @@
 import { Meta, Story, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as SwitchStories from './Switch.stories';
 import { Switch } from './Switch';
+import { Box } from '../Utility';
 import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';

package/src/lib/utils/index.ts

@@ -1,7 +1,6 @@
 export * from './constants';
 export * from './components';
 export * from './react';
-export * from './use-controllable-state';
-export * from './string-utils';
-export * from './use-event';
-export * from './start-transition';
+export * from './useControllableState';
+export * from './useEvent';
+export * from './startTransition';

package/src/lib/utils/react/index.ts

@@ -1 +1 @@
-export * from './extract-text-from-children';
+export * from './extractTextFromChildren';

package/src/lib/utils/startTransition/index.ts

@@ -0,0 +1 @@
+export * from './startTransition';

package/src/lib/utils/useControllableState/index.ts

@@ -0,0 +1 @@
+export * from './useControllableState';

package/src/lib/utils/{use-controllable-state/use-controllable-state.ts → useControllableState/useControllableState.ts}

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { startTransition } from '../start-transition';
-import { useEvent } from '../use-event';
+import { startTransition } from '../startTransition';
+import { useEvent } from '../useEvent';
 
 // can configure to allow most-recent-wins or prop-wins
 // defaults to prop-wins

package/src/lib/utils/useEvent/index.ts

@@ -0,0 +1,2 @@
+export * from './useEvent';
+export * from './useGet';

package/src/lib/utils/{use-event/use-event.ts → useEvent/useEvent.ts}

@@ -1,4 +1,4 @@
-import { useGet } from './use-get';
+import { useGet } from './useGet';
 
 type AnyFunction = (...args: any[]) => any;
 

package/src/styles/provider/LumenStyleSheetProvider.tsx

@@ -5,11 +5,10 @@ import {
   ColorSchemeName,
   useColorScheme as useReactNativeColorScheme,
 } from 'react-native';
-import { RuntimeConstants } from '../../lib/utils';
-import { useControllableState } from '../../lib/utils/use-controllable-state/use-controllable-state';
+import { RuntimeConstants, useControllableState } from '../../lib/utils';
 import { createStylesheetTheme } from '../theme/createStylesheetTheme';
 import { type LumenStyleSheetTheme } from '../types';
-import { LumenStyleSheetProviderProps } from './types';
+import { type LumenStyleSheetProviderProps } from './types';
 
 const DARK_MODE = 'dark';
 const LIGHT_MODE = 'light';

package/dist/src/lib/Components/ListItem/ListItem.types.d.ts

@@ -1,31 +0,0 @@
-import { StyledPressableProps } from '../../../styles';
-export type ListItemProps = {
-    /**
-     * The main title of the list item.
-     */
-    title: string;
-    /**
-     * Optional descriptive text below the title.
-     */
-    description?: string;
-    /**
-     * Optional content to display on the left, usually a Spot component.
-     * @example leadingContent={<Spot appearance="icon" icon={Settings} />}
-     */
-    leadingContent?: React.ReactNode;
-    /**
-     * Optional Tag component displayed next to the description.
-     * @example descriptionTag={<Tag label="New" appearance="accent" size="sm" />}
-     */
-    descriptionTag?: React.ReactNode;
-    /**
-     * Custom content to render on the right side of the list item.
-     * @example trailingContent={<Icon />}
-     */
-    trailingContent?: React.ReactNode;
-    /**
-     * Whether the list item is disabled.
-     */
-    disabled?: boolean;
-} & Omit<StyledPressableProps, 'disabled'>;
-//# sourceMappingURL=ListItem.types.d.ts.map

package/dist/src/lib/Components/ListItem/ListItem.types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ListItem.types.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/ListItem/ListItem.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC;;;OAGG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC"}

package/dist/src/lib/utils/react/extract-text-from-children.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"extract-text-from-children.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/react/extract-text-from-children.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;GAIG;AACH,wBAAgB,uBAAuB,CACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,EACzB,iBAAiB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAC3C,MAAM,CAoBR"}

package/dist/src/lib/utils/start-transition/index.d.ts

@@ -1,2 +0,0 @@
-export * from './start-transition';
-//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/utils/start-transition/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/start-transition/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}

package/dist/src/lib/utils/start-transition/index.js

@@ -1 +0,0 @@
-export * from './start-transition';

package/dist/src/lib/utils/start-transition/start-transition.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"start-transition.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/start-transition/start-transition.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,GAAI,UAAU,KAAK,CAAC,kBAAkB,KAAG,IAQpE,CAAC"}

package/dist/src/lib/utils/string-utils.d.ts

@@ -1,6 +0,0 @@
-/**
- * Transforms a kebab-case or snake_case string into a PascalCase string.
- * e.g., 'arrow-up' -> 'ArrowUp'
- */
-export declare function toPascalCase(str: string): string;
-//# sourceMappingURL=string-utils.d.ts.map

package/dist/src/lib/utils/string-utils.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"string-utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/utils/string-utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAMhD"}

package/dist/src/lib/utils/string-utils.js

@@ -1,12 +0,0 @@
-/**
- * Transforms a kebab-case or snake_case string into a PascalCase string.
- * e.g., 'arrow-up' -> 'ArrowUp'
- */
-export function toPascalCase(str) {
-    if (!str)
-        return '';
-    return str
-        .split(/[-_ ]+/)
-        .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
-        .join('');
-}

package/dist/src/lib/utils/use-controllable-state/index.d.ts

@@ -1,2 +0,0 @@
-export * from './use-controllable-state';
-//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/utils/use-controllable-state/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/use-controllable-state/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC"}

package/dist/src/lib/utils/use-controllable-state/index.js

@@ -1 +0,0 @@
-export * from './use-controllable-state';

package/dist/src/lib/utils/use-controllable-state/use-controllable-state.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-controllable-state.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/use-controllable-state/use-controllable-state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,KAAK,QAAQ,CAAC,CAAC,IACX,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC,GACnB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;AAI5C;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,EAAE,EACtC,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,QAAsB,EACtB,UAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;IACrB,WAAW,EAAE,CAAC,CAAC;IACf,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;IACvB,QAAQ,CAAC,EAAE,WAAW,GAAG,kBAAkB,CAAC;IAC5C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAsC/C"}

package/dist/src/lib/utils/use-event/index.d.ts

@@ -1,3 +0,0 @@
-export * from './use-event';
-export * from './use-get';
-//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/utils/use-event/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/use-event/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC"}

package/dist/src/lib/utils/use-event/index.js

@@ -1,2 +0,0 @@
-export * from './use-event';
-export * from './use-get';

package/dist/src/lib/utils/use-event/use-event.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-event.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/use-event/use-event.ts"],"names":[],"mappings":"AAEA,KAAK,WAAW,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC;AAE3C,wBAAgB,QAAQ,CAAC,CAAC,SAAS,WAAW,EAAE,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,CAE/D"}

package/dist/src/lib/utils/use-event/use-get.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-get.d.ts","sourceRoot":"","sources":["../../../../../src/lib/utils/use-event/use-get.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,wBAAgB,MAAM,CAAC,CAAC,EACtB,YAAY,EAAE,CAAC,EACf,YAAY,CAAC,EAAE,GAAG,EAClB,iBAAiB,CAAC,EAAE,OAAO,GAC1B,MAAM,CAAC,CAYT"}

package/src/lib/Components/ListItem/ListItem.types.ts

@@ -1,31 +0,0 @@
-import { StyledPressableProps } from '../../../styles';
-
-export type ListItemProps = {
-  /**
-   * The main title of the list item.
-   */
-  title: string;
-  /**
-   * Optional descriptive text below the title.
-   */
-  description?: string;
-  /**
-   * Optional content to display on the left, usually a Spot component.
-   * @example leadingContent={<Spot appearance="icon" icon={Settings} />}
-   */
-  leadingContent?: React.ReactNode;
-  /**
-   * Optional Tag component displayed next to the description.
-   * @example descriptionTag={<Tag label="New" appearance="accent" size="sm" />}
-   */
-  descriptionTag?: React.ReactNode;
-  /**
-   * Custom content to render on the right side of the list item.
-   * @example trailingContent={<Icon />}
-   */
-  trailingContent?: React.ReactNode;
-  /**
-   * Whether the list item is disabled.
-   */
-  disabled?: boolean;
-} & Omit<StyledPressableProps, 'disabled'>;

package/src/lib/utils/start-transition/index.ts

@@ -1 +0,0 @@
-export * from './start-transition';

package/src/lib/utils/string-utils.test.ts

@@ -1,73 +0,0 @@
-import { describe, it, expect } from '@jest/globals';
-import { toPascalCase } from './string-utils';
-
-describe('toPascalCase', () => {
-  it('should convert kebab-case to PascalCase', () => {
-    expect(toPascalCase('arrow-up')).toBe('ArrowUp');
-    expect(toPascalCase('chevron-down')).toBe('ChevronDown');
-    expect(toPascalCase('external-link')).toBe('ExternalLink');
-    expect(toPascalCase('settings-alt-2')).toBe('SettingsAlt2');
-  });
-
-  it('should convert snake_case to PascalCase', () => {
-    expect(toPascalCase('arrow_up')).toBe('ArrowUp');
-    expect(toPascalCase('chevron_down')).toBe('ChevronDown');
-    expect(toPascalCase('external_link')).toBe('ExternalLink');
-    expect(toPascalCase('settings_alt_2')).toBe('SettingsAlt2');
-  });
-
-  it('should convert space-separated words to PascalCase', () => {
-    expect(toPascalCase('arrow up')).toBe('ArrowUp');
-    expect(toPascalCase('chevron down')).toBe('ChevronDown');
-    expect(toPascalCase('external link')).toBe('ExternalLink');
-  });
-
-  it('should handle mixed separators', () => {
-    expect(toPascalCase('arrow-up_down')).toBe('ArrowUpDown');
-    expect(toPascalCase('external_link-icon')).toBe('ExternalLinkIcon');
-    expect(toPascalCase('settings alt-2_variant')).toBe('SettingsAlt2Variant');
-  });
-
-  it('should handle single words', () => {
-    expect(toPascalCase('arrow')).toBe('Arrow');
-    expect(toPascalCase('icon')).toBe('Icon');
-    expect(toPascalCase('button')).toBe('Button');
-  });
-
-  it('should handle empty string', () => {
-    expect(toPascalCase('')).toBe('');
-  });
-
-  it('should handle strings with numbers', () => {
-    expect(toPascalCase('icon-24')).toBe('Icon24');
-    expect(toPascalCase('chart_1')).toBe('Chart1');
-    expect(toPascalCase('version 2')).toBe('Version2');
-    expect(toPascalCase('api-v1-endpoint')).toBe('ApiV1Endpoint');
-  });
-
-  it('should handle multiple consecutive separators', () => {
-    expect(toPascalCase('arrow--up')).toBe('ArrowUp');
-    expect(toPascalCase('external__link')).toBe('ExternalLink');
-    expect(toPascalCase('icon  button')).toBe('IconButton');
-    expect(toPascalCase('mixed-_-separators')).toBe('MixedSeparators');
-  });
-
-  it('should handle separators at the beginning and end', () => {
-    expect(toPascalCase('-arrow-up')).toBe('ArrowUp');
-    expect(toPascalCase('_external-link_')).toBe('ExternalLink');
-    expect(toPascalCase(' icon button ')).toBe('IconButton');
-    expect(toPascalCase('--start-end--')).toBe('StartEnd');
-  });
-
-  it('should handle case variations in input', () => {
-    expect(toPascalCase('ARROW-UP')).toBe('ArrowUp');
-    expect(toPascalCase('ExTerNaL-LiNk')).toBe('ExternalLink');
-    expect(toPascalCase('mixed_CASE_string')).toBe('MixedCaseString');
-  });
-
-  it('should handle single character segments', () => {
-    expect(toPascalCase('a-b-c')).toBe('ABC');
-    expect(toPascalCase('x_y_z')).toBe('XYZ');
-    expect(toPascalCase('i o s')).toBe('IOS');
-  });
-});

package/src/lib/utils/string-utils.ts

@@ -1,11 +0,0 @@
-/**
- * Transforms a kebab-case or snake_case string into a PascalCase string.
- * e.g., 'arrow-up' -> 'ArrowUp'
- */
-export function toPascalCase(str: string): string {
-  if (!str) return '';
-  return str
-    .split(/[-_ ]+/)
-    .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
-    .join('');
-}

package/src/lib/utils/use-controllable-state/index.ts

@@ -1 +0,0 @@
-export * from './use-controllable-state';

package/src/lib/utils/use-event/index.ts

@@ -1,2 +0,0 @@
-export * from './use-event';
-export * from './use-get';