Price

import { Price } from "@grassroot/ui-react";
 
<Price amount={3200} />
<Price amount={8900} compareAt={10400} size="lg" />
<Price amount={1800} currency="EUR" locale="de-DE" />

<script setup lang="ts">
import { Price } from "@grassroot/ui-vue";
</script>
 
<template>
  <Price :amount="3200" />
  <Price :amount="8900" :compare-at="10400" size="lg" />
  <Price :amount="1800" currency="EUR" locale="de-DE" />
</template>

import { Component } from "@angular/core";
import { GrassrootPrice } from "@grassroot/ui-angular";
 
@Component({
  selector: "app-example",
  standalone: true,
  imports: [GrassrootPrice],
  template: `
    <grassroot-price [amount]="3200" />
    <grassroot-price [amount]="8900" [compareAt]="10400" size="lg" />
    <grassroot-price [amount]="1800" currency="EUR" locale="de-DE" />
  `,
})
export class ExampleComponent {
}

<script lang="ts">
  import { Price } from "@grassroot/ui-svelte";
</script>
 
<Price amount={3200} />
<Price amount={8900} compareAt={10400} size="lg" />
<Price amount={1800} currency="EUR" locale="de-DE" />

import { Price } from "@grassroot/ui-solid";
 
export function Example() {
  return (
    <>
      <Price amount={3200} />
      <Price amount={8900} compareAt={10400} size="lg" />
      <Price amount={1800} currency="EUR" locale="de-DE" />
    </>
  );
}