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

@function 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);
}

@mixin icon($icon-name) {
  & {
    display: inline-flex;
    background: icon-url(icons.$assets, $icon-name) no-repeat;
    inline-size: 1em;
    block-size: 1em;
  }

  @if map.has-key(icons.$masks, $icon-name) {
    &::after {
      content: '';
      background: currentColor;
      block-size: inherit;
      inline-size: inherit;
      pointer-events: none;
      mask-image: icon-url(icons.$masks, $icon-name);
    }
  }
}