@ledgerhq/lumen-utils-shared 0.0.11

package/src/lib/input-formatter/text-formatter.ts

@@ -0,0 +1,95 @@
+import { formatThousands } from './format-thousands';
+
+export type TextFormatterOptions = {
+  /** Whether to allow decimal values */
+  allowDecimals?: boolean;
+  /** Whether to format with space-separated thousands */
+  thousandsSeparator?: boolean;
+  /** Maximum length for integer part (before decimal) */
+  maxIntegerLength?: number;
+  /** Maximum length for decimal part (after decimal) */
+  maxDecimalLength?: number;
+};
+
+/**
+ * Formats and validates numeric input text for amount inputs.
+ * Handles decimal formatting, leading zeros, and prevents multiple decimal points.
+ * Can optionally format with space-separated thousands.
+ * @returns Formatted and cleaned numeric string
+ *
+ * @example
+ * textFormatter('01') // '1'
+ * textFormatter('.5') // '0.5'
+ * textFormatter('1.2.3') // '1.23'
+ * textFormatter('1,5') // '1.5'
+ * textFormatter('abc123') // '123'
+ * textFormatter('1000000', { thousandsSeparator: true }) // '1 000 000'
+ * textFormatter('1234.5678', { thousandsSeparator: true }) // '1 234.5678'
+ * textFormatter('123456789012', { maxIntegerLength: 9 }) // '123456789'
+ * textFormatter('123.123456', { maxDecimalLength: 2 }) // '123.12'
+ */
+export function textFormatter(
+  /** The input value to format */
+  value: string,
+  options: TextFormatterOptions = {},
+): string {
+  const {
+    allowDecimals = true,
+    thousandsSeparator = true,
+    maxIntegerLength = 9,
+    maxDecimalLength = 9,
+  } = options;
+  // Normalize input: convert comma to dot, remove non-digit/non-dot characters
+  const normalizedValue = value.replace(',', '.').replace(/[^\d.]/g, '');
+  let cleaned = normalizedValue;
+
+  // Remove leading zeros (except when followed by dot)
+  cleaned = cleaned.replace(/^0+(?=\d)/, '');
+
+  if (!allowDecimals) {
+    // Integer-only: remove any non-digit and apply max length
+    cleaned = cleaned.replace(/\D/g, '');
+    if (maxIntegerLength > 0 && cleaned.length > maxIntegerLength) {
+      cleaned = cleaned.slice(0, maxIntegerLength);
+    }
+    return thousandsSeparator ? formatThousands(cleaned) : cleaned;
+  }
+
+  // Handle single dot input as "0."
+  if (cleaned === '.') {
+    cleaned = '0.';
+  }
+
+  const firstDot = cleaned.indexOf('.');
+  if (firstDot !== -1) {
+    // Split integer and decimal parts
+    let integerPart = cleaned.slice(0, firstDot);
+    let decimalPart = cleaned.slice(firstDot + 1).replace(/\./g, '');
+
+    // Apply length limits
+    if (maxIntegerLength > 0 && integerPart.length > maxIntegerLength) {
+      integerPart = integerPart.slice(0, maxIntegerLength);
+    }
+    decimalPart = decimalPart.slice(0, maxDecimalLength);
+
+    // Ensure integer part is not empty
+    if (integerPart === '') integerPart = '0';
+
+    // Preserve trailing dot if user is typing
+    const hasTrailingDot =
+      normalizedValue.endsWith('.') || cleaned.endsWith('.');
+    cleaned =
+      decimalPart.length > 0
+        ? `${integerPart}.${decimalPart}`
+        : hasTrailingDot
+          ? `${integerPart}.`
+          : integerPart;
+  } else {
+    // No decimal point, just apply integer length limit
+    if (maxIntegerLength > 0 && cleaned.length > maxIntegerLength) {
+      cleaned = cleaned.slice(0, maxIntegerLength);
+    }
+  }
+
+  return thousandsSeparator ? formatThousands(cleaned) : cleaned;
+}

package/src/lib/is-text-children/index.ts

@@ -0,0 +1 @@
+export * from './is-text-children';

package/src/lib/is-text-children/is-text-children.test.ts

@@ -0,0 +1,33 @@
+import React, { ReactNode } from 'react';
+import { describe, it, expect } from 'vitest';
+import { isTextChildren } from './is-text-children';
+
+describe('isAllowedTextChildren', () => {
+  type Case = { name: string; input: unknown; expected: boolean };
+
+  const cases: Case[] = [
+    { name: 'string', input: 'hello', expected: true },
+    { name: 'empty string', input: '', expected: true },
+    { name: 'number', input: 42, expected: true },
+    { name: 'zero', input: 0, expected: true },
+    { name: 'NaN', input: Number.NaN, expected: true },
+    { name: 'array of strings', input: ['a', 'b'], expected: true },
+    {
+      name: 'React element',
+      input: React.createElement('View', null),
+      expected: false,
+    },
+    { name: 'null', input: null, expected: false },
+    { name: 'undefined', input: undefined, expected: false },
+    { name: 'array of object and string', input: [{}, 'b'], expected: false },
+    { name: 'boolean true', input: true, expected: false },
+    { name: 'boolean false', input: false, expected: false },
+    { name: 'object', input: { a: 1 }, expected: false },
+    { name: 'function', input: () => 'x', expected: false },
+    { name: 'symbol', input: Symbol('s'), expected: false },
+  ];
+
+  it.each(cases)('$name', ({ input, expected }) => {
+    expect(isTextChildren(input as ReactNode)).toBe(expected);
+  });
+});

