InputGroup
Skjemafeltene våre har noen felles egenskaper. For å unngå duplisering av kode har vi laget en pakke for delte komponenter.
Kom i gang
Installer
npm i @fremtind/jkl-input-group-react
Bruk
import { InputGroup } from "@fremtind/jkl-input-group-react";// Importer stilark via JavaScript med CSS-loader.import "@fremtind/jkl-input-group/input-group.min.css";import "@fremtind/jkl-tooltip/tooltip.min.css";import "@fremtind/jkl-icons/icons.min.css";
React
Live demo
InputGroup
Egenskaper
Visning
const medHjelpetekst = false;const medFeil = false;const medTooltip = false;return (<InputGrouplabel="Fødselsnummer"labelProps={{ variant: 'small' }}helpLabel={medHjelpetekst ? "Fødselsnummer består av 11 siffer" : undefined}errorLabel={medFeil ? "Du må fylle ut fødselsnummer, 11 siffer" : undefined}tooltipProps={medTooltip? {content: (<>Du må fylle ut fødelsnummer eller D-nummer. Se{" "}<a href="#">guiden vår</a> hvis du er usikker på hvordan Dufinner D-nummer.</>),}: undefined}><BaseTextInput /></InputGroup>);
React API
Her finner du en oversikt over props på komponentene i pakken.