Hidden

Overview

Converts a string to camelCase format by splitting on various separators and joining words with the first word in lowercase and subsequent words capitalized.

camelCase(/str/);

Features

• Converts strings to camelCase format
• Handles multiple separator types (spaces, dashes, underscores, dots, etc.)
• First word remains lowercase, subsequent words are capitalized
• Filters out empty segments automatically
• Returns empty string for invalid inputs
• Supports complex separator combinations
• Simple and intuitive API
• Comprehensive testing

Arguments

Arg	Type	Default Value	Required
str	string	-	Yes

Usage

Use the camelCase() function to convert strings to camelCase format.

import { camelCase } from '@inpulse-ui/utils';

const result = camelCase('hello world');
console.log(result); // "helloWorld"

Handles various separator types:

console.log(camelCase('hello-world')); // "helloWorld"
console.log(camelCase('hello_world')); // "helloWorld"
console.log(camelCase('hello.world')); // "helloWorld"
console.log(camelCase('hello,world')); // "helloWorld"
console.log(camelCase('hello;world')); // "helloWorld"

Works with complex separator combinations:

console.log(camelCase('hello-world_test.case')); // "helloWorldTestCase"
console.log(camelCase('user-profile/settings')); // "userProfileSettings"
console.log(camelCase('api_key-config.json')); // "apiKeyConfigJson"

Handles multiple words:

console.log(camelCase('first second third')); // "firstSecondThird"
console.log(camelCase('my-awesome-function-name')); // "myAwesomeFunctionName"
console.log(camelCase('user_profile_settings_page')); // "userProfileSettingsPage"

Returns empty string for invalid inputs:

console.log(camelCase('')); // ""
console.log(camelCase(null)); // ""
console.log(camelCase(undefined)); // ""
console.log(camelCase(123)); // ""

Examples

API property name conversion:

const apiFields = [
  'user_name',
  'email_address',
  'phone_number',
  'created_at',
  'last_login'
];

const camelCaseFields = apiFields.map(field => camelCase(field));
console.log(camelCaseFields);
// ['userName', 'emailAddress', 'phoneNumber', 'createdAt', 'lastLogin']

// Convert API response to camelCase
function convertToCamelCase(obj) {
  const result = {};
  Object.keys(obj).forEach(key => {
    result[camelCase(key)] = obj[key];
  });
  return result;
}

const apiResponse = {
  user_id: 123,
  first_name: 'John',
  last_name: 'Doe',
  email_address: 'john@example.com'
};

const camelCaseResponse = convertToCamelCase(apiResponse);
console.log(camelCaseResponse);
// { userId: 123, firstName: 'John', lastName: 'Doe', emailAddress: 'john@example.com' }

CSS class name conversion:

const cssClasses = [
  'btn-primary',
  'nav-item-active',
  'form-control-lg',
  'text-center-mobile'
];

const jsPropertyNames = cssClasses.map(className => camelCase(className));
console.log(jsPropertyNames);
// ['btnPrimary', 'navItemActive', 'formControlLg', 'textCenterMobile']

Form field processing - converting HTML form field names to JavaScript object properties:

import { camelCase } from '@inpulse-ui/utils';

// HTML form with various naming conventions
const formData = new FormData();
formData.append('first-name', 'John');
formData.append('last_name', 'Doe');
formData.append('email.address', 'john@example.com');
formData.append('phone_number', '+1234567890');
formData.append('birth-date', '1990-01-01');
formData.append('accept-terms', 'true');

// Convert form data to camelCase object
function processFormData(formData) {
  const result = {};

  for (const [key, value] of formData.entries()) {
    const camelKey = camelCase(key);
    result[camelKey] = value;
  }

  return result;
}

const processedData = processFormData(formData);
console.log(processedData);
// {
//   firstName: 'John',
//   lastName: 'Doe',
//   emailAddress: 'john@example.com',
//   phoneNumber: '+1234567890',
//   birthDate: '1990-01-01',
//   acceptTerms: 'true'
// }

// Use processed data in JavaScript application
const user = {
  id: generateUserId(),
  ...processedData,
  createdAt: new Date().toISOString()
};

console.log('User object:', user);