← Back to utilities
string

kebab-case

Converts a string to kebab-case. Transforms a string by converting it to lowercase and replacing spaces, underscores, and camelCase boundaries with hyphens. Useful for creating URL slugs, CSS class names, and file names.

Installation

npx fragmen add string/kebab-case

Source Code

/**
 * Converts a string to kebab-case.
 *
 * Transforms a string by converting it to lowercase and replacing spaces, underscores,
 * and camelCase boundaries with hyphens. Useful for creating URL slugs, CSS class names,
 * and file names.
 *
 * @tags pure, string-manipulation, formatting
 * @param {string} str The string to convert
 * @returns {string} The kebab-case version of the string
 *
 * @example
 * ```typescript
 * kebabCase('Hello World'); // 'hello-world'
 * kebabCase('firstName'); // 'first-name'
 * kebabCase('XMLHttpRequest'); // 'xml-http-request'
 * kebabCase('snake_case_string'); // 'snake-case-string'
 * kebabCase('  multiple   spaces  '); // 'multiple-spaces'
 * kebabCase('already-kebab-case'); // 'already-kebab-case'
 * kebabCase(''); // ''
 * ```
 */
export function kebabCase(str: string): string {
  if (typeof str !== 'string') {
    return '';
  }

  return (
    str
      .trim()
      // Handle consecutive uppercase letters followed by lowercase: XMLHttp -> XML-Http
      .replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
      // Handle lowercase followed by uppercase: camelCase -> camel-Case
      .replace(/([a-z])([A-Z])/g, '$1-$2')
      // Handle digit followed by letter: version2Update -> version2-Update
      .replace(/([0-9])([A-Z])/g, '$1-$2')
      // Replace underscores with hyphens
      .replace(/_/g, '-')
      // Replace one or more spaces with single hyphen
      .replace(/\s+/g, '-')
      // Convert to lowercase
      .toLowerCase()
      // Remove multiple consecutive hyphens
      .replace(/-+/g, '-')
      // Remove leading/trailing hyphens
      .replace(/^-+|-+$/g, '')
  );
}

Examples

kebabCase('Hello World'); // 'hello-world'
kebabCase('firstName'); // 'first-name'
kebabCase('XMLHttpRequest'); // 'xml-http-request'
kebabCase('snake_case_string'); // 'snake-case-string'
kebabCase('  multiple   spaces  '); // 'multiple-spaces'
kebabCase('already-kebab-case'); // 'already-kebab-case'
kebabCase(''); // ''

Related Utilities

camel-case

string

Converts a string to camelCase. Transforms a string by removing spaces, underscores, and hyphens, then capitalizing the first letter of each word except the first one. Commonly used for JavaScript variable names, object properties, and function names.

#pure#string-manipulation#formatting

capitalize

string

Capitalizes the first letter of a string. Converts the first character to uppercase while leaving the rest unchanged. Safely handles edge cases like empty strings and non-string inputs.

#pure#string-manipulation#formatting

pad-end

string

Pads the end of a string with another string until it reaches the target length. If padString is '', the original string is returned (mirrors native behavior).

#pure#string-manipulation#formatting

pad-start

string

Pads the start of a string with another string until it reaches the target length. If padString is '', the original string is returned (mirrors native behavior).

#pure#string-manipulation#formatting

pascal-case

string

Converts a string to PascalCase. Transforms a string by removing spaces, underscores, and hyphens, then capitalizing the first letter of each word including the first one. Commonly used for class names, interface names, type names, and component names.

#pure#string-manipulation#formatting

snake-case

string

Converts a string to snake_case. Transforms a string by converting it to lowercase and replacing spaces, hyphens, and camelCase boundaries with underscores. Commonly used for database column names, Python variables, and configuration keys.

#pure#string-manipulation#formatting

Quick Actions

Estimated size:1.60 KB

Tags

Parameters

strstring

The string to convert

Returns

string

The kebab-case version of the string