Loader

import { Loader } from "@grassroot/ui-react";
 
<Loader />                                  {/* rotator, md */}
<Loader variant="equalizer" size="lg" />
<Loader variant="noodle" speed={0.6} label="Compiling" />

<script setup lang="ts">
import { Loader } from "@grassroot/ui-vue";
</script>
 
<template>
  <Loader />
  <Loader variant="equalizer" size="lg" />
  <Loader variant="noodle" :speed="0.6" label="Compiling" />
</template>

import { Component } from "@angular/core";
import { GrassrootLoader } from "@grassroot/ui-angular";
 
@Component({
  selector: "app-example",
  standalone: true,
  imports: [GrassrootLoader],
  template: `
    <grassroot-loader />
    <grassroot-loader variant="equalizer" size="lg" />
    <grassroot-loader variant="noodle" [speed]="0.6" label="Compiling" />
  `,
})
export class ExampleComponent {
}

<script lang="ts">
  import { Loader } from "@grassroot/ui-svelte";
</script>
 
<Loader />
<Loader variant="equalizer" size="lg" />
<Loader variant="noodle" speed={0.6} label="Compiling" />

import { Loader } from "@grassroot/ui-solid";
 
export function Example() {
  return (
    <>
      <Loader />
      <Loader variant="equalizer" size="lg" />
      <Loader variant="noodle" speed={0.6} label="Compiling" />
    </>
  );
}