package/src/lib/is-text-children/is-text-children.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+
+const isStringOrNumber = (element: ReactNode) =>
+  typeof element === 'string' || typeof element === 'number';
+
+export const isTextChildren = (element: ReactNode) => {
+  const isArray = Array.isArray(element);
+  return isArray ? element.every(isStringOrNumber) : isStringOrNumber(element);
+};

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

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

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

@@ -0,0 +1,85 @@
+import { describe, it, expect } from 'vitest';
+import { toPascalCase } from './string-utils.js';
+
+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 already PascalCase strings', () => {
+    expect(toPascalCase('ArrowUp')).toBe('Arrowup');
+    expect(toPascalCase('ExternalLink')).toBe('Externallink');
+    // Note: This behavior converts already PascalCase to lowercase except first letter
+    // because it treats the whole string as one word without separators
+  });
+
+  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 strings with special characters mixed with separators', () => {
+    expect(toPascalCase('icon-24px')).toBe('Icon24px');
+    expect(toPascalCase('api_v2.0')).toBe('ApiV2.0');
+  });
+
+  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/string-utils/string-utils.ts

@@ -0,0 +1,11 @@
+/**
+ * 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/use-merge-ref/index.ts

@@ -0,0 +1 @@
+export * from './use-merge-ref';

package/src/lib/use-merge-ref/use-merge-ref.ts

@@ -0,0 +1,41 @@
+import { Ref, useMemo, type RefCallback } from 'react';
+
+type PossibleRef<T> = Ref<T> | undefined;
+type RefCleanup = void | (() => void);
+
+export function assignRef<T>(ref: PossibleRef<T>, value: T | null): RefCleanup {
+  if (typeof ref === 'function') {
+    return ref(value);
+  } else if (typeof ref === 'object' && ref !== null && 'current' in ref) {
+    (ref as { current: T | null }).current = value;
+  }
+}
+
+export function mergeRefs<T>(...refs: PossibleRef<T>[]): RefCallback<T> {
+  const cleanupMap = new Map<PossibleRef<T>, () => void>();
+
+  return (node: T | null) => {
+    if (node === null) {
+      refs.forEach((ref) => {
+        const cleanup = cleanupMap.get(ref);
+        if (typeof cleanup === 'function') {
+          cleanup();
+        }
+        assignRef(ref, null);
+      });
+      cleanupMap.clear();
+      return;
+    }
+
+    refs.forEach((ref) => {
+      const cleanup = assignRef(ref, node);
+      if (typeof cleanup === 'function') {
+        cleanupMap.set(ref, cleanup);
+      }
+    });
+  };
+}
+
+export function useMergedRef<T>(...refs: PossibleRef<T>[]): RefCallback<T> {
+  return useMemo(() => mergeRefs<T>(...refs), refs);
+}

package/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

package/tsconfig.lib.json

@@ -0,0 +1,29 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "rootDir": "src",
+    "outDir": "dist",
+    "tsBuildInfoFile": "dist/tsconfig.lib.tsbuildinfo",
+    "emitDeclarationOnly": false,
+    "jsx": "react-jsx",
+    "forceConsistentCasingInFileNames": true,
+    "types": ["node"]
+  },
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "references": [],
+  "exclude": [
+    "vite.config.ts",
+    "vite.config.mts",
+    "vitest.config.ts",
+    "vitest.config.mts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.js",
+    "src/**/*.spec.js",
+    "src/**/*.test.jsx",
+    "src/**/*.spec.jsx"
+  ]
+}

package/tsconfig.spec.json

@@ -0,0 +1,37 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/vitest",
+    "types": [
+      "vitest/globals",
+      "vitest/importMeta",
+      "vite/client",
+      "node",
+      "vitest"
+    ],
+    "jsx": "react-jsx",
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "forceConsistentCasingInFileNames": true
+  },
+  "include": [
+    "vite.config.ts",
+    "vite.config.mts",
+    "vitest.config.ts",
+    "vitest.config.mts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.js",
+    "src/**/*.spec.js",
+    "src/**/*.test.jsx",
+    "src/**/*.spec.jsx",
+    "src/**/*.d.ts"
+  ],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    }
+  ]
+}

package/vite.config.ts

@@ -0,0 +1,40 @@
+import { join } from 'path';
+import react from '@vitejs/plugin-react';
+import { defineConfig } from 'vite';
+import type { LibraryFormats } from 'vite';
+import dts from 'vite-plugin-dts';
+
+export default defineConfig(() => ({
+  root: __dirname,
+  cacheDir: '../../node_modules/.vite/libs/utils-shared',
+  plugins: [
+    react(),
+    dts({
+      entryRoot: 'src',
+      tsconfigPath: join(__dirname, 'tsconfig.lib.json'),
+    }),
+  ],
+  build: {
+    lib: {
+      entry: join(__dirname, 'src/index.ts'),
+      name: 'utils-shared',
+      fileName: 'index',
+      formats: ['es' as LibraryFormats],
+    },
+    rollupOptions: {
+      external: ['clsx', 'tailwind-merge', 'react', 'react/jsx-runtime'],
+    },
+  },
+  test: {
+    watch: false,
+    globals: true,
+    silent: true,
+    environment: 'jsdom',
+    include: ['src/**/*.test.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
+    reporters: ['default'],
+    coverage: {
+      reportsDirectory: './test-output/vitest/coverage',
+      provider: 'v8' as const,
+    },
+  },
+}));