@progress/kendo-theme-core 6.1.1-dev.0 → 6.1.1-dev.11

package/scss/functions/_map.import.scss

@@ -1,3 +1,9 @@
+/// Returns the value at `$key` in `$map`.
+/// @param {Map} $map - The map to get the value from.
+/// @param {Any} $key - The key to get the value for.
+///
+/// @example scss - Usage
+///   @debug k-map-get( ( "foo": "bar" ), "foo" ); // => "bar"
 @function k-map-get( $map, $keys... ) {
     @each $key in $keys {
         $map: map-get( $map, $key );
@@ -5,14 +11,35 @@
     @return $map;
 }
 
+/// Returns whether `$map` has a value at `$key`.
+/// @param {Map} $map - The map to check.
+/// @param {Any} $key - The key to check.
+/// @return {Boolean} - Whether `$map` has a value at `$key`.
+///
+/// @example scss - Usage
+///   @debug k-map-has( ( "foo": "bar" ), "foo" ); // => true
+///   @debug k-map-has( ( "foo": "bar" ), "bar" ); // => false
 @function k-map-has-key( $map, $key ) {
     @return map-has-key( $map, $key );
 }
 
+/// Returns a comma separated list of the keys in `$map`.
+/// @param {Map} $map - The map to get the keys from.
+/// @return {List} - A comma separated list of the keys in `$map`.
+///
+/// @example scss - Usage
+///   @debug k-map-keys( ( "foo": "bar", "baz": "qux" ) ); // => "foo, baz"
 @function k-map-keys( $map ) {
     @return map-keys( $map );
 }
 
+/// Returns a map with the keys and values from `$map` and `$args`.
+/// @param {Map} $map - The map to merge.
+/// @param {Map} $args - The map to merge into `$map`.
+/// @return {Map} - A map with the keys and values from `$map` and `$args`.
+///
+/// @example scss - Usage
+///   @debug k-map-merge( ( "foo": "bar" ), ( "baz": "qux" ) ); // => ( "foo": "bar", "baz": "qux" )
 @function k-map-merge( $map, $args... ) {
     @each $arg in $args {
         $map: map-merge( $map, $arg );
@@ -20,14 +47,35 @@
     @return $map;
 }
 
+/// Returns a map with the keys and values from `$map` except for `$keys`.
+/// @param {Map} $map - The map to remove keys from.
+/// @param {Any} $keys - The keys to remove from `$map`.
+/// @return {Map} - A map with the keys and values from `$map` except for `$keys`.
+///
+/// @example scss - Usage
+///   @debug k-map-remove( ( "foo": "bar", "baz": "qux" ), "foo" ); // => ( "baz": "qux" )
 @function k-map-remove( $map, $keys... ) {
     @return map-remove( $map, $keys... );
 }
 
+/// Sets a single key and value in `$map`.
+/// @param {Map} $map - The map to set the value in.
+/// @param {Any} $key - The key to set the value for.
+/// @param {Any} $value - The value to set.
+/// @return {Map} - A map with the key and value set.
+///
+/// @example scss - Usage
+///   @debug k-map-set( ( "foo": "bar" ), "baz", "qux" ); // => ( "foo": "bar", "baz": "qux" )
 @function k-map-set( $map, $key, $value ) {
     @return k-map-merge( $map, ( $key: $value ) );
 }
 
+/// Returns a comma separated list of the values in `$map`.
+/// @param {Map} $map - The map to get the values from.
+/// @return {List} - A comma separated list of the values in `$map`.
+///
+/// @example scss - Usage
+///   @debug k-map-values( ( "foo": "bar", "baz": "qux" ) ); // => "bar, qux"
 @function k-map-values( $map ) {
     @return map-values( $map );
 }

package/scss/functions/_math.import.scss

@@ -1,47 +1,147 @@
+/// Returns the absolute value of a number.
+/// @param {Number} $number - The number to get the absolute value of.
+/// @return {Number} - The absolute value of `$number`.
+///
+/// @example scss - Usage
+///   @debug k-math-abs( -10 ); // => 10
 @function k-math-abs( $number ) {
     @return abs( $number );
 }
 
+/// Returns the smallest integer greater than or equal to a number.
+/// @param {Number} $number - The number to get the ceiling of.
+/// @return {Number} - The ceiling of `$number`.
+///
+/// @example scss - Usage
+///   @debug k-math-ceil( 10.1 ); // => 11
 @function k-math-ceil( $number ) {
     @return ceil( $number );
 }
 
-@function k-math-clamp( $value, $min, $max ) {
-    @return k-math-max( $min, k-math-min( $max, $value ) );
-}
-
+/// Returns the largest integer less than or equal to a number.
+/// @param {Number} $number - The number to get the floor of.
+/// @return {Number} - The floor of `$number`.
+///
+/// @example scss - Usage
+///   @debug k-math-floor( 10.9 ); // => 10
+@function k-math-floor( $number ) {
+    @return floor( $number );
+}
+
+/// Restricts `$number` to the range between `$min` and `$max`. If `$number` is
+/// less than `$min`, `$min` is returned. If `$number` is greater than `$max`,
+/// `$max` is returned. Otherwise, `$number` is returned.
+/// @param {Number} $number - The number to clamp.
+/// @param {Number} $min - The minimum value.
+/// @param {Number} $max - The maximum value.
+/// @return {Number} - The clamped number.
+///
+/// @example scss - Usage
+///   @debug k-math-clamp( 10, 0, 5 ); // => 5
+@function k-math-clamp( $number, $min, $max ) {
+    @return k-math-max( $min, k-math-min( $max, $number ) );
+}
+
+/// Returns whether two numbers have compatible units.
+/// @param {Number} $a - The first number.
+/// @param {Number} $b - The second number.
+/// @return {Boolean} - Whether the numbers have compatible units.
+///
+/// @example scss - Usage
+///   @debug k-math-compatible( 10px, 10px ); // => true
+///   @debug k-math-compatible( 10px, 10em ); // => false
 @function k-math-compatible( $a, $b ) {
     @return comparable( $a, $b );
 }
 
+/// Returns the quotient of two numbers.
+/// @param {Number} $a - The dividend.
+/// @param {Number} $b - The divisor.
+/// @return {Number} - The quotient of `$a` and `$b`.
+///
+/// @example scss - Usage
+///   @debug k-math-div( 10, 2 ); // => 5
+///   @debug k-math-div( 10px, 2 ); // => 5px
 @function k-math-div( $a, $b )  {
     @return ( $a / $b );
 }
 
+/// Returns whether `$number` has no units.
+/// @param {Number} $number - The number to check.
+/// @return {Boolean} - Whether `$number` has no units.
+///
+/// @example scss - Usage
+///   @debug k-math-is-unitless( 10 ); // => true
+///   @debug k-math-is-unitless( 10px ); // => false
 @function k-math-is-unitless( $number ) {
     @return unitless( $number );
 }
 
+/// Returns the larger of two numbers.
+/// @param {Number} $a - The first number.
+/// @param {Number} $b - The second number.
+/// @return {Number} - The larger of `$a` and `$b`.
+///
+/// @example scss - Usage
+///   @debug k-math-max( 10, 20 ); // => 20
+///   @debug k-math-max( 10px, 20px ); // => 20px
 @function k-math-max( $a, $b ) {
     @return max( $a, $b );
 }
 
+/// Returns the smaller of two numbers.
+/// @param {Number} $a - The first number.
+/// @param {Number} $b - The second number.
+/// @return {Number} - The smaller of `$a` and `$b`.
+///
+/// @example scss - Usage
+///   @debug k-math-min( 10, 20 ); // => 10
+///   @debug k-math-min( 10px, 20px ); // => 10px
 @function k-math-min( $a, $b ) {
     @return min( $a, $b );
 }
 
+/// Returns the remainder of two numbers.
+/// @param {Number} $a - The dividend.
+/// @param {Number} $b - The divisor.
+/// @return {Number} - The remainder of `$a` and `$b`.
+///
+/// @example scss - Usage
+///   @debug k-math-mod( 10, 3 ); // => 1
+///   @debug k-math-mod( 10px, 3 ); // => 1px
 @function k-math-mod( $a, $b ) {
     @return ( $a % $b );
 }
 
+/// Returns the product of two numbers.
+/// @param {Number} $a - The first number.
+/// @param {Number} $b - The second number.
+/// @return {Number} - The product of `$a` and `$b`.
+///
+/// @example scss - Usage
+///   @debug k-math-mul( 10, 2 ); // => 20
+///   @debug k-math-mul( 10px, 2 ); // => 20px
 @function k-math-mul( $a, $b ) {
     @return ( $a * $b );
 }
 
+/// Converts a unitless number to a percentage.
+/// @param {Number} $number - The number to convert.
+/// @return {Number} - The percentage.
+///
+/// @example scss - Usage
+///   @debug k-math-percentage( 0.5 ); // => 50%
 @function k-math-percentage( $number ) {
-    @return ( $number * 100% );
+    @return percentage( $number );
 }
 
+/// Returns the result of raising `$x` to the power of `$n`.
+/// @param {Number} $x - The base.
+/// @param {Number} $n - The exponent.
+/// @return {Number} - The result of raising `$x` to the power of `$n`.
+///
+/// @example scss - Usage
+///   @debug k-math-pow( 2, 3 ); // => 8
 @function k-math-pow( $x, $n ) {
     $ret: 1;
 
@@ -63,10 +163,12 @@
 
 }
 
-@function k-math-percentage( $number ) {
-    @return percentage( $number );
-}
-
+/// Returns a random number between 0 and 1.
+/// @param {Number} $limit - The upper limit of the random number.
+/// @return {Number} - A random number between 0 and 1.
+///
+/// @example scss - Usage
+///   @debug k-math-random(); // => 0.123456789
 @function k-math-random( $limit: null ) {
     @if ( $limit == null ) {
         @return random();
@@ -75,6 +177,14 @@
     @return random( $limit );
 }
 
+/// Returns the result of rounding `$number` to the nearest integer
+/// using the specified `$precision`.
+/// @param {Number} $number - The number to round.
+/// @param {Number} $precision - The number of decimal places to round to.
+/// @return {Number} - The rounded number.
+///
+/// @example scss - Usage
+///   @debug k-math-round( 10.123456789, 3 ); // => 10.123
 @function k-math-round( $number, $precision: 0 ) {
 
     @if ( $precision == 0 ) {
@@ -86,10 +196,22 @@
     @return k-math-div( round( $number * $pow ), $pow );
 }
 
+/// Returns a string representation of `$number`'s unit.
+/// @param {Number} $number - The number to get the unit of.
+/// @return {String} - The unit of `$number`.
+///
+/// @example scss - Usage
+///   @debug k-math-unit( 10px ); // => px
 @function k-math-unit( $number ) {
     @return unit( $number );
 }
 
+/// Remove the unit from a number.
+/// @param {Number} $number - The number to remove the unit from.
+/// @return {Number} - The unitless number.
+///
+/// @example scss - Usage
+///   @debug k-math-strip-unit( 10px ); // => 10
 @function k-math-strip-unit($number) {
     @if ( k-meta-type-of( $number ) == "number" ) and not k-math-is-unitless( $number ) {
         @return k-math-div( $number, 1 * k-math-unit( $number) );

package/scss/functions/_meta.import.scss

@@ -1,77 +1,239 @@
 // Adapted from https://css-tricks.com/snippets/sass/advanced-type-checking/
 
+/// A wrapper around the `call()` function.
+/// Calls the function `$function` with the arguments `$args`.
+/// @param {Function} $function - The function to call.
+/// @param {List} $args - The arguments to pass to `$function`.
+/// @return {Any} - The result of calling `$function` with `$args`.
+///
+/// @example scss - Usage
+///   @debug k-meta-call( k-meta-get-function( "k-string-replace" ), "foo bar", "bar", "baz" ); // => "foo baz"
 @function k-meta-call( $function, $args... ) {
     @return call( $function, $args... );
 }
 
+/// A wrapper around the `function-exists()` function.
+/// Returns whether a function with the name `$name` exists.
+/// @param {String} $name - The name of the function to check.
+/// @return {Boolean} - Whether a function with the name `$name` exists.
+///
+/// @example scss - Usage
+///   @debug k-meta-function-exists( "k-string-replace" ); // => true
 @function k-meta-function-exists( $name ) {
     @return function-exists( $name );
 }
 
+/// A wrapper around the `get-function()` function.
+/// Returns the function with the name `$name`.
+/// @param {String} $name - The name of the function to get.
+/// @param {Boolean} $css - Whether to return the CSS representation of the function.
+/// @param {Module} $module - The module to get the function from.
+/// @return {Function} - The function with the name `$name`.
+///
+/// @example scss - Usage
+///   @debug k-meta-get-function( "k-string-replace" ); // => Function
 @function k-meta-get-function( $name, $args... ) {
     @return get-function( $name, $args... );
 }
 
+/// A wrapper around the `inspect()` function.
+/// Returns a string representation of `$value`.
+/// @param {Any} $value - The value to inspect.
+/// @return {String} - A string representation of `$value`.
+///
+/// @example scss - Usage
+///   @debug k-meta-inspect( "foo bar" ); // => "foo bar"
 @function k-meta-inspect( $value ) {
     @return inspect( $value );
 }
 
+/// A wrapper around the `keywords()` function.
+/// Returns a map of the keywords in `$args`.
+/// @param {List} $args - The arguments to process.
+/// @return {Map} - A map of the keywords in `$args`.
+///
+/// @example scss - Usage
+///   @debug k-meta-keywords( ( "foo" "bar" "baz" "qux" ) ); // => ( "foo": "bar", "baz": "qux" )
 @function k-meta-keywords( $args ) {
     @return keywords( $args );
 }
 
+/// A wrapper around the `type-of()` function.
+/// Returns the type of `$value`.
+/// @param {Any} $value - The value to get the type of.
+/// @return {String} - The type of `$value`.
+///
+/// @example scss - Usage
+///   @debug k-meta-type-of( "foo bar" ); // => "string"
 @function k-meta-type-of( $value ) {
     @return type-of( $value );
 }
 
+/// A wrapper around the `variable-exists()` function.
+/// Returns whether a variable with the name `$name` exists.
+/// @param {String} $name - The name of the variable to check.
+/// @return {Boolean} - Whether a variable with the name `$name` exists.
+///
+/// @example scss - Usage
+///   @debug k-meta-variable-exists( "foo" ); // => true
 @function k-meta-variable-exists( $name ) {
     @return variable-exists( $name );
 }
 
+/// Checks whether `$value` is a <number> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a number.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/number
+///
+/// @example scss - Usage
+///   @debug k-meta-is-number( 1 ); // => true
+///   @debug k-meta-is-number( "foo" ); // => false
 @function k-meta-is-number( $value ) {
     @return k-meta-type-of( $value ) == "number";
 }
 
+/// Checks whether `$value` is a <integer> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a integer.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/integer
+///
+/// @example scss - Usage
+///   @debug k-meta-is-integer( 1 ); // => true
+///   @debug k-meta-is-integer( 1.5 ); // => false
 @function k-meta-is-integer( $value ) {
     @return k-meta-is-number( $value ) and k-math-round( $value ) == $value;
 }
 
+/// Checks whether `$value` is a <time> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a time.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/time
+///
+/// @example scss - Usage
+///   @debug k-meta-is-time( 1s ); // => true
+///   @debug k-meta-is-time( 1 ); // => false
 @function k-meta-is-time( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "ms" "s", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is a valid duration period.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a duration.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/time
+///
+/// @example scss - Usage
+///   @debug k-meta-is-duration( 1s ); // => true
+///   @debug k-meta-is-duration( 1 ); // => false
 @function k-meta-is-duration( $value ) {
     @return k-meta-is-time( $value );
 }
 
+/// Checks whether `$value` is a <angle> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a angle.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/angle
+///
+/// @example scss - Usage
+///   @debug k-meta-is-angle( 1deg ); // => true
+///   @debug k-meta-is-angle( 1 ); // => false
 @function k-meta-is-angle( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "deg" "rad" "grad" "turn", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is a <frequency> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a frequency.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/frequency
+///
+/// @example scss - Usage
+///   @debug k-meta-is-frequency( 1Hz ); // => true
+///   @debug k-meta-is-frequency( 1 ); // => false
 @function k-meta-is-frequency( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "Hz" "kHz", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is a relative <length> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a relative length.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/length#relative_length_units_based_on_font
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/length#relative_length_units_based_on_viewport
+///
+/// @example scss - Usage
+///   @debug k-meta-is-relative-length( 1em ); // => true
+///   @debug k-meta-is-relative-length( 1ch ); // => true
+///   @debug k-meta-is-relative-length( 1 ); // => false
 @function k-meta-is-relative-length( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "em" "ex" "ch" "rem" "vw" "vh" "vmin" "vmax", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is an absolute <length> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is an absolute length.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/length#absolute_length_units
+///
+/// @example scss - Usage
+///   @debug k-meta-is-absolute-length( 1cm ); // => true
+///   @debug k-meta-is-absolute-length( 1 ); // => false
 @function k-meta-is-absolute-length( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "cm" "mm" "in" "px" "pt" "pc", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is a <percentage> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a percentage.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/percentage
+///
+/// @example scss - Usage
+///   @debug k-meta-is-percentage( 1% ); // => true
+///   @debug k-meta-is-percentage( 1 ); // => false
 @function k-meta-is-percentage( $value ) {
     @return k-meta-is-number( $value ) and k-math-unit( $value ) == "%";
 }
 
+/// Checks whether `$value` is a <length> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a length.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/length
+///
+/// @example scss - Usage
+///   @debug k-meta-is-length( 1em ); // => true
+///   @debug k-meta-is-length( 1cm ); // => true
+///   @debug k-meta-is-length( 1 ); // => false
 @function k-meta-is-length( $value ) {
     @return k-meta-is-relative-length( $value ) or k-meta-is-absolute-length( $value );
 }
 
+/// Checks whether `$value` is a <resolution> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a resolution.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/resolution
+///
+/// @example scss - Usage
+///   @debug k-meta-is-resolution( 1dpi ); // => true
+///   @debug k-meta-is-resolution( 1 ); // => false
 @function k-meta-is-resolution( $value ) {
     @return k-meta-is-number( $value ) and k-string-index( "dpi" "dpcm" "dppx", k-math-unit( $value ) ) != null;
 }
 
+/// Checks whether `$value` is a <position> CSS data type.
+/// @param {Any} $value - The value to check.
+/// @return {Boolean} - Whether `$value` is a position.
+///
+/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/position
+///
+/// @example scss - Usage
+///   @debug k-meta-is-position( center ); // => true
 @function k-meta-is-position( $value ) {
     @return k-meta-is-length( $value ) or k-meta-is-percentage( $value ) or k-string-index( "top" "right" "bottom" "left" "center", $value ) != null;
 }

package/scss/functions/_string.import.scss

@@ -1,20 +1,57 @@
+/// Returns the first index of `$substring` in `$string`, or `null` if `$string` doesn’t contain `$substring`.
+/// @param {String} $string - The string to process.
+/// @param {String} $substring - The substring to look for.
+/// @return {Number} - The first index of `$substring` in `$string`, or `null` if `$string` doesn’t contain `$substring`.
+///
+/// @example scss - Usage
+///   @debug k-string-index( "foo bar", "bar" ); // => 5
 @function k-string-index( $string, $substring ) {
     @return str-index( $string, $substring );
 }
 
+/// Returns a copy of `$string` with `$insert` inserted at `$index`.
+/// @param {String} $string - The string to process.
+/// @param {String} $insert - The string to insert.
+/// @param {Number} $index - The index at which to insert `$insert`.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-insert( "foo bar", "baz", 5 ); // => "foo baz bar"
 @function k-string-insert( $string, $insert, $index ) {
     @return str-insert( $string, $insert, $index );
 }
 
+/// Returns the length of `$string`.
+/// @param {String} $string - The string to process.
+/// @return {Number} - The length of `$string`.
+///
+/// @example scss - Usage
+///   @debug k-string-length( "foo bar" ); // => 7
 @function k-string-length( $string ) {
     @return str-length( $string );
 }
 
+/// Returns a copy of `$string` with quotes added.
+/// @param {String} $string - The string to process.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-quote( "foo bar" ); // => "foo bar"
 @function k-string-quote( $string ) {
     @return quote( $string );
 }
 
-// See https://www.sassmeister.com/gist/1b4f2da5527830088e4d
+/// Returns a copy of `$string` with all occurrences of `$search`
+/// replaced by `$replace`.
+/// @param {String} $string - The string to process.
+/// @param {String} $search - The substring to look for.
+/// @param {String} $replace - The replacement string.
+/// @return {String} - The resulting string.
+///
+/// @link https://www.sassmeister.com/gist/1b4f2da5527830088e4d
+///
+/// @example scss - Usage
+///   @debug k-string-replace( "foo bar", "bar", "baz" ); // => "foo baz"
 @function k-string-replace( $string, $search, $replace: "" ) {
     @if k-meta-type-of( $string ) == number {
         $string: $string + "";
@@ -29,22 +66,53 @@
     @return $string;
 }
 
+/// Returns a substring of `$string` starting at `$start-at` and ending at `$end-at`.
+/// @param {String} $string - The string to process.
+/// @param {Number} $start-at - The index at which to start the substring.
+/// @param {Number} $end-at - The index at which to end the substring.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-slice( "foo bar", 5 ); // => "bar"
 @function k-string-slice( $string, $start-at, $end-at: -1 ) {
     @return str-slice( $string, $start-at, $end-at );
 }
 
+/// Returns a copy of `$string` with all uppercase letters converted to lowercase.
+/// @param {String} $string - The string to process.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-to-lower-case( "FOO BAR" ); // => "foo bar"
 @function k-string-to-lower-case( $string ) {
     @return to-lower-case( $string );
 }
 
+/// Returns a copy of `$string` with all lowercase letters converted to uppercase.
+/// @param {String} $string - The string to process.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-to-upper-case( "foo bar" ); // => "FOO BAR"
 @function k-string-to-upper-case( $string ) {
     @return to-upper-case( $string );
 }
 
+/// Returns a unique identifier.
+/// @return {String} - The unique identifier.
+///
+/// @example scss - Usage
+///   @debug k-string-unique-id(); // => UNIQUE_ID
 @function k-string-unique-id() {
     @return unique-id();
 }
 
+/// Returns a copy of `$string` with quotes removed.
+/// @param {String} $string - The string to process.
+/// @return {String} - The resulting string.
+///
+/// @example scss - Usage
+///   @debug k-string-unquote( "foo bar" ); // => foo bar
 @function k-string-unquote( $string ) {
     @return unquote( $string );
 }