Is it possible to rewrite the fluid-type function to scss in clamp?

Question

css

Here is a function for responsive font display:

@use 'sass:math';

@function strip-unit($value) {
  @return math.div($value, $value * 0 + 1)
}

@mixin fluid-type($min-vw, $max-vw, $min-font-size, $max-font-size) {
  $u1: unit($min-vw);
  $u2: unit($max-vw);
  $u3: unit($min-font-size);
  $u4: unit($max-font-size);

  @if $u1 == $u2 and $u1 == $u3 and $u1 == $u4 {
    font-size: $min-font-size;

    @media screen and (min-width: $min-vw) {
      font-size: calc(#{$min-font-size} + #{strip-unit($max-font-size - $min-font-size)} * ((100vw - #{$min-vw}) / #{strip-unit($max-vw - $min-vw)}));
    }

    @media screen and (min-width: $max-vw) {
      font-size: $max-font-size;
    }
  }
}

I would like to know if it is possible to improve it to clamp?

Answer 1

@mixin fluid-type($min-vw, $max-vw, $min-value, $max-value) {
  $factor: 1 / ($max-vw - $min-vw) * ($max-value - $min-value);
  $calc-value: unquote("#{ $min-value - ($min-vw * $factor) } + #{ 100vw * $factor }");

  font-size: clamp(#{ if($min-value > $max-value, $max-value, $min-value) }, #{ $calc-value }, #{ if($min-value > $max-value, $min-value, $max-value) });
}