@oslokommune/punkt-react

Bruk av punkt-react

Dette repoet inneholder Punkt sine UI-komponenter for React. Komponentene er laget for å fungere sammen med @oslokommune/punkt-assets og @oslokommune/punkt-css. De fleste komponenter tar i bruk custom elements fra @oslokommune/punkt-elements. Enn så lenge støtter vi ikke full bruk i server-side-genererte apper.

📝 Forutsetninger

Peer dependencies:

• nodejs 20.19.1
• react >= 18
• @oslokommune/punkt-assets *
• @oslokommune/punkt-css *

🚀 Kom i gang - npm

1. Installer komponentbiblioteket

npm add @oslokommune/punkt-react

2. Importer komponentene

// src/App.tsx

import { PktButton, PktTextInput } from "@oslokommune/punkt-react";

...

  <PktTextInput label="First name" id="firstName" />
  <PktButton skin="primary" variant="icon-left" iconName="user">
    Testbutton
  </PktButton>

🟪 Ikoner

Alle våre komponenter bruker PktIcon-komponenten for å importere ikonene via vår CDN.

Om du har en content security policy(CSP) satt opp må du åpne for https://punkt-cdn.oslo.kommune.no/ i din CSP.

Les mer om ikoner her.

🧩 Komponentbiblioteket

For beskrivelse av hvordan ta i bruk hver enkelt komponent se om komponenter.

🔢 Versjonering

Punkt bruker Semantic Versioning 2.0.0 for versjonering av pakkene.

👮 Lisens

Punkt er distribuert under MIT-lisens for åpen kildekode.