open-index/open-npm huggingface dataset:
npm package: @ohshitnotgood/kmanim
Description: Animation components used by kam.insektionen.se
Author: Praanto Samadder
Latest version: 0.0.2

Animation components used by the KAM front-end website. 

KAM, which stands for Kista Arbetsmarknadsdag, is the yearly work fair
organised by the IN-chapter in KTH Kista.
npm package: @ohshitnotgood/kmform
Description: Those templates dependencies are maintained via [pnpm](https://pnpm.io) via `pnpm up -Lri`.
Latest version: 0.0.3-1

## Usage

Those templates dependencies are maintained via [pnpm](https://pnpm.io) via `pnpm up -Lri`.

This is the reason you see a `pnpm-lock.yaml`. That being said, any package manager will work. This file can be safely be removed once you clone a template.

```bash
$ npm install # or pnpm install or yarn install
```

### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)

## Available Scripts

In the project directory, you can run:

### `npm run dev` or `npm start`

Runs the app in the development mode.<br>
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.

The page will reload if you make edits.<br>

### `npm run build`

Builds the app for production to the `dist` folder.<br>
It correctly bundles Solid in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.<br>
Your app is ready to be deployed!

## Deployment

You can deploy the `dist` folder to any static host provider (netlify, surge, now, etc.)
npm package: @ohshitnotgood/kmutils
Description: Font and UI components used by kam.insektionen.se
Author: Praanto Samadder
Latest version: 0.0.6

# KMUtils Package
Provides utility classes, fonts sizes and view components that are used in https://kam.insektionen.se/.

`KMUtils` requires TailwindCSS to work. 

# Installation
Since `KMUtils` uses Tailwind utility classes, you will need to enable Tailwind within your NodeJs in your `tailwind.config.js` file.

```JS
/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: 'class',
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
    
    // Add this line to your tailwind.config.js file
    "./node_modules/@ohshitnotgood/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}
```

# Components included
## `Nav`
Displays a transparent responsive nav bar that hides behind a hamburger icon in mobile view.

## `Footer`
Footer accompanies `Nav` meaning you do not need to separately call the `Footer` component. Pass `includeFooter={true}` when calling `Nav`.

## `Breadcrumbs`
Displays breadcrumbs on a page. Default font is a green colour with green right-facing chevrons. Colours cannot be customised but only toggled between light and dark mode.

You do not need to provide location arguments to `Breadcrumbs`; `Breadcrumbs` uses `document.location` object to determine it's location in the site.

## HamburgerIcon
Used by `Nav` to display a hamburger icon in mobile view. Not recommended to be used in a project.

## BlogPost
Displays a blog-style page with title, subtitle, and image. Title and subtitle text appear in a green colour which cannot be changed as of version `0.0.4`.

# Fonts included
## BlogBody
Displays a very dark green text suitable for use for writing text in a blog-style page. Font sizes and font colours cannot be modified using Tailwind.

## BlogSectionHeader
Displays a green bolded text suitable as headers for a section. 

## LargeTitle
Displays a large text suitable for use as a title font. This component is currently being used to display the 'KISTA' text on the homepage.
npm package: @ohsome/express-zod
Description: Typesafe express.js validation with Zod
Author: Angelo Walczak
Latest version: 1.0.2

<!-- @format -->

## Usage:

### Route middleware

```js
import { validate } = from 'express-zod'
import { z } from 'zod'

const validation = {
  body: z.object({
    username: z.string().min(1, 'username is required'),
    password: z.string().min(8, 'password must be at least 8 characters'),
  }),
  params: z.object({
    id: z.string().uuid('invalid uuid'),
  }),
  query: z.object({
    page: z.coerce.number().min(1).catch(1)
  })
}

app.get('/', validate(validation), (req, res) => {
  const { username, password } = req.body // are both strings
  const { id } = req.params // is a uuid
  const { page } = req.query // is a number or defaults to 1

  // ...do something with username password

  res.status(201).json({
      username
  })
})
```

### Error Handling

#### Default

```js
import express from 'express'
import { zodError } from 'express-zod'

const PORT = 3000
const app = express()

// ...setup express app
app.use(zodError())

app.listen(PORT, () => {
  console.log('App listening on http://localhost:${PORT}')
})
```

#### Custom Error-Handling

```js
import express from 'express'
import { zodError } from 'express-zod'

const PORT = 3000
const app = express()

// ...setup express app
app.use(
  // error is a ZodError
  // https://github.com/colinhacks/zod/blob/master/ERROR_HANDLING.md
  zodError((error, req, res, next) => {
    res.status(400).json({
      error: {
        message: err.flatten().fieldErrors,
      },
    })
  })
)

app.listen(PORT, () => {
  console.log('App listening on http://localhost:${PORT}')
})
```