@use "sass:map";
@use "sass:string";
@use 'sass:list';
@use "./assets/all" as icons;

@function flag-icon-url($icon-map, $icon-name) {
  $svg: map.get($icon-map, $icon-name);
  @if $svg == null {
    @error "Icon `#{$icon-name}` not found.";
  }

  @return url($svg);
}

$_setAspectRatio: (
  "1x1": 1,
  "4x3": 4 / 3,
);

@mixin flag-icon($icon-name, $dynamic-color: true) {
  & {
    display: inline-flex;
    background: flag-icon-url(icons.$assets, $icon-name) no-repeat;
    block-size: 1em;
    aspect-ratio: map.get($_setAspectRatio, list.nth(string.split($icon-name, "::"), 1));
  }
}
