docs(themes): add docs for newly introduced functions

projects/igniteui-angular/src/lib/core/styles/base/utilities/_functions.scss

@@ -379,9 +379,9 @@
 }
 
 /// Splits a string into a list by a given separator.
+/// @access private
 /// @param {string} $string - The string to split.
 /// @param {string} $separator - The string separator to split the string by.
-///
 @function str-split($string, $separator) {
     $split-arr: ();
     $index : str-index($string, $separator);
@@ -408,7 +408,24 @@
     }
 }
 
-// @ignore
+/// Returns a value for a given instruction map, where the
+/// keys of the map are the names of the functions to be called,
+/// and the value for a given key is the arguments the function
+/// should be called with.
+/// The instruction set is executed left-to-right. The output of
+/// the first instruction is then passed as input to the next, and so on.
+/// @access private
+/// @param {Map} $ctx - The instruction map to be used.
+/// @param {List | Map} $extra [null] - Additional arguments to be passed during function calls.
+/// Will only be applied for `igx-color` and `igx-contrast-color` functions.
+/// @example scss Resolve `igx-color` and apply 80% opacity
+/// $instructions: (
+///   igx-color: ('primary', 500),
+///   rgba: .2
+/// );
+/// // $some-palette is a palette we pass as extra arguments
+/// $resolved-color: resolve-value($instructions, $some-palette);
+///
 @function resolve-value($ctx, $extra: null) {
     $result: null;
     @each $fn, $args in $ctx {
@@ -425,7 +442,22 @@
     @return $result;
 }
 
-// @ignore
+/// Applies an `igx-palette` to a given theme schema.
+/// @access private
+/// @param {Map} $schema - A theme schema.
+/// @param {Map} $palette - An igx-palette map.
+/// @requires {function} resolve-value
+/// @example scss Apply an `igx-palette` to theme schema
+///   $custom-palette: igx-palette($primary: red, $secondary: blue);
+///   $custom-schema: (
+///     my-color: (
+///        igx-color: ('primary', 800),
+///        rgba: .5
+///     ),
+///     roundness: 5px
+///   );
+///   $theme: apply-palette($custom-schema, $custom-palette); // A map with palette values resolved.
+/// @returns {Map} - A map with the resolved palette values.
 @function apply-palette($schema, $palette) {
     $result: ();
     @each $key, $value in $schema {
@@ -442,13 +474,13 @@
 /// is the root of the document.
 /// @access private
 /// @example scss Check if the current scope is root
-/// @mixin smart-mixin() {
-///   $scope: if(is-root(), ':root', '&');
+///   @mixin smart-mixin() {
+///     $scope: if(is-root(), ':root', '&');
 ///
-///   #{$scope} {
-///     /* style rules here */
+///     #{$scope} {
+///       /* style rules here */
+///     }
 ///   }
-/// }
 ///
 @function is-root {
     @each $selector in & {