open-index/open-npm huggingface dataset:
npm package: @frekyll/star-names
Description: Get names of the brightest stars in the sky
Author: Josh Wenning
Latest version: 1.1.1

# ✨ star-names [![Build Status](https://travis-ci.org/frekyll/star-names.svg?branch=master)](https://travis-ci.org/frekyll/star-names)
> Get names of the brightest stars in the sky

![](sky.jpg)
Photo by [Jeremy Bishop](https://unsplash.com/@jeremybishop) on [Unsplash](https://unsplash.com/)

## Install
```
$ npm install @frekyll/star-names
```

## Usage
```js
var starNames = require('@frekyll/star-names')

starNames.random()
//=> 'Mizar'
```

## API

### .all
Type: `array`

50 brightest star names in alphabetical order

### .random()

Type: `function`

Random star name

## CLI
```
$ npm install --global @frekyll/star-names
```

```
$ star-names --help

  Examples
    $ star-names
    Mizar
    $ star-names --all
    Achernar
    Acrux
    …
  Options
    --all  Get all names instead of a random name
```

## Related

- [cat-names](https://github.com/sindresorhus/cat-names) - Get popular cat names
- [dog-names](https://github.com/sindresorhus/dog-names) - Get popular dog names
- [random-tree-names](https://github.com/pguth/random-tree-names) - Get tree names
- [yes-no-words](https://github.com/sindresorhus/yes-no-words) - Get yes/no like words

## License

MIT © [Frekyll](https://www.frekyll.com)
npm package: @fremango/dir-tree
Description: Get a tree view of the directory structure.
Author: fremango
Latest version: 0.0.2

# dir-tree

Get a tree view of the directory structure.

![screenshot](https://github.com/itcat99/dir-tree/blob/master/assets/screenshot.png)

## Install

```bash
yarn add global @fremango/dir-tree

#or
npm i -g @fremango/dir-tree
```

## Usage

### Cli

```bash
dir-tree <dir> [options]
```

### Nodejs

```js
const { dirTree, scanDir } = require("dir-tree");

const dir = scanDir({
  dir: "./"
});
console.log("dir for Object", JSON.stringfly(dir, null, 2));
const tree = dirTree({
  dir: "./"
});

console.log("Tree: ", tree);
```

## Apis

### scanDir

> Scan the directory with the configured options, return directory struct object

scanDir(Options, callback)

return `dirStruct`

#### dirStruct

| name     | type        | default | desc                                                                  |
| -------- | ----------- | ------- | --------------------------------------------------------------------- |
| name     | string      | ''      | directory name                                                        |
| isDir    | boolean     | false   | is directory                                                          |
| path     | string      | ''      | directory absolute path                                               |
| children | dirStruct[] | []      | if isDir is `true`, `children` is this directory's children directory |

#### callback

> custom the structure of each item

(itemStruct) => itemStruct

| name       | type      | desc                      |
| ---------- | --------- | ------------------------- |
| itemStruct | dirStruct | directory's struct object |

### dirTree

> return a tree view of the directory structure.

dirTree(options)

## Options

### deep

desc: Scan the depth of the directory, if it is 0, scan all directories and their subdirectories

type: number

default: 0

use in cli: `-d <number>` or `--deep <number>`

### ignore

desc: Ignored directory

type: string[]

default: undefined

use in cli: `-i "<dir>,<dir>,..."` or `--ignore "<dir>,<dir>,..."`

### noChild

desc: Don't scan subdirectories of this directory

type: string[]

default: undefined

use in cli: `-n "<dir>,<dir>,..."` or `--noChild "<dir>,<dir>,..."`

### color

desc: Output color text

type: Boolean

default: true

use in cli: `--no-color` disabled color text
npm package: @fremorie/karatsuba-multiplication
Description: Karatsuba multiplication algorithm in JavaScript
Author: Daria Borisiak
Latest version: 1.0.3

# karatsuba-multiplication

An implementation of Karatsuba's fast multiplication algorithm.

It doesn't rely on JavaScript's `BigInt` numeric values, and therefore can be used in applications that support Internet Explorer and older versions of other various browsers.

### How to use

```javascript
import karatsuba from './path/to/karatsuba-multiplication'

const product = karatsuba(
    '3141592653589793238462643383279502884197169399375105820974944592932384626433832795028',
    '2718281828459045235360287471352662497757247093699959574966967627747135266249775724709'
)

console.log(product)
// 8539734222673567065463550869546574495034888535765114961879601131949421895751017307915218201902672766194368459067342470913720445616413074910762224771809082062649751946852
```


Inspired by [Stanford algorithms course](https://www.coursera.org/specializations/algorithms).
npm package: @fremtind/browserslist-config-jkl
Description: Browserlist configuration for jøkul
Latest version: 2.0.2

# `@fremtind/browserslist-config-jkl`

Inneholder browserslist-konfigurasjonen til Jøkul. Det er en god idé å basere seg på Jøkul sin browserslist i ditt eget prosjekt.

Om konfigurasjonen _ikke passer_ til ditt bruk bør det være et tegn på at det enten er noe galt med konfigurasjonen i Jøkul som bør rettes på, eller at du prøver å støtte nettlesere du ikke trenger å støtte.

## Installasjon

```bash
npm i @fremtind/browserslist-config-jkl
```

## Bruk

Legges til i `package.json`:

```json
{
    "devDependencies": {
        "@fremtind/browserslist-config-jkl": "<versjonsnummer>"
    },
    "browserslist": ["extends @fremtind/browserslist-config-jkl"]
}
```
npm package: @fremtind/jkl-accordion
Description: Jøkul style for accordion menu
Latest version: 12.0.35

# [`@fremtind/jkl-accordion`](https://jokul.fremtind.no/komponenter/accordion)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/accordion).

## Installasjon

**Tips:** om du bruker [React-pakken](../accordion-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-accordion`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-accordion/accordion.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-accordion/accordion";
```
npm package: @fremtind/jkl-accordion-react
Description: Jøkul react accordion component
Latest version: 13.0.19

# [`@fremtind/jkl-accordion-react`](https://jokul.fremtind.no/komponenter/accordion)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/accordion).

## Installasjon

**Tips:** [stilpakken](../accordion/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-accordion-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Accordion } from "@fremtind/jkl-accordion-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-accordion/accordion.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-accordion/accordion";
```
npm package: @fremtind/jkl-alert-message-react
Description: Jøkul alert message components
Latest version: 11.1.24

# [`@fremtind/jkl-alert-message-react`](https://jokul.fremtind.no/komponenter/alertmessage)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/alertmessage).

## Installasjon

**Tips:** [stilpakken](../alert-message/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-alert-message-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { InfoAlertMessage } from "@fremtind/jkl-alert-message-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-alert-message/alert-message.min.css";
// AlertMessage bruker ikonpakken og må ha stilene dens
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-alert-message/alert-message";
// AlertMessage bruker ikonpakken og må ha stilene dens
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-breadcrumb
Description: Jøkul style for breadcrumb
Latest version: 5.1.24

# [`@fremtind/jkl-breadcrumb`](https://jokul.fremtind.no/komponenter/breadcrumb)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/breadcrumb).

## Installasjon

**Tips:** om du bruker [React-pakken](../breadcrumb-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-breadcrumb`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-breadcrumb/breadcrumb.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-breadcrumb/breadcrumb";
```
npm package: @fremtind/jkl-breadcrumb-react
Description: Jøkul react breadcrumb
Latest version: 5.0.43

# [`@fremtind/jkl-breadcrumb-react`](https://jokul.fremtind.no/komponenter/breadcrumb)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/breadcrumb).

## Installasjon

**Tips:** [stilpakken](../breadcrumb/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-breadcrumb-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Breadcrumb } from "@fremtind/jkl-breadcrumb-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-breadcrumb/breadcrumb.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-breadcrumb/breadcrumb";
```
npm package: @fremtind/jkl-button
Description: Jøkul style for buttons
Latest version: 12.2.28

# [`@fremtind/jkl-button`](https://jokul.fremtind.no/komponenter/buttons)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/buttons).

## Installasjon

**Tips:** om du bruker [React-pakken](../button-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-button`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-button/button.min.css";

// Button bruker loader internt for å vise lasteindikator i knappen.
import "@fremtind/jkl-loader/loader.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-loader/loader";
```
npm package: @fremtind/jkl-button-react
Description: Jøkul react button components
Latest version: 15.2.37

# [`@fremtind/jkl-button-react`](https://jokul.fremtind.no/komponenter/buttons)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/buttons).

## Installasjon

**Tips:** [stilpakken](../button/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-button-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { PrimaryButton } from "@fremtind/jkl-button-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-button/button.min.css";

// Button bruker loader internt for å vise lasteindikator i knappen.
import "@fremtind/jkl-loader/loader.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-loader/loader";
```
npm package: @fremtind/jkl-card
Description: Jøkul style for card
Latest version: 13.0.25

# [`@fremtind/jkl-card`](https://jokul.fremtind.no/komponenter/card)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/card).

## Installasjon

**Tips:** om du bruker [React-pakken](../card-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-card`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-card/card.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-card/card";
```
npm package: @fremtind/jkl-card-react
Description: Jøkul react card component
Latest version: 13.0.64

# [`@fremtind/jkl-card-react`](https://jokul.fremtind.no/komponenter/card)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/card).

## Installasjon

**Tips:** [stilpakken](../card/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-card-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { NavCard } from "@fremtind/jkl-card-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-card/card.min.css";

// Kortene bruker flere andre komponenter avhengig av konfigurasjon. Du må også laste inn disse stilarkene.
import "@fremtind/jkl-button/button.min.css";
import "@fremtind/jkl-checkbox/checkbox.min.css";
import "@fremtind/jkl-image/image.min.css";
import "@fremtind/jkl-select/select.min.css";
import "@fremtind/jkl-tag/tag.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-card/card";
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-checkbox/checkbox";
@use "@fremtind/jkl-image/image";
@use "@fremtind/jkl-select/select";
@use "@fremtind/jkl-tag/tag";
```
npm package: @fremtind/jkl-checkbox
Description: Jøkul style for checkbox
Latest version: 11.1.25

# [`@fremtind/jkl-checkbox`](https://jokul.fremtind.no/komponenter/checkbox)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/checkbox).

## Installasjon

**Tips:** om du bruker [React-pakken](../checkbox-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-checkbox`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-checkbox/checkbox.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-checkbox/checkbox";
```
npm package: @fremtind/jkl-checkbox-react
Description: Jøkul react checkbox component
Latest version: 12.0.19

# [`@fremtind/jkl-checkbox-react`](https://jokul.fremtind.no/komponenter/checkbox)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/checkbox).

## Installasjon

**Tips:** [stilpakken](../checkbox/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-checkbox-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { checkbox } from "@fremtind/jkl-checkbox-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-checkbox/checkbox.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-checkbox/checkbox";
```
npm package: @fremtind/jkl-chip-react
Description: Jøkul react chip
Latest version: 1.0.22

# [`@fremtind/jkl-chip-react`](https://jokul.fremtind.no/komponenter/chip)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/chip).

## Installasjon

**Tips:** [stilpakken](../chip/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-chip-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Chip } from "@fremtind/jkl-chip-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-chip/chip.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-chip/chip";
```
npm package: @fremtind/jkl-constants-util
Description: Common constant values shared across all Jøkul projects
Latest version: 3.0.142

# [`@fremtind/jkl-constants-util`](https://jokul.fremtind.no/komponenter/constants)

Se portalen for [en oversikt over hvilke konstanter som finnes](https://jokul.fremtind.no/komponenter/constants).

## Installasjon

1. `npm i @fremtind/jkl-constants-util`.
2. Importér konstantene du trenger.

```js
import { unicode } from "@fremtind/jkl-constants-util";
```
npm package: @fremtind/jkl-contact-information
Description: Jøkul style for contact information
Latest version: 2.0.22

# [`@fremtind/jkl-contact-information`](https://jokul.fremtind.no/komponenter/contact-information)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contact-information).

## Installasjon

**Tips:** om du bruker [React-pakken](../contact-information-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-contact-information`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-contact-information/contact-information.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-contact-information/contact-information";
```
npm package: @fremtind/jkl-contact-information-react
Description: Jøkul react contact-information
Latest version: 2.1.52

# [`@fremtind/jkl-contact-information-react`](https://jokul.fremtind.no/komponenter/contact-information)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contact-information).

## Installasjon

**Tips:** [stilpakken](../contact-information/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-contact-information-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { ContactInformation } from "@fremtind/jkl-contact-information-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-contact-information/contact-information.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-contact-information/contact-information";
```
npm package: @fremtind/jkl-content-toggle
Description: Jøkul style for ContentToggle
Latest version: 6.0.22

# [`@fremtind/jkl-content-toggle`](https://jokul.fremtind.no/komponenter/contenttoggle)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contenttoggle).

## Installasjon

**Tips:** om du bruker [React-pakken](../content-toggle-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-content-toggle`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-content-toggle/content-toggle.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-content-toggle/content-toggle";
```
npm package: @fremtind/jkl-content-toggle-react
Description: Jøkul react content-toggle component
Latest version: 6.0.23

# [`@fremtind/jkl-content-toggle-react`](https://jokul.fremtind.no/komponenter/contenttoggle)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contenttoggle).

## Installasjon

**Tips:** [stilpakken](../content-toggle/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-content-toggle-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { ContentToggle } from "@fremtind/jkl-content-toggle-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-content-toggle/content-toggle.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-content-toggle/content-toggle";
```
npm package: @fremtind/jkl-contextual-menu
Description: Jøkul style for contextual-menu
Latest version: 2.3.22

# [`@fremtind/jkl-contextual-menu`](https://jokul.fremtind.no/komponenter/contextual-menu)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contextual-menu).

## Installasjon

**Tips:** om du bruker [React-pakken](../contextual-menu-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-contextual-menu`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-contextual-menu/contextual-menu.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-contextual-menu/contextual-menu";
```
npm package: @fremtind/jkl-contextual-menu-react
Description: Jøkul react contextual-menu
Latest version: 3.8.32

# [`@fremtind/jkl-contextual-menu-react`](https://jokul.fremtind.no/komponenter/contextual-menu)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/contextual-menu).

## Installasjon

**Tips:** [stilpakken](../contextual-menu/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-contextual-menu-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { ContextualMenu } from "@fremtind/jkl-contextual-menu-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-contextual-menu/contextual-menu.min.css";
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-contextual-menu/contextual-menu";
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-cookie-consent-react
Description: Jøkul react cookie consent component
Latest version: 11.2.11

# [`@fremtind/jkl-cookie-consent-react`](https://jokul.fremtind.no/komponenter/cookieconsent)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/cookieconsent).

## Installasjon

**Tips:** [stilpakken](../cookie-consent/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-cookie-consent-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import {
    CookieConsentProvider,
    CookieConsent,
    useCookieConsent,
} from "@fremtind/jkl-cookie-consent-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-cookie-consent/cookie-consent.min.css";

// CookieConsent bruker flere andre komponenter og trenger stilarkene deres for å fungere.
import "@fremtind/jkl-button/button.min.css";
import "@fremtind/jkl-list/list.min.css";
import "@fremtind/jkl-modal/modal.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-cookie-consent/cookie-consent";
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-list/list";
@use "@fremtind/jkl-modal/modal";
```
npm package: @fremtind/jkl-datepicker
Description: Jøkul style for datepicker
Latest version: 12.1.56

# [`@fremtind/jkl-datepicker`](https://jokul.fremtind.no/komponenter/datepicker)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/datepicker).

## Installasjon

**Tips:** om du bruker [React-pakken](../datepicker-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-datepicker`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-datepicker/datepicker.min.css";

// DatePicker bruker flere komponenter internt, avhengig av konfigurasjon. Select blir bare brukt i utvidet velger.
import "@fremtind/jkl-icon-button/icon-button.min.css";
import "@fremtind/jkl-select/select.min.css";
import "@fremtind/jkl-text-input/text-input.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-datepicker/datepicker";
@use "@fremtind/jkl-icon-button/icon-button";
@use "@fremtind/jkl-select/select";
@use "@fremtind/jkl-text-input/text-input";
```
npm package: @fremtind/jkl-description-list
Description: The description list component is a container whose children is a key-value pair consisting of terms and details.
Latest version: 8.0.42

# [`@fremtind/jkl-description-list`](https://jokul.fremtind.no/komponenter/descriptionlist)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/descriptionlist).

## Installasjon

**Tips:** om du bruker [React-pakken](../description-list-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-description-list`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-description-list/description-list.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-description-list/description-list";
```
npm package: @fremtind/jkl-description-list-react
Description: The description list component is a container whose children is a key-value pair consisting of terms and details.
Latest version: 8.0.43

# [`@fremtind/jkl-description-list-react`](https://jokul.fremtind.no/komponenter/descriptionlist)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/descriptionlist).

## Installasjon

**Tips:** [stilpakken](../description-list/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-description-list-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { DescriptionList } from "@fremtind/jkl-description-list-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-description-list/description-list.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-description-list/description-list";
```
npm package: @fremtind/jkl-divider-line
Description: Jøkul style for divider line
Latest version: 1.1.27

# [`divider-line`](https://fremtind.github.io/jokul/komponenter/dividerline)

Delelinjer skiller innhold visuelt fra hverandre. Den kan brukes dersom innholdet på begge sider av linjen er urelatert men fortsatt skal være på samme side. Bredden til delelinjen bør stå i stil til innholdet.
npm package: @fremtind/jkl-divider-line-react
Description: Jøkul react divider line component
Latest version: 1.3.3

# [`@fremtind/jkl-divider-line-react`](https://fremtind.github.io/jokul/komponenter/dividerline)

## Beskrivelse

Se portalen for [bruk og prinsipper](https://fremtind.github.io/jokul/komponenter/dividerline).

## Kom i gang

[Lær hvordan du kan ta i bruk Jøkul](https://fremtind.github.io/jokul/developer/getting-started/)
npm package: @fremtind/jkl-expand-button
Description: Jøkul style for expand-button
Latest version: 7.1.24

# [`@fremtind/jkl-expand-button`](https://jokul.fremtind.no/komponenter/expandbutton)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/expandbutton).

## Installasjon

**Tips:** om du bruker [React-pakken](../expand-button-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-expand-button`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-expand-button/expand-button.min.css";

// Ekspanderknappen bruker icons-pakka for å animere pila
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-expand-button/expand-button";
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-expand-button-react
Description: Jøkul react expand-button
Latest version: 7.1.16

# [`@fremtind/jkl-expand-button-react`](https://jokul.fremtind.no/komponenter/expandbutton)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/expandbutton).

## Installasjon

**Tips:** [stilpakken](../expand-button/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-expand-button-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { ExpandButton } from "@fremtind/jkl-expand-button-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-expand-button/expand-button.min.css";

// Ekspanderknappen bruker icons-pakka for å animere pila
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-expand-button/expand-button";
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-expandable
Description: Jøkul style for expandable
Latest version: 7.2.16

# [`@fremtind/jkl-expandable`](https://jokul.fremtind.no/komponenter/expandable)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/expandable).

## Installasjon

**Tips:** om du bruker [React-pakken](../expandable-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-expandable`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-expandable/expandable.min.css";

// Expandable bruker icons-pakka internt
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-expandable/expandable";
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-feedback
Description: Jøkul style for feedback
Latest version: 13.1.24

# [`@fremtind/jkl-feedback`](https://jokul.fremtind.no/komponenter/feedback)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/feedback).

## Installasjon

**Tips:** om du bruker [React-pakken](../feedback-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-feedback`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-feedback/feedback.min.css";

// Feedback bruker flere andre komponenter og trenger stilarkene deres for å fungere.
import "@fremtind/jkl-button/button.min.css";
import "@fremtind/jkl-message/message.min.css";
import "@fremtind/jkl-radio-button/radio-button.min.css";
import "@fremtind/jkl-text-input/text-input.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-feedback/feedback";
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-message/message";
@use "@fremtind/jkl-radio-button/radio-button";
@use "@fremtind/jkl-text-input/text-input";
```
npm package: @fremtind/jkl-field-group
Description: Style for fieldsets in Jøkul
Latest version: 6.0.10

# [`@fremtind/jkl-field-group`](https://jokul.fremtind.no/komponenter/fieldgroup)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/fieldgroup).

## Installasjon

**Tips:** om du bruker [React-pakken](../field-group-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-field-group`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-field-group/field-group.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-field-group/field-group";
```
npm package: @fremtind/jkl-field-group-react
Description: Used to create a fieldset around groups of inputs
Latest version: 8.0.1

# [`@fremtind/jkl-field-group-react`](https://jokul.fremtind.no/komponenter/fieldgroup)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/fieldgroup).

## Installasjon

**Tips:** [stilpakken](../field-group/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-field-group-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { FieldGroup } from "@fremtind/jkl-field-group-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-field-group/field-group.min.css";

// For enkelte features må du også ha denne CSSen importert.
import "@fremtind/jkl-tooltip/tooltip.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-field-group/field-group";
```
npm package: @fremtind/jkl-file-input-react
Description: Jøkul react file-input
Latest version: 2.5.13

# [`@fremtind/jkl-file-input-react`](https://jokul.fremtind.no/komponenter/fileinput)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/fileinput).

## Installasjon

**Tips:** [stilpakken](../file-input/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-file-input-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { FileInput } from "@fremtind/jkl-file-input-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-file-input/file-input.min.css";
import "@fremtind/jkl-button/button.min.css";
import "@fremtind/jkl-icon-button/icon-button.min.css";
import "@fremtind/jkl-icons/icons.min.css";
import "@fremtind/jkl-input-group/input-group.min.css";
import "@fremtind/jkl-progress-bar/progress-bar.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-file-input/file-input";
@use "@fremtind/jkl-button/button";
@use "@fremtind/jkl-icon-button/icon-button";
@use "@fremtind/jkl-icons/icons";
@use "@fremtind/jkl-input-group/input-group";
@use "@fremtind/jkl-progress-bar/progress-bar";
```
npm package: @fremtind/jkl-footer
Description: Jøkul style for footer
Latest version: 6.0.22

# [`@fremtind/jkl-footer`](https://jokul.fremtind.no/komponenter/footer)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/footer).

## Installasjon

**Tips:** om du bruker [React-pakken](../footer-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-footer`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-footer/footer.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-footer/footer";
```
npm package: @fremtind/jkl-footer-react
Description: Jøkul react footer
Latest version: 6.1.52

# [`@fremtind/jkl-footer-react`](https://jokul.fremtind.no/komponenter/footer)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/footer).

## Installasjon

**Tips:** [stilpakken](../footer/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-footer-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Footer } from "@fremtind/jkl-footer-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-footer/footer.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-footer/footer";
```
npm package: @fremtind/jkl-formatters-util
Description: Formatters for common data formats in Jøkul
Latest version: 6.0.59

# [`@fremtind/jkl-formatters-util`](https://jokul.fremtind.no/komponenter/formatters)

Se portalen for [en oversikt over hvilke formateringsfunksjoner som finnes](https://jokul.fremtind.no/komponenter/formatters).

Det er også mulig å bruke formateringsfunksjonene for å lage inputmasker. Pakken har ferdige hjelpefunksjoner for React Hook Form. [Se portalen for eksempler](https://jokul.fremtind.no/komponenter/formatters#maskering-av-skjemafelter).

## Installasjon

1. `npm i @fremtind/jkl-formatters-util`.
2. Importér formateringsfunksjonene du trenger.

```js
import { formatTelefonnummer } from "@fremtind/jkl-formatters-util";
```
npm package: @fremtind/jkl-grid
Description: Jøkul style for grid
Latest version: 0.6.3

# `grid`

Pure CSS implementation of 12 point grid.

* Large device: 12 element grid, max 1200px
* Medium device: 8 element grid
* Small device: 4 element grid


## Usage

```tsx
<main className="grid-container">
    <div className="grid-item--12">
        <Element />
    </div>
    <div className="grid-item--4">
        <Element />
    </div>
    <div className="grid-item--4">
        <Element />
    </div>
    <div className="grid-item--4">
        <Element />
    </div>
</main>
```
npm package: @fremtind/jkl-grid-react
Description: Jøkul react grid component
Latest version: 0.5.4

# `grid-react`

The React wrapper for jkl-grid component

## Usage
```tsx
<Grid>
    <GridElement cols={{ small: 1, medium: 1, large: 1 }}>
        Content
    </GridElement>
    <GridElement cols={12}>
        Full width content
    </GridElement>
</Grid>
```
npm package: @fremtind/jkl-hamburger
Description: Jøkul style for hamburger menu
Latest version: 13.0.13

# [`@fremtind/jkl-hamburger`](https://jokul.fremtind.no/komponenter/hamburger)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/hamburger).

## Installasjon

**Tips:** om du bruker [React-pakken](../hamburger-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-hamburger`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-hamburger/hamburger.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-hamburger/hamburger";
```
npm package: @fremtind/jkl-hamburger-react
Description: Jøkul react hamburger component
Latest version: 12.0.16

# [`@fremtind/jkl-hamburger-react`](https://jokul.fremtind.no/komponenter/hamburger)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/hamburger).

## Installasjon

**Tips:** [stilpakken](../hamburger/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-hamburger-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Hamburger } from "@fremtind/jkl-hamburger-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-hamburger/hamburger.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-hamburger/hamburger";
```
npm package: @fremtind/jkl-icon-button
Description: Jøkul style for buttons
Latest version: 4.0.45

# [`@fremtind/jkl-icon-button`](https://jokul.fremtind.no/komponenter/iconbutton)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/iconbutton).

## Installasjon

**Tips:** om du bruker [React-pakken](../icon-button-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-icon-button`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-icon-button/icon-button.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-icon-button/icon-button";
```
npm package: @fremtind/jkl-icon-button-react
Description: Jøkul react icon-button components
Latest version: 5.0.45

# [`@fremtind/jkl-icon-button-react`](https://jokul.fremtind.no/komponenter/iconbutton)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/iconbutton).

## Installasjon

**Tips:** [stilpakken](../icon-button/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-icon-button-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { IconButton } from "@fremtind/jkl-icon-button-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-icon-button/icon-button.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-icon-button/icon-button";
```
npm package: @fremtind/jkl-icons
Description: Jøkul style for icons
Latest version: 10.1.22

# [`@fremtind/jkl-icons`](https://jokul.fremtind.no/komponenter/icons)

Denne pakken inneholder stiler for animerte ikoner. Stiler for uanimerte ikoner finner du i [core](../core/).

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/icons).

## Installasjon

**Tips:** om du bruker [React-pakken](../icons-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-icons`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-icons-react
Description: Icons in Jøkul style
Latest version: 9.2.11

# [`@fremtind/jkl-icons-react`](https://jokul.fremtind.no/komponenter/icons)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/icons).

## Installasjon

**Tips:** [stilpakken](../icons/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-icons-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { ArrowDown, ArrowHorizontalAnimated } from "@fremtind/jkl-icons-react";

// Importer stilark via JavaScript med CSS-loader.
// CSS for uanimerte ikoner ligger i core.
import "@fremtind/jkl-core/core.min.css";
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-core/core";
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-image
Description: Jøkul style for image
Latest version: 6.0.42

# [`@fremtind/jkl-image`](https://jokul.fremtind.no/komponenter/image)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/image).

## Installasjon

**Tips:** om du bruker [React-pakken](../image-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-image`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-image/image.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-image/image";
```
npm package: @fremtind/jkl-input-group
Description: Jøkul style for input-group
Latest version: 3.1.24

# [`@fremtind/jkl-input-group`](https://jokul.fremtind.no/komponenter/input-group)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/input-group).

## Installasjon

**Tips:** om du bruker [React-pakken](../input-group-react/) trenger du ikke installere denne pakken direkte.

1. `yarn add @fremtind/jkl-input-group` eller `npm i @fremtind/jkl-input-group`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-input-group/input-group.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-input-group/input-group";
```
npm package: @fremtind/jkl-input-group-react
Description: Jøkul react input-group
Latest version: 4.0.18

# [`@fremtind/jkl-input-group-react`](https://jokul.fremtind.no/komponenter/input-group)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/input-group).

## Installasjon

**Tips:** [stilpakken](../input-group/) blir automatisk installert som en avhengighet.

1. `yarn add @fremtind/jkl-input-group-react` eller `npm i @fremtind/jkl-input-group-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { InputGroup } from "@fremtind/jkl-input-group-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-input-group/input-group.min.css";

// For enkelte features må du også ha denne CSSen importert.
import "@fremtind/jkl-tooltip/tooltip.min.css";
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-input-group/input-group";
```
npm package: @fremtind/jkl-list
Description: Jøkul style for list
Latest version: 12.0.4

# [`@fremtind/jkl-list`](https://jokul.fremtind.no/komponenter/list)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/list).

## Installasjon

**Tips:** om du bruker [React-pakken](../list-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-list`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-list/list.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-list/list";
```
npm package: @fremtind/jkl-logo
Description: Jøkul style for Fremtind logo
Latest version: 11.0.42

# [`@fremtind/jkl-logo`](https://jokul.fremtind.no/komponenter/logo)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/logo).

## Installasjon

**Tips:** om du bruker [React-pakken](../logo-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-logo`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-logo/logo.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-logo/logo";
```
npm package: @fremtind/jkl-menu
Description: Jøkul style for menu
Latest version: 2.3.21

# [`@fremtind/jkl-menu`](https://jokul.fremtind.no/komponenter/menu)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/menu).

## Installasjon

**Tips:** om du bruker [React-pakken](../menu-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-menu`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-menu/menu.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-menu/menu";
```
npm package: @fremtind/jkl-message
Description: Jøkul message style
Latest version: 1.1.25

# [`@fremtind/jkl-message`](https://jokul.fremtind.no/komponenter/message)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/message).

## Installasjon

**Tips:** om du bruker [React-pakken](../message-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-message`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-message/message.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-message/message";
```
npm package: @fremtind/jkl-message-react
Description: Jøkul react message components
Latest version: 1.1.30

# [`@fremtind/jkl-message-react`](https://jokul.fremtind.no/komponenter/message)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/message).

## Installasjon

**Tips:** [stilpakken](../message/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-message-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { InfoMessage } from "@fremtind/jkl-message-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-message/message.min.css";
// Komponenten trenger stilarket til ikonpakka for å vises riktig
import "@fremtind/jkl-icons/icons.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-message/message";
// Komponenten trenger stilarket til ikonpakka for å vises riktig
@use "@fremtind/jkl-icons/icons";
```
npm package: @fremtind/jkl-modal
Description: Jøkul style for modal
Latest version: 2.2.26

# [`@fremtind/jkl-modal`](https://jokul.fremtind.no/komponenter/modal)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/modal).

## Installasjon

**Tips:** om du bruker [React-pakken](../modal-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-modal`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-modal/modal.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-modal/modal";
```
npm package: @fremtind/jkl-popover-react
Description: Jøkul react popover
Latest version: 1.2.23

# [`@fremtind/jkl-popover-react`](https://jokul.fremtind.no/komponenter/popover)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/popover).

## Installasjon

**Tips:** [stilpakken](../popover/) blir automatisk installert som en avhengighet.

1. `npm i @fremtind/jkl-popover-react`.
2. Importér _både_ React-komponent og stilark i prosjektet ditt.

```js
import { Popover } from "@fremtind/jkl-popover-react";

// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-popover/popover.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-popover/popover";
```
npm package: @fremtind/jkl-portal-components
Description: Components for showing examples in the Jøkul portal
Author: Fremtind Forsikring
Latest version: 0.12.1

# `@fremtind/jkl-portal-components`

> TODO: description

## Usage

```
const jklPortalComponents = require('@fremtind/jkl-portal-components');

// TODO: DEMONSTRATE API
```
npm package: @fremtind/jkl-progress-bar
Description: Jøkul style for progress bar
Latest version: 6.1.24

# [`@fremtind/jkl-progress-bar`](https://jokul.fremtind.no/komponenter/progressbar)

Se portalen for [bruk og prinsipper](https://jokul.fremtind.no/komponenter/progressbar).

## Installasjon

**Tips:** om du bruker [React-pakken](../progress-bar-react/) trenger du ikke installere denne pakken direkte.

1. `npm i @fremtind/jkl-progress-bar`.
2. Importér stil-pakken i prosjektet ditt.

```js
// Importer stilark via JavaScript med CSS-loader.
import "@fremtind/jkl-progress-bar/progress-bar.min.css";
```

```scss
// Eller importer stilark via SCSS.
@use "@fremtind/jkl-progress-bar/progress-bar";
```