open-index/open-npm huggingface dataset:
npm package: @softwareasaservice/dashboard
Description: Create a dashboard for your SaaS in under a minute, from @importsaas
Author: @importsaas
Latest version: 0.0.3

# @softwareasaservice/dashboard

Create a dashboard for your SaaS in under a minute

![image](https://github.com/importsaas/screenshots/raw/main/dashboard/apikeys-1.png)


In other words, with this package in your React app - one `dashboard` snippet automagically adds the following pages to your react app

- /tour
- /settings
- /apikeys
- /team
- /forums
- /login
- /logout

## Why use this package

If you have built or are building a SaaS - you know that 75% of the features involve rudimentary things like account management, billing, settings, and these api keys, forums, and documentation.

This package bundles all these features in an opiniated fashion much like how you would see on `platform.openai.com`

**WIP**

- /docs
- /help
- /register
- /billing

## Screenshots

### give your customers a login screen to login to your SaaS
Google Login coming soon.
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/login-1.png)

### Allow customers to invite their teammates
Choose their roles as well
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/team-1.png)

### Allow customers to manage api keys
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/apikeys-1.png)

### Allow users to name their account
And to indicate if for personal use
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/settings-1.png)


### Forums included*
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/forums-1.png)

### Include a tour*
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/tour-2.png)


## Install

    # with yarn 
    yarn add @softwareasaservice/dashboard
    
    # or with npm
    npm install @softwareasaservice/dashboard


## Usage

    import {Dashboard} from '@softwareasaservice/dashboard';
    
    function HomePage() {
      return (<h1>Welcome</h1>);
    }
    
    function App() {
      return (
        <div>
          <Dashboard
            brand={<>Acme</>}
            home={<HomePage />}
            settings={<>Terms apply</>}>
          </Dashboard>
    
        </div>
      );
    }
    
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/integration-1.png)

