Skip to content

Instantly share code, notes, and snippets.

@nberlette
Last active January 10, 2024 22:42
Show Gist options
  • Save nberlette/9178f14ceb1098da07d30f26d9831244 to your computer and use it in GitHub Desktop.
Save nberlette/9178f14ceb1098da07d30f26d9831244 to your computer and use it in GitHub Desktop.
SASS string functions for kebabCase, camelCase, titleCase, etc.
/* * * * * * * * * * * * * * * * * * * * * * * * *
SASS string functions:
camelCase, kebabCase, titleCase, toLower, etc.
-------------------------------------------------
2021 Nicholas Berlette - https://git.io/Js3HD
* * * * * * * * * * * * * * * * * * * * * * * * */
@use "sass:string";
/*
upperCase($string)
- AKA: toUpper()
*/
@function upperCase($string) {
@return to-upper-case(quote(#{$string}));
}
@function toUpper($string) { @return upperCase($string); }
/*
lowerCase($string)
- AKA: toLower()
*/
@function lowerCase($string) {
@return to-lower-case(quote(#{$string}));
}
@function toLower($string) { @return lowerCase($string); }
/*
capitalize($string)
- AKA: cap(), upperStart(), capStart()
*/
@function capitalize($string) {
@return to-upper-case(str-slice($string, 1, 1)) + str-slice($string, 2);
}
@function cap($string) { @return capitalize($string); }
@function upperStart($string) { @return capitalize($string); }
@function capStart($string) { @return capitalize($string); }
/*
uncapitalize($string)
- AKA: uncap(), uncapStart(), lowerStart(), nocapStart()
*/
@function uncapitalize($string) {
@return to-lower-case(str-slice($string, 1, 1)) + str-slice($string, 2);
}
@function uncap($string) { @return uncapitalize($string); }
@function lowerStart($string) { @return uncapitalize($string); }
@function uncapStart($string) { @return uncapitalize($string); }
@function nocapStart($string) { @return uncapitalize($string); }
/*
contains($list, $key)
- AKA: contain(), search-list()
*/
@function contains($list, $key) {
@if type-of($list) == list {
@if not index($list, $key) and not not map-has-key($list, $key) {
@return map-get($list, $key);
}
@else if not not index($list, $key) and not map-has-key($list, $key) {
@return index($list, $key);
}
@else {
@return false;
}
}
@else {
@return false;
}
}
@function contain($list, $value) { @return contains($list, $value); }
@function search-list($list, $value) { @return contains($list, $value); }
// str-replace() - Replace in a string
// from: https://github.com/hail2u/scss-functions/blob/master/string/_str-replace.scss
// @param {string} $string String that you want to replace
// @param {string} $substr String that is to be replaced by `$newsubstr`
// @param {string} $newsubstr String that replaces `$substr`
// @param {number*} $all Flag for replaceing all (1+) or not (0)
// @return {string}
@function replace($string, $substr, $newsubstr, $all: 0) {
$string: quote(#{$string});
$substr: quote(#{$substr});
$newsubstr: quote(#{$newsubstr});
$position-found: str-index($string, $substr);
$processed: ();
@while ($position-found and $position-found > 0) {
$length-substr: str-length($substr);
@if (1 != $position-found) {
$processed: append($processed, str-slice($string, 0, $position-found - 1));
}
$processed: append($processed, $newsubstr);
$string: str-slice($string, $position-found + $length-substr);
$position-found: 0;
@if ($all > 0) {
$position-found: str-index($string, $substr);
}
}
$processed: append($processed, $string);
$string: "";
@each $s in $processed {
$string: #{$string}#{$s};
}
@return $string;
}
/*
titleCase($string)
- AKA: properCase(), capitalizeAll(), capAll()
*/
@function titleCase($string) {
$string: quote(#{$string});
$progress: $string;
$result: "";
$running: true;
@while $running {
$index: str-index($progress, " ");
@if $index {
$result: $result + capitalize(str-slice($progress, 1, $index));
$progress: str-slice($progress, ($index + 1));
}
@else {
$running: false;
}
}
@return capitalize($result) + capitalize($progress);
}
@function capitalizeAll($string) { @return titleCase($string); }
@function properCase($string) { @return titleCase($string); }
@function capAll($string) { @return titleCase($string); }
/*
camelCase($string)
- AKA: camelize(), toCamel()
*/
@function camelCase($string) {
$string: quote(#{$string});
$progress: $string;
$result: "";
$exclude: " ", "-", "–", "—", "_", ",", ";", ":", ".", "+", "=", "?", "&", "*", "/", "|", ">", "<", "(", ")";
@while str-length($progress) > 0 {
$char: str-slice($progress, 1, 1);
@if contains($exclude, $char) {
$progress: capitalize(str-slice($progress, 2, 2)) + str-slice($progress, 3);
}
@else {
$result: $result + $char;
$progress: str-slice($progress, 2);
}
}
@return $result;
}
@function camelize($string) { @return camelCase($string); }
@function toCamel($string) { @return camelCase($string); }
/*
kebabCase($string, $prefix: "", $glue: "-", $suffix: "")
- AKA: toKebab(), toSlug()
*/
@function kebabCase($string, $prefix: "", $glue: "-", $suffix: "") {
$result: toLower($string);
$replace: " ", "-", "–", "—", "_", ",", ";", ":", ".", "+", "=", "?", "&", "*", "/", "|", ">", "<", "(", ")";
@each $char in $replace {
$result: replace($result, $char, $glue, 1);
}
@return $prefix + $result + $suffix;
}
@function toKebab($string, $prefix: "", $glue: "-", $suffix: "") {
@return kebabCase($string, $prefix, $glue, $suffix);
}
@function toSlug($string, $prefix: "", $glue: "-", $suffix: "") {
@return kebabCase($string, $prefix, $glue, $suffix);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment