@communityboss/svelte-utils NPM

@communityboss/svelte-utils

Reusable Svelte utils

Install

npm install --save @communityboss/svelte-utils

Usage

SvelteKit Hooks

Auth

// src/hooks.server.ts
import { auth } from '@communityboss/svelte-utils'

export const handle = auth('my-app-name')

Sets an auth cookie which it checks on every request. If the cookie is not present, it redirects to the Community Boss login page.

user (and access_token if needed) is exposed to to endpoints and server pages, access like:

// src/+layout.server.ts
import type { LayoutServerLoad } from './$types'

export const load: LayoutServerLoad = ({ locals: { user } }) => {
  return { user }
}

To get typing working of locals:

// src/app.d.ts
// See https://kit.svelte.dev/docs/types#app
import type { Contact } from '@communityboss/api'

declare global {
  namespace App {
    // interface Error {}
    interface Locals {
      user?: Contact
      access_token?: string
    }
    // interface PageData {}
    // interface Platform {}
  }
}

export {}

Actions

File drag/drop Dropzone

<script>
  import { dropzone } from '@communityboss/svelte-utils'
</script>

<div
  use:dropzone={{
    on_update() {
      console.log('UPDATED')
    },
    on_drop() {
      console.log('DROPPED')
    },
  }}
/>