<script>
  import { ImageLoader, Button } from "carbon-components-svelte";

  const src =
    "https://upload.wikimedia.org/wikipedia/commons/5/51/IBM_logo.svg";
  const srcError = src + "1";

  let imageLoader;
  let error;
</script>

<Button
  kind="ghost"
  disabled="{!imageLoader || error}"
  on:click="{() => imageLoader.loadImage(srcError)}"
>
  Simulate error
</Button>

<ImageLoader bind:this="{imageLoader}" bind:error fadeIn src="{src}">
  <div slot="error">
    <Button kind="ghost" on:click="{() => imageLoader.loadImage(src)}">
      Error. Try again
    </Button>
  </div>
</ImageLoader>
