Komponenter och kod har flyttat så det kan det vara lite stökigt här nu!

I april 2025 driftsattes en ny version av komponentbiblioteket som matchar Jordbruksverkets nya grafiska profil. Samtidigt har vi flyttat till en ny plattform, Storybook, där du hämtar kod till komponenterna. Där hittar du även layoutsystemet, färger, ikoner och typografi. Styleguide i Storybook - v22.1.17

Version 13.0.0 är driftsatt

Den här versionen innehåller flera viktiga brytande förändringar. Bland annat har de komponenter som har en label uppdaterats för att HTML-koden ska validera. Versionen innehåller också de nya komponenterna vertikal meny och dropdown.

Nytt och förändrat

Nya komponenter

  • Vertikal meny
  • Dropdown. Denna komponent finns bara som webkomponent.

Felrättningar

  • Sidpanelen, är rättad så att den fungerar på bärbar dator i Chrome.

Brytande förändringar

  • Varningsmeddelande och krismeddelande har nu fått attributet role alert så att de läses upp av skärmläsaren direkt när meddelandet visas på skärmen.
  • Sökkomponenten har fått en dold label som läses upp av skärmläsare. Sökknapparna har också fått en aria label så att även de blir upplästa.
  • Sidhuvudet, det vill säga headern. Attributet aria level är borttaget.
  • Radioknappar. Attributen role och aria-labelledby är bortagna från fieldset.

På de komponenter som innehåller ett label-element har vi tagit bort div-elementen och p-elementen eftersom de elementen inte är tillåtna att ha i en label för att HTML-koden ska validera. De komponenter som berörs är:

  • Bifoga fil
  • Checkboxar
  • Datumfält
  • Multi-select
  • Multitextfält
  • Radioknappar
  • Single-select
  • Textfält
  • Textyta

Något du funderar över?

Hör av dig till styleguideteamet om du vill veta mer eller undrar över något. Du når oss på styleguide@jordbruksverket.se eller genom att komma förbi oss i landskapet i NO3. Vi gillar besök!

Hämta CSS

<link rel="stylesheet" href="https://cdn.jordbruksverket.se/designsystem/13.0.0/package/dist/release/sjv-komponentbibliotek.css" integrity="sha256-c+eUsQVIOaiK7CA0HCjZjIwuDbGzh+U4+yQFAdoF5dg=" crossorigin="anonymous">

Hämta JavaScript

<script src="https://cdn.jordbruksverket.se/designsystem/13.0.0/package/dist/release/sjv-komponentbibliotek.js" integrity="sha256-s4v5U9psFv/wHUego7Q1LJc8yjZ/oB0TvSNLdYgD3xY=" crossorigin="anonymous"></script>

Publicerad