////
/// @group typography
////

@import '~@react-md/theme/dist/helpers';
@import '~@react-md/utils/dist/functions';
@import './variables';

/// This function is used to quickly get one of the typography's theme values.
/// This is really just for the `rmd-typography-theme` mixin to provide some
/// validation that a correct style key is used, but might be useful in other
/// cases.
///
/// @param {String} theme-style - One of the `$rmd-typography-theme-values` map
/// keys to get a value for.
/// @return {Color|String|Number} one of the typography's theme values.
@function rmd-typography-theme($theme-style) {
  @return rmd-theme-get-var-value($theme-style, $rmd-typography-theme-values, typography);
}

/// This function is used to get one of the typography's theme variables as a
/// CSS Variable to be applied as a style attribute. By default, the CSS
/// Variable will have a fallback of the current `$rmd-typography-theme-values`
///
/// This function is used to create a CSS Variable declaration with an optional
/// fallback value if the CSS Variable has not been declared somehow.
///
/// @param {String} theme-style - One of the `$rmd-typography-theme-values` map
/// keys to set a value for.
/// @param {Color|String|Number} fallback [null] - An optional fallback color to
/// apply. This is set to `null` by default and not used since the link's theme
/// variables should always exist.
/// @return {String} one of the typography's theme values as a css variable.
@function rmd-typography-theme-var($theme-style, $fallback: null) {
  @return rmd-theme-get-var($theme-style, $rmd-typography-theme-values, typography, $fallback);
}

/// Gets the Google font suffix for the provided font weight.
///
/// @param {String} weight - The font weight to get a font suffix string for.
/// This should be one of the `$rmd-typography-google-font-weight-suffixes`
/// keys.
/// @return {String} the suffix for the provided font weight.
/// @access private
@function rmd-typography-google-font-suffix($weight) {
  @return rmd-utils-validate(
    $rmd-typography-google-font-weight-suffixes,
    $weight,
    'Google font weight suffix'
  );
}

/// Gets the current typography style from the `$rmd-typography-styles`
/// variable.
///
/// @example scss - Simple Examples
///
///   .test {
///     font-size: rmd-typography-value(headline-1, font-size);
///     line-height: rmd-typography-value(headline-4, line-height);
///   }
///
/// @param {String} style - One of the keys for the `$rmd-typography-styles`
/// map.
/// @param {String} property - One of the property values to extract.
/// @return {String} the typography style value.
@function rmd-typography-value($style, $property) {
  $style-props: rmd-utils-validate($rmd-typography-styles, $style, typography);

  @return rmd-utils-validate($style-props, $property, 'typography #{$style} property');
}