### Navigation your react app will get automagically
![image](https://github.com/importsaas/screenshots/raw/main/dashboard/links-1.png)
    

| option | value|
|--------|------|
|`brand` | Acme or the topleft logo |
|`home` | what to show on `/`|
|`settings` | An additional line to show in settings|

### Re-using styles

    import pico from '@softwareasaservice/dashboard/dist/index.css';

### Caveat
Ready for production from Oct 1 '23.

## Licence
MIT

## Authors

**importSaaS**, a stealth startup that simplifies the SaaS journey for builders. 

Email `help@importsaas.com` to see how to self-host, share feedback, or to to say hello.

Also see https://github.com/softwareasaservice/queue - a soon to be launched queue for your React/Next App on the cloud or self-host
npm package: @softwareasaservice/eventsworkflows3
Description: S3 backend for events, from @importsaas
Author: importSaaS
Latest version: 0.0.3

S3 helper for storing state for @softwareasaservice/events

## installation

    # via yarn
    yarn add @softwareasaservice/eventsWorkflowS3
    
    # or via npm
    npm install --save @softwareasaservice/eventsworkflows3

## integrating 

    var {Events} = require("@softwareasaservice/events");
    var {setup, checkEvent, setEvent} = require('@softwareasaservice/eventsworkflows3');
    var events = new Events(user, {workflow, setup, checkEvent, setEvent, 
      S3: {
         OBJECT_STORE_PREFIX:'prefix-for-your-bucket/', 
         client: myS3Client  // should implement get(path), list(path), put(path, obj);
      }
    })


## Licence
MIT

## Authors

importSaaS, a stealth startup that simplifies the SaaS journey for builders. 

Email `help@importsaas.com` to see how to self-host, share feedback, or to to say hello.
npm package: @softwareasaservice/eventsworkfloww3
Description: S3 backend for events, from @importsaas
Author: importSaaS
Latest version: 0.0.1

S3 helper for storing state for @softwareasaservice/events

## installation

    #yarn add @softwareasaservice/eventsWorkflowS3
    
    #npm install --save @softwareasaservice/eventsWorkflowS3

## integrating 

    var {Events} = require("@softwareasaservice/events");
    var {setup, checkEvent, setEvent} = require('@softwareasaservice/eventsWorkflowS3');
    var events = new Events(user, {workflow, setup, checkEvent, setEvent, 
      S3: {
         OBJECT_STORE_PREFIX:'s3ext/', 
         client: s3.client
      }
    })


## Licence
MIT

## Authors

importSaaS, a stealth startup that simplifies the SaaS journey for builders. 

Email `help@importsaas.com` to see how to self-host, share feedback, or to to say hello.
npm package: @softwareatlas/blueprinted-diagram-js
Description: A typescript wrapper around diagram-js
Author: LJW Boschker
Latest version: 15.5.0

# blueprinted-diagram-js

This package provides an opinionated wrapper for the excellent [diagram-js](https://github.com/bpmn-io/diagram-js) library.

Elements and rules can be configured for each instance through a typed blueprint.

## Installation

Install [diagram-js](https://www.npmjs.com/package/diagram-js), [bpmn-font](https://www.npmjs.com/package/bpmn-font) and [this package](https://www.npmjs.com/package/@softwareatlas/blueprinted-diagram-js) together:

```
npm install diagram-js bpmn-font @softwareatlas/blueprinted-diagram-js
```

## Styling

Make sure you import all required stylesheets in the appropriate order. For example, when using webpack with css-loader:

```css
@import '~diagram-js/assets/diagram-js.css';
@import '~bpmn-font/dist/css/bpmn.css';
@import '~@softwareatlas/blueprinted-diagram-js/styles.css';
```

## Development

For easy develop of this package, link it to a typescripted client application (e.g. an Angular app).

Check https://docs.npmjs.com/cli/v8/commands/npm-link for more information.

## Versioning

This package heavily relies on diagram-js, so it follows a similar version numbering. We'll keep the major version in sync with diagram-js.

The minor and patch version can vary, based on features in the blueprinted-diagram-js package itself.


## Publishing

To publish this package, use npm to give it a version and push the tag to git:

```bash
npm version v1.0.2
git push --tags
```

Be sure to use [semantic versioning](https://semver.org)!

GitHub Actions will now build and publish this version to [npmjs.org](https://www.npmjs.com/package/@softwareatlas/blueprinted-diagram-js).
npm package: @softwarecradle/handy-controls-react
Description: A collection of handy components for React JS
Author: softwarecradle
Latest version: 1.1.0

# @softwarecradle/handy-controls-react

> A collection of handy components for React JS

[![NPM](https://img.shields.io/npm/v/@softwarecradle/handy-controls-react.svg)](https://www.npmjs.com/package/@softwarecradle/handy-controls-react) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save @softwarecradle/handy-controls-react
```

## Usage

```jsx
import React, { Component } from 'react'

import MyComponent from '@softwarecradle/handy-controls-react'
import '@softwarecradle/handy-controls-react/dist/index.css'

class Example extends Component {
  render() {
    return <MyComponent />
  }
}
```

## License

MIT © [softwarecradle](https://github.com/softwarecradle)
npm package: @softwarecurator/solana-svelte
Description: This npm package provides a set of tools and components designed for Svelte applications to interact with the Solana blockchain. It simplifies the process of connecting to wallets, sending transactions, and managing state within Svelte apps.
Author: @softwarecurator
Latest version: 0.1.0

# @softwarecurator/solana-svelte

This npm package provides a set of tools and components designed for Svelte applications to interact with the Solana blockchain. It simplifies the process of connecting to wallets, sending transactions, and managing state within Svelte apps.

## Installation

To add this library to your Svelte project, run:

```bash
npm install @softwarecurator/solana-svelte
```

## Usages

### solanaProvider

The `solanaProvider` is a wrapper that gives access to give access to use solana throughout the application.

Example Usage:

```svelte
<script lang="ts">
	import { SolanaProvider } from '@softwarecurator/solana-svelte';

	const { children } = $props();
</script>

<SolanaProvider>
	{@render children()}
</SolanaProvider>
```

### ConnectButton

The `ConnectButton` is a svelte component that gives the developer a quick button that will connect to the solana blockchain via detected providers

```svelte
<script lang="ts">
	import { ConnectButton } from '@softwarecurator/solana-svelte';
</script>

<div class="flex justify-center items-center h-screen">
	<ConnectButton maxNumberOfWallets={3} />
</div>
```