@fremtind/jkl-icon-button-react

Jøkul react icon-button components

Usage no npm install needed!

<script type="module">
  import fremtindJklIconButtonReact from 'https://cdn.skypack.dev/@fremtind/jkl-icon-button-react';
</script>

README

@fremtind/jkl-icon-button-react

Beskrivelse

Se portalen for bruk og prinsipper.

Kom i gang

Lær hvordan du kan ta i bruk Jøkul

Bruk av React-pakken

Installasjon

  1. Installér pakken med yarn add @fremtind/jkl-icon-button-react eller npm i @fremtind/jkl-icon-button-react. Stil-pakken blir automatisk installert som en avhengighet.

  2. Importer både React-pakken (velg komponenten(e) du trenger) og stil-pakken i prosjektet ditt:

import { IconButton } from "@fremtind/jkl-icon-button-react";
import "@fremtind/jkl-icon-button/icon-button.min.css";

Bruk

Komponentene tar følgende props:

  • iconType: Angir hvilken svg ikon skal vises (f.eks: search, calendar, clear). string
  • buttonTitle: Serverer som hjelpetekst. string
  • onClick: Påkrevd. Klikkhåndtering for knappen. Får en MouseEvent som første argument. MouseEventHandler<HTMLButtonElement>

En enkel bruk av knapper kan se slik ut:

<IconButton iconType="calendar" onClick={onClick} buttonTitle="Vis kalendar" />