open-index/open-npm huggingface dataset:
npm package: @sveltekit-addons/document
Description: A tiny utility for SvelteKit that lets you change the `<html>`, `<head>`, and `<body>` tags from any page or layout—with full SSR support. Here's an example:
Latest version: 1.0.1

# The missing document manager for SvelteKit

A tiny utility for SvelteKit that lets you change the `<html>`, `<head>`, and `<body>` tags from any page or layout—with full SSR support. Here's an example:

```svelte
<!-- you could already do this: -->
<svelte:head>
    <title>Hello world!</title>
</svelte:head>
<svelte:body on:click={onBodyClick} />

<!-- but now you can do this: -->
<ska:html lang="en" on:keyup={onHtmlKeyup} />
<svelte:body class:dark={darkModeEnabled} />
```

The full list of features it offers is:

- Expands `<svelte:body>` to work with attributes, not just event listeners (accessible in SSR via `%ska.body.attributes%` in `app.html`), which addresses this [long-standing feature request](https://github.com/sveltejs/svelte/issues/3105)
- Adds `<ska:html>` (ska = SvelteKit Addons), which forwards attributes and event listeners to the `<html>` element (accessible in SSR via `%ska.html.attributes%` in `app.html`)

## Installation

1. Grab the package from NPM:

   ```sh
   npm install @sveltekit-addons/document --save-dev
   ```

1. Include the preprocessor in your `svelte.config.js` file:

   ```diff
   + import { preprocessor as documentPreprocessor } from '@sveltekit-addons/document'

   export default {
   -   preprocess: [vitePreprocess()]
   +   preprocess: [vitePreprocess(), documentPreprocessor()] // Make sure it's at the very end
   }
   ```

1. Add the handle to your `src/hooks.server.js` (create that file if it doesn't exist):

   - If you don't have any other handles:
     ```diff
     + export { handle } from '@sveltekit-addons/document/hooks'
     ```
   - If you have a `handle` export already:

     ```diff
     + import { handle as documentHandle } from '@sveltekit-addons/document/hooks'
     + import { sequence } from '@sveltejs/kit/hooks'

     - export const handle = ...
     + const handle = ...
     + export const handle = sequence(handle, documentHandle)
     ```

1. Add the SSR placeholders to your `src/app.html`:

   - Manually:
     ```diff
     <!DOCTYPE html>
     - <html>
     + <html %ska.html.attributes%>
     <head>
         ...
     </head>
     - <body>
     + <body %ska.body.attributes%>
     ```
   - Or by using the provided `app.html` template (meaning you can delete yours):

     ```diff
     // svelte.config.js
     + import { appTemplate } from '@sveltekit-addons/document'

     export default {
         // ...
     +   kit: {
     +     files: {
     +       appTemplate
     +     }
     +   }
     }
     ```

## Gotchas

- `<ska:html>`'s event listeners don't get automatic types. Event listeners on the `<html>` element are pretty rare, though, and most of the time `<svelte:window>` could/should be used instead.

# Todo

- [ ] Handle CSP
- [ ] Allow adding elements portal-style to body
npm package: @sveltekit-board/authenticator
Description: auth library for sveltekit using mysql
Author: hotsixman
Latest version: 0.2.0

# create-svelte

Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/main/packages/create-svelte).

Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

## Developing

Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:

```bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open
```

Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.

## Building

To build your library:

```bash
npm run package
```

To create a production version of your showcase app:

```bash
npm run build
```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

## Publishing

Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).

To publish your library to [npm](https://www.npmjs.com):

```bash
npm publish
```
npm package: @sveltekit-board/oauth
Description: 이 라이브러리는 OAuth 인증을 담당합니다.
Author: hotsixman
Latest version: 0.8.0

# @sveltekit-board/oauth

이 라이브러리는 OAuth 인증을 담당합니다.

**Note**
이 라이브러리는 사용자를 **구별**하는 것이 목적입니다. 그 과정에서 `access_token` 등의 토큰을 받아오기는 하나, 이 토큰은 유저 데이터를 받아올 때만 사용합니다. 따라서 해당 토큰이 필요한 경우에는 별도 라이브러리를 사용해야합니다.

## 사용법

### 설치
`npm i @sveltekit-board/oauth`

### 사용
```js
/* src/hooks.server.ts */
import { sequence } from '@sveltejs/kit/hooks';
import auth, { providers } from '@sveltekit-board/oauth';

const github = new providers.Github({
    clientId: process.env.GITHUB_CLIENT_ID,//client id
    clientSecret: process.env.GITHUB_CLIENT_SECRET//client secret
})
const kakao = new providers.Kakao({
    clientId: process.env.KAKAO_CLIENT_ID,//client id
    clientSecret: process.env.KAKAO_CLIENT_SECRET//client secret
})

export const handle = sequence(auth([github, kakao], {
    key: process.env.AUTH_KEY, 
    maxAge: 3600, 
    autoRefreshMaxAge: true
}), async function({event, resolve}){
    //hook에 사용할 함수
    return await resolve(event)
})
```

### 살펴보기
- [auth()](https://github.com/sveltekit-board/module-auth/tree/main/docs/auth.md)
- [provider](https://github.com/sveltekit-board/module-auth/tree/main/docs/provider.md)
npm package: @sveltekit-board/user
Description: simple user library for sveltekit
Author: hotsixman
Latest version: 0.4.0

# @sveltekit-board/user

sveltekit을 위한 user 라이브러리입니다. [@sveltekit-board/auth](https://github.com/sveltekit-board/module-auth)와 함께 사용하세요.

## 사용법
```ts
/* src/hooks.server.ts */
import User from '@sveltekit-board/user';
import auth, { providers } from '@sveltekit-board/auth';
import { sequence } from '@sveltejs/kit/hooks';

//처음 서버를 실행할 때 테이블을 체크합니다.
if(!await User.checkTable()){
    await User.createTable()
}

const github = new providers.Github({
    clientId: process.env.GITHUB_CLIENT_ID,//client id
    clientSecret: process.env.GITHUB_CLIENT_SECRET//client secret
})

export const handle = sequence(auth([github], {
    key: process.env.AUTH_KEY, 
    maxAge: 3600, 
    autoRefreshMaxAge: true
}), async function({event, resolve}){
    //hook에 사용할 함수
    return await resolve(event)
})
```

```ts
/* src/routes/+page.server.ts */
import User from '@sveltekit-board/user';

export async function load({locals}){
    let user;
    if(locals.user){
        user = await User.getUser(locals.user.provider, locals.user.providerId)
    }

    return {
        userName: await user.getData(['name'])
    }
}
```

## 살펴보기

[`User`](https://github.com/sveltekit-board/module-user/blob/main/docs/User.md)