open-index/open-npm huggingface dataset:
npm package: @sb1/indeks-react
Description: React components for Indeks design system
Latest version: 0.2.21

# @sb1/indeks-react

React-komponenter for Indeks designsystemet. Denne pakken inneholder ferdigbygde React-komponenter med tilhørende TypeScript-typer.

## 📦 Del av Indeks

Denne pakken er en del av [Indeks designsystemet](https://github.com/SpareBank1/indeks) og må brukes sammen med CSS-styling:

- **CDN (anbefalt)** - Last inn CSS fra `cdn.sparebank1.no/indeks/css/<versjon>.css`
- eller importer via **@sb1/indeks-css** og installer via npm

## 📥 Installasjon

```bash
npm install @sb1/indeks-react
```

## 🎨 Styling

Komponentene krever at du inkluderer Indeks CSS.

### Metode 1: Via CDN (anbefalt)

```html
<!-- index.html -->
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="https://cdn.sparebank1.no/indeks/css/<versjon>.css" />
    </head>
    <body>
        <div id="root"></div>
    </body>
</html>
```

### Metode 2: Via npm

```bash
npm install @sb1/indeks-css
```

```jsx
// main.tsx eller App.tsx
import '@sb1/indeks-css';
```

## ✨ Bruk

```jsx
import { Button, Card, Heading, Text, HStack, VStack } from '@sb1/indeks-react';

function App() {
    return (
        <VStack gap="4">
            <Card>
                <Heading as="h1">Velkommen til Indeks</Heading>
                <Text>Dette er en eksempelapp med Indeks-komponenter.</Text>
                <HStack gap="2">
                    <Button variant="primary">Primær knapp</Button>
                    <Button variant="secondary">Sekundær knapp</Button>
                </HStack>
            </Card>
        </VStack>
    );
}
```

## 🔧 TypeScript

Pakken inkluderer TypeScript-definisjoner for alle komponenter:

```tsx
import { ButtonProps, CardProps } from '@sb1/indeks-react';

const MyButton: React.FC<ButtonProps> = (props) => {
    return <Button {...props} />;
};
```

## 🔗 Relaterte pakker

- [@sb1/indeks-css](https://www.npmjs.com/package/@sb1/indeks-css) - CSS-styling (via CDN eller npm)
- [@sb1/indeks-tokens](https://www.npmjs.com/package/@sb1/indeks-tokens) - Design tokens (trenger ikke egen import)
- [@sb1/indeks-utils](https://www.npmjs.com/package/@sb1/indeks-utils) - Utility-klasser (trenger ikke egen import)

## 📚 Dokumentasjon

Full dokumentasjon finnes på:

**[Midlertidig lenke Indeks](https://automatic-meme-yv23n9e.pages.github.io/)**


## 🧩 Opprette nye komponenter

Nye komponenter genereres med [Plop](https://plopjs.com/):

```bash
npm run create-component
```

Dette oppretter komponent, story og test i riktig mappestruktur under `lib/components/`.

## 🎯 Peer Dependencies

Denne pakken krever:

- `react` ^18.0.0 || ^19.0.0
- `react-dom` ^18.0.0 || ^19.0.0

## 📄 Lisens

MIT
npm package: @sb1/indeks-tokens
Description: Design tokens for Indeks design system
Latest version: 0.4.18

# @sb1/indeks-tokens

Design tokens for Indeks designsystemet. Denne pakken inneholder farger, spacing, typografi og andre designtokens som brukes i hele designsystemet.

## 📦 Del av Indeks

Denne pakken er en del av [Indeks designsystemet](https://github.com/SpareBank1/indeks) og brukes internt av:

- **@sb1/indeks-css** - CSS-biblioteket (inkluderer tokens automatisk)
- **@sb1/indeks-utils** - CSS utility-klasser
- **@sb1/indeks-react** - React-komponenter

## 💡 Bør du installere denne pakken?

**Nei, sannsynligvis ikke.** I de fleste tilfeller bør du bruke pakken `indeks-css` (se under for installasjon)

`@sb1/indeks-css` inkluderer allerede alle tokens og utils, så du trenger ikke å installere dem separat.

## ⚙️ Når bør du installere denne pakken?

Du trenger kun å installere `@sb1/indeks-tokens` hvis du:

1. **Skal bruke tokens direkte** i dine egne CSS-filer
2. **Bygger egne verktøy** som trenger tilgang til token-data
3. **Trenger TypeScript-typer** for tokens

**OBS:** Du trenger ikke installere pakken for å kjøre scripts. Fremtidige scripts (eksport til iOS/Android, custom themes) kan kjøres direkte med `npx @sb1/indeks-tokens <kommando>`.

## 📥 Installasjon

Via CDN (anbefalt):

```html
<link rel="stylesheet" href="https://cdn.sparebank1.no/indeks/css/<versjon>.css" />
```

Via npm:

```bash
npm install @sb1/indeks-tokens
```

## 🎨 Bruk

### Importer CSS-tokens

```css
@import '@sb1/indeks-tokens';
```

### Scripts (kommer snart)

Fremtidige scripts vil inkludere:

- Eksport av fargetokens for Android
- Eksport av fargetokens for iOS
- Generering av egne themes

Disse kan kjøres med `npx @sb1/indeks-tokens <kommando>` uten å installere pakken.

## 🔗 Relaterte pakker

- [@sb1/indeks-css](https://www.npmjs.com/package/@sb1/indeks-css) - Komplett CSS-bibliotek (anbefalt)
- [@sb1/indeks-utils](https://www.npmjs.com/package/@sb1/indeks-utils) - CSS utility-klasser
- [@sb1/indeks-react](https://www.npmjs.com/package/@sb1/indeks-react) - React-komponenter

## 📚 Dokumentasjon

Full dokumentasjon finnes på:
**[Midlertidig lenke Indeks](https://automatic-meme-yv23n9e.pages.github.io/)**

## 📄 Lisens

MIT
npm package: @sb1/indeks-utils
Description: CSS utility classes for Indeks design system
Latest version: 0.1.22

# @sb1/indeks-utils

CSS utility-klasser for Indeks designsystemet. Denne pakken inneholder hjelpeklasser for spacing, layout, farger og mer.

## 📦 Del av Indeks

Denne pakken er en del av [Indeks designsystemet](https://github.com/SpareBank1/indeks) og brukes internt av:

-   **@sb1/indeks-css** - CSS-biblioteket (inkluderer utils automatisk)

## 💡 Bør du installere denne pakken?

**Nei, du bør bruke CDN eller `@sb1/indeks-css` i stedet.**

Via CDN (anbefalt):

```html
<link rel="stylesheet" href="https://cdn.sparebank1.no/indeks/css/<versjon>.css" />
```

Via npm:

```bash
npm install @sb1/indeks-css
```

`@sb1/indeks-css` inkluderer allerede alle utility-klasser, så du trenger ikke å installere dem separat.

## ⚙️ Når bør du installere denne pakken?

Det er sjelden nødvendig å installere `@sb1/indeks-utils` direkte. Du trenger kun denne pakken hvis du:

1. **Bygger egne verktøy** som trenger tilgang til kun utility-klassene
2. **Har spesifikke krav** om å bruke utils uten resten av CSS-biblioteket

## 📥 Installasjon

```bash
npm install @sb1/indeks-utils
```

## 🎨 Bruk

### Importer utilities

```css
@import '@sb1/indeks-utils';
```

Utilities inkluderer klasser som:

-   Spacing utilities (margin, padding)
-   Color utilities (bakgrunnsfarger, tekstfarger)
-   Layout utilities
-   Og mer

## 🔗 Relaterte pakker

-   [@sb1/indeks-css](https://www.npmjs.com/package/@sb1/indeks-css) - Komplett CSS-bibliotek (anbefalt)
-   [@sb1/indeks-tokens](https://www.npmjs.com/package/@sb1/indeks-tokens) - Design tokens
-   [@sb1/indeks-react](https://www.npmjs.com/package/@sb1/indeks-react) - React-komponenter

## 📚 Dokumentasjon

Full dokumentasjon finnes på
**[Midlertidig lenke Indeks](https://automatic-meme-yv23n9e.pages.github.io/)**

## 📄 Lisens

MIT
npm package: @sb1/stylelint-config-ffe
Description: FFE shareable config for stylelint
Author: SpareBank 1
Latest version: 100.12.3

# @sb1/stylelint-config-ffe

A (stylelint)[https://stylelint.io/] extension with rules for working with FFE components.

## Usage

Add stylelint and this package to your project:

```bash
npm install --save-dev stylelint @sb1/stylelint-config-ffe
```

Configure your stylelint configuration file to extend this package:

```javascript
module.export = {
    extends: ['@sb1/stylelint-config-ffe'],
};
```

## References

### @sb1/ffe-no-deprecated-color-vars

Disallow deprecated less color variables.

```javascript
module.export = {
    extends: ['@sb1/stylelint-config-ffe']
    overrides: [
        {
            files: ['**/*.less'],
            customSyntax: 'postcss-less',
            rules: {
                '@sb1/ffe-no-deprecated-color-vars': true
            }
        }
    ]
}
```

#### Options

#### `true`

The following code is considered a problem:

```less
a {
    color: @ffe-blue-deep-sky;
    /** ffe-blue-deep-sky is deprecated */
}
```
npm package: @sbacic/styled-components-helpers
Description: Helpers for handling props in styled-components.
Latest version: 1.0.3

# Styled-components-helpers

Helpers for handling props in styled-components.

## Installation

`yarn add @sbacic/styled-components-helpers`

## Example

```JSX
    const Element = styled.div`
      color: black;

      ${has('alternate')`
        color: blue;
      `}

      ${is('status', 'warning')`
        border: 1px solid red;
      `}
    `;

    <Element alternate status="warning" />
```

## API

`has(attribute: string)`

Apply styles if the component has `attribute`.

`is(attribute: string, value: unknown)`

Apply styles if the component's `attribute` matches `value`.

`any(attributes: string[])`

Apply styles if the component has at least one attribute from `attributes`.

`all(attributes: string[])`

Apply styles only if the component has all the listed `attributes`.

`none(attributes: string[])`

Apply styles only if the component has one of the listed `attributes`.
npm package: @sbaldwin24/eslint-config
Description: Sterling Baldwin's eslint config
Author: Sterling Baldwin
Latest version: 1.0.0

# freedomfirst-eslint-config

## Installation

`npm install --save-dev @sbaldwin24/eslint-config `

## Usage

Create a `.eslintrc.js` file in your project's root and paste:

```js
module.exports = {
  parser: '@babel/eslint-parser',
  extends: [
    '@sbaldwin24/eslint-config',
    '@sbaldwin24/eslint-config/node',
    '@sbaldwin24/eslint-config/prettier',
    '@sbaldwin24/eslint-config/react',
  ],
};
```

### VSCode Config

1. Install [ESLint package](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
2. Install `npm install -g npm@latest eslint`
3. Copy and paste the following to VSCode's settings:

```js
// Add format on save
"editor.formatOnSave": true,
// Turn off format on save for JS and JSX, we want eslint to format on save
"[javascript]": {
  "editor.formatOnSave": false
},
"[javascriptreact]": {
  "editor.formatOnSave": false
},
// ESLint plugin will run when you save
"eslint.autoFixOnSave": true,
"prettier.disableLanguages": ["javascript", "javascriptreact"],
```
npm package: @sbaldwin24/stylelint-config
Description: Sterling Baldwin's stylelint config
Author: Sterling Baldwin
Latest version: 1.0.0

# @sbaldwin24/stylelint-config

> Sterling's Stylelint configuration

## Getting started

To install `@sbaldwin24/stylelint-config` in your project, you will need to run the
following command using [npm](https://www.npmjs.com/):

```bash
npm install -S @sbaldwin24/stylelint-config
```

If you prefer [Yarn](https://yarnpkg.com/en/), use the following command
instead:

```zsh
yarn add @sbaldwin24/stylelint-config
```

## Usage

You can use `@sbaldwin24/stylelint-config` in your project by extending it in your
`stylelint` configuration. For example, if we had a `.stylelintrc` file:

```json
{
  "extends": ["@sbaldwin24/stylelint-config"]
}
```

## 🙌 Contributing

We're always looking for contributors to help us fix bugs, build new features,
or help us improve the project documentation. If you're interested, definitely
check out our [Contributing Guide](/.github/CONTRIBUTING.md)! `👀`
npm package: @sbardian/gatsby-source-amazon-wishlist
Description: Gatsby source plugin for loading items from an Amazon Wishlist
Latest version: 2.1.17

# @sbardian/gatsby-source-amazon-wishlist

> Loads items from an Amazon Wishlist into Gatsby.js

> Fork from [Unobvious-Technology](https://github.com/Unobvious-Technology/gatsby-plugin-source-amazon-wishlist).

## Installation

```bash
npm install @sbardian/gatsby-source-amazon-wishlist
```

## Usage

Edit `gatsby-config.js` to use the plugin:

```javascript
{
    ...
    plugins: [
    ...
    {
      resolve: '@sbardian/gatsby-source-amazon-wishlist',
      options: {
        lists: [
          {
            owner: 'Brian',
            wishlistUrl: 'https://www.amazon.com/hz/wishlist/ls/<wishlist code>',
            limit: 25,
          },
          {
            owner: 'Bob',
            wishlistUrl: 'https://www.amazon.com/hz/wishlist/ls/<wishlist code>',
          }
        ]
      },
    },
  ]
}
```

### Options

- `lists`: Array of wishlist options `<Array>`
  - `owner`: Owner of wishlist: `<String>`
  - `wishlistUrl`: URL to your amazon wishlist, must be `public` or `shared`: `<String>`
  - `limit`: Whether to stop fetching at a specific limit, defaults to `false`: `<Int>`

## Querying

You can query the nodes created by the plugin as follows:

StaticQuery

```
graphql`
{
  allAmazonWishlistItem {
    edges {
      node {
        id
        owner
        title
        url
        price
        features
        comment
        priority
        purchased
        requested
        image {
          url
        }
      }
    }
  }
}
`
```

Page query with filters

```
graphql`
{
  allAmazonWishlistItem(filter: { owner: { eq: "brian" } }) {
    edges {
      node {
        id
        owner
        title
        url
        price
        features
        comment
        priority
        purchased
        requested
        image {
          url
        }
      }
    }
  }
}
`
```
npm package: @sbayet/holydates
Description: Command line tool to retrieve holydays by country
Author: Serge Bayet
Latest version: 1.0.0

# holydates

An online tool written in node.js to list the holidays in a country at a certain year.

## Usage

```holydates [country] [year]```

If year is ommited, the current year is the default value.

## Example

```holydates Belgium 1977```

```
Holydates in Belgium (BE) for the year 1977

1977-01-01 : New Year's Day
1977-04-10 : Easter Sunday
1977-04-11 : Easter Monday
1977-05-01 : Labour Day
1977-05-19 : Ascension Day
1977-05-30 : Whit Monday
1977-07-21 : Belgian National Day
1977-08-15 : Assumption Day
1977-11-01 : All Saints' Day
1977-11-11 : Armistice Day
1977-12-25 : Christmas Day

Thanks for using holydates!
```