@use "sass:string";
@use "../string" as *;

@mixin filemanager-icon-colored($data-uri, $text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $width, $height) {
  $uri1: replace("#{$data-uri}", "currentTextColor", escape("#{$text-color}"));
  $uri2: replace("#{$uri1}", "currentSuccessBgColor", escape("#{$success-bg-color}"));
  $uri3: replace("#{$uri2}", "currentSuccessTextColor", escape("#{$success-text-color}"));
  $uri4: replace("#{$uri3}", "currentDangerBgColor", escape("#{$danger-bg-color}"));
  $uri-final: replace("#{$uri4}", "currentDangerTextColor", escape("#{$danger-text-color}"));

  background: string.unquote($uri-final);
  width: $width;
  height: $height;
}

@mixin filemanager-icons-mixin($text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $icon-size) {
  .dx-filemanager-i,
  .dx-filemanager-i.dx-icon {
    &.dx-filemanager-i-refresh,
    &.dx-filemanager-i-progress {
      @include filemanager-icon-colored(url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0D%0A%3Csvg%20version%3D%221.1%22%20id%3D%22_x30_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0D%0A%09%20viewBox%3D%220%200%2022%2022%22%20style%3D%22enable-background%3Anew%200%200%2022%2022%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0D%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0D%0A%09.st0%7Bfill%3AcurrentTextColor%3B%7D%0D%0A%3C%2Fstyle%3E%0D%0A%3Cg%20id%3D%22_x31_%22%3E%0D%0A%09%3Cpath%20id%3D%22_x33_%22%20class%3D%22st0%22%20d%3D%22M11%2C4c2.45%2C0%2C4.59%2C1.26%2C5.84%2C3.16L15%2C9l6%2C1l-1-6l-1.73%2C1.73C16.64%2C3.47%2C14%2C2%2C11%2C2%0D%0A%09%09c-4.97%2C0-9%2C4.03-9%2C9h2C4%2C7.13%2C7.13%2C4%2C11%2C4z%22%2F%3E%0D%0A%09%3Cpath%20id%3D%22_x32_%22%20class%3D%22st0%22%20d%3D%22M17.92%2C12c-0.49%2C3.39-3.39%2C6-6.92%2C6c-2.19%2C0-4.13-1.01-5.41-2.59L7%2C14l-6-1l1%2C6l2.17-2.17%0D%0A%09%09C5.82%2C18.76%2C8.26%2C20%2C11%2C20c4.63%2C0%2C8.44-3.5%2C8.94-8H17.92z%22%2F%3E%0D%0A%3C%2Fg%3E%0D%0A%3C%2Fsvg%3E%0D%0A"), $text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $icon-size, $icon-size);
    }

    &.dx-filemanager-i-done {
      @include filemanager-icon-colored(url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0D%0A%3Csvg%20version%3D%221.1%22%20id%3D%22_x30_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0D%0A%09%20viewBox%3D%220%200%2022%2022%22%20style%3D%22enable-background%3Anew%200%200%2022%2022%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0D%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0D%0A%09.st0%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentTextColor%3B%7D%0D%0A%09.st1%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentSuccessBgColor%3B%7D%0D%0A%09.st2%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentSuccessTextColor%3B%7D%0D%0A%3C%2Fstyle%3E%0D%0A%3Cpath%20id%3D%22_x33_%22%20class%3D%22st0%22%20d%3D%22M21%2C10l-6-1l1.87-1.87C15.6%2C5.24%2C13.44%2C4%2C11%2C4c-3.87%2C0-7%2C3.13-7%2C7H2c0-4.97%2C4.03-9%2C9-9%0D%0A%09c3.02%2C0%2C5.7%2C1.42%2C7.35%2C3.65L20%2C4L21%2C10z%20M5.6%2C15.4C6.88%2C16.98%2C8.81%2C18%2C11%2C18c0.4%2C0%2C0.78-0.05%2C1.15-0.12%0D%0A%09c0.15%2C0.69%2C0.42%2C1.32%2C0.77%2C1.91C12.3%2C19.92%2C11.66%2C20%2C11%2C20c-2.74%2C0-5.17-1.24-6.82-3.18L2%2C19l-1-6l6%2C1L5.6%2C15.4z%22%2F%3E%0D%0A%3Cpath%20id%3D%22_x32_%22%20class%3D%22st1%22%20d%3D%22M17.5%2C12c2.49%2C0%2C4.5%2C2.01%2C4.5%2C4.5S19.99%2C21%2C17.5%2C21S13%2C18.99%2C13%2C16.5S15.01%2C12%2C17.5%2C12z%22%2F%3E%0D%0A%3Cpath%20id%3D%22_x31_%22%20class%3D%22st2%22%20d%3D%22M21.35%2C14.35l-4.71%2C5l-3-3l0.71-0.71l2.15%2C2.15l4.15-4.15L21.35%2C14.35z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A"), $text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $icon-size, $icon-size);
    }

    &.dx-filemanager-i-danger {
      @include filemanager-icon-colored(url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0D%0A%3Csvg%20version%3D%221.1%22%20id%3D%22_x30_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0D%0A%09%20viewBox%3D%220%200%2022%2022%22%20style%3D%22enable-background%3Anew%200%200%2022%2022%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0D%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0D%0A%09.st0%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentTextColor%3B%7D%0D%0A%09.st1%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentDangerBgColor%3B%7D%0D%0A%09.st2%7Bfill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bfill%3AcurrentDangerTextColor%3B%7D%0D%0A%3C%2Fstyle%3E%0D%0A%3Cpath%20id%3D%22_x33_%22%20class%3D%22st0%22%20d%3D%22M21%2C10l-6-1l1.87-1.87C15.6%2C5.24%2C13.44%2C4%2C11%2C4c-3.87%2C0-7%2C3.13-7%2C7H2c0-4.97%2C4.03-9%2C9-9%0D%0A%09c3.02%2C0%2C5.7%2C1.42%2C7.35%2C3.65L20%2C4L21%2C10z%20M5.6%2C15.4C6.88%2C16.98%2C8.81%2C18%2C11%2C18c0.4%2C0%2C0.78-0.05%2C1.15-0.12%0D%0A%09c0.15%2C0.69%2C0.42%2C1.32%2C0.77%2C1.91C12.3%2C19.92%2C11.66%2C20%2C11%2C20c-2.74%2C0-5.17-1.24-6.82-3.18L2%2C19l-1-6l6%2C1L5.6%2C15.4z%22%2F%3E%0D%0A%3Cpath%20id%3D%22_x32_%22%20class%3D%22st1%22%20d%3D%22M17.5%2C12c2.49%2C0%2C4.5%2C2.01%2C4.5%2C4.5S19.99%2C21%2C17.5%2C21S13%2C18.99%2C13%2C16.5S15.01%2C12%2C17.5%2C12z%22%2F%3E%0D%0A%3Cpath%20id%3D%22_x31_%22%20class%3D%22st2%22%20d%3D%22M17%2C20v-1h1v1H17z%20M17%2C13h1v5h-1V13z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A"), $text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $icon-size, $icon-size);
    }

    &.dx-filemanager-i-cancel {
      @include filemanager-icon-colored(url("data:image/svg+xml;charset=UTF-8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0D%0A%3Csvg%20version%3D%221.1%22%20id%3D%22_x31_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0D%0A%09%20viewBox%3D%220%200%2016%2016%22%20style%3D%22enable-background%3Anew%200%200%2016%2016%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0D%0A%3Cpath%20id%3D%22_x32_%22%20fill%3D%22currentTextColor%22%20d%3D%22M8%2C0c4.42%2C0%2C8%2C3.58%2C8%2C8s-3.58%2C8-8%2C8c-4.42%2C0-8-3.58-8-8S3.58%2C0%2C8%2C0%20M10.87%2C4L8%2C6.87L5.13%2C4L4%2C5.13L6.87%2C8%0D%0A%09L4%2C10.87L5.13%2C12L8%2C9.13L10.87%2C12L12%2C10.87L9.13%2C8L12%2C5.13L10.87%2C4z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A"), $text-color, $success-bg-color, $success-text-color, $danger-bg-color, $danger-text-color, $icon-size, $icon-size);
    }
  }
}