<ui-socialmedia>

<template is="ui-socialmedia" accounts="array">
  <div class="ui-socialmedia">
    <div if="props.accounts?.length" class="ui-socialmedia-content">
      <div map="account of props.accounts" class="ui-socialmedia-item">
        <a
          if="account?.url"
          href="{{account.url}}"
          target="_blank"
          rel="noopener noreferrer"
          class="ui-socialmedia-link"
        >
          <img
            if="account?.icon?.asset?.url"
            src="{{account.icon.asset.url}}"
            alt=""
            class="ui-socialmedia-icon"
          />
          <span if="account?.platform" class="ui-socialmedia-platform">
            {{account.platform |> esc}}
          </span>
        </a>
      </div>
    </div>
  </div>
</template>