open-index/open-npm huggingface dataset:
npm package: @preyproject/n8n-nodes-prey
Description: n8n community node for Prey
Author: Luis Sánchez
Latest version: 0.1.2

# n8n-nodes-prey

This is an n8n community node that lets you work with the Prey Developer API in your n8n workflows.

[n8n](https://n8n.io/) is a [fair-code licensed](https://docs.n8n.io/sustainable-use-license/) workflow automation platform.

[Installation](#installation)
[Operations](#operations)
[Credentials](#credentials)
[Usage notes](#usage-notes)
[Compatibility](#compatibility)
[Resources](#resources)

## Installation

Follow the [installation guide](https://docs.n8n.io/integrations/community-nodes/installation/) in the n8n community nodes documentation.

## Operations

- Account
  - Get account
- Users
  - List users
  - Get user
- Devices
  - List devices
  - Get device
  - Get device location history (JSON or CSV)
  - List device reports
  - Get device report
  - Trigger device action (alarm/alert/lock)
  - Set device status (missing/recovered)
  - Delete device
- Labels
  - List labels
  - Get label
  - Create label
- Zones
  - List zones
  - Get zone
  - Create zone
  - Update zone
- Automations
  - List automations
  - Get automation
- Mass Actions
  - List mass actions
  - Get mass action

## Credentials

This node uses API Key authentication.

### API Key

1. Go to Prey Control Panel → Settings → Developer API.
2. Create an API key (you can set permissions and expiration).
3. Use the API key in the Prey API credential inside n8n.

Note: Creating API keys requires a Personal, Business, or Education plan.

The credential includes a Permission Level field (Read-only or Read & Write) to hide write operations when the key is read-only.

## Usage notes

- The Prey Developer API is currently in **Beta** and has fewer write endpoints than read ones.
- Rate limits are per API key:
  - 2 requests/second
  - 60 requests/minute
  - 10,000 requests/hour

## Compatibility

Compatible with n8n@1.60.0 or later

## Resources

* [n8n community nodes documentation](https://docs.n8n.io/integrations/#community-nodes)
* [Prey Developer API (Swagger)](https://api.preyproject.com)
* [Prey API help article](https://help.preyproject.com/article/308-what-can-i-use-the-prey-api-for)
npm package: @prezly/content-renderer-react-js
Description: Render Prezly Content Format documents with React.js
Latest version: 0.44.0

# Prezly Content Renderer for React.js

Render [Prezly Content Format][prezly-content-format] documents used at [Prezly][prezly].

![Version](https://img.shields.io/npm/v/@prezly/content-renderer-react-js)
![License](https://img.shields.io/npm/l/@prezly/content-renderer-react-js)

## Installation

### npm

```Shell
npm install --save @prezly/content-renderer-react-js
```

#### peerDependencies

Make sure all peer dependencies are met (`react`, `react-dom`).

```Shell
npm install --save react react-dom
npm install --save-dev @types/react @types/react-dom
```

### object-fit-images polyfill

If you need to support older browsers, you can use this polyfill for `object-fit`: https://github.com/fregante/object-fit-images. This package already includes necessary syntax to work with the polyfill - all you have to do is include the polyfill.

```html
<script src="//cdnjs.cloudflare.com/ajax/libs/object-fit-images/3.2.4/ofi.min.js"></script>
<script>
    objectFitImages();
</script>
```

## Usage

```tsx
import { DocumentNode, HeadingNode } from '@prezly/story-content-format';
import { Renderer, Component } from '@prezly/slate-renderer';

const documentNode: DocumentNode = {
    type: DocumentNode.TYPE,
    version: '0.50',
    children: [
        {
            type: HeadingNode.Type.HEADING_ONE,
            children: [{ text: 'Hello world!' }],
        },
    ],
};

export function Content() {
    return <Renderer nodes={documentNode} />;
}

// You can also override default renders by
// declaring custom renderers as children `<Component>` elements
export function ContentWithCustomHeadings() {
    return (
        <Renderer nodes={documentNode}>
            <Component
                match={isHeadingNode}
                component={({ children, node }) => <div style={{ color: 'red' }}>{children}</div>}
            />
        </Renderer>
    );
}
```

# Development

There is a sandbox app in this repository with Hot Module Replacement.
It will automatically include updates of any code changes you make locally.
To start it, simply run `npm run start`:

```shell
npm install
npm run start
```

## Loki

We use [Loki](https://loki.js.org/) visual testing library for storybook.
There are several commands that you can use from `package.json`:

1. `loki` - checks that your current stories are matched with what you already have (Storybook server should run)
1. `loki:update` - Regenerate all snapshots despite what you already have (Storybook server should run)
1. `loki:static-build` - Performs checks like `loki` does, but over builded sources from storybook, no need to run Storybook server

If Loki fails on CI you can download generated images like [here](https://github.com/actions/upload-artifact#where-does-the-upload-go)

---

Brought to you by [Prezly][prezly].

[prezly]: https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/content-renderer-react-js
[prezly-content-format]: https://developers.prezly.com/docs/api/ZG9jOjU2NjAyNTY-prezly-content-format
npm package: @prezly/docx-cleaner
Description: Normalize dirty HTML and DOCX/RTF documents into clean, understandable HTML
Latest version: 0.5.2

# @prezly/docx-cleaner

Normalize dirty HTML and DOCX/RTF documents into clean, understandable HTML

![Version](https://img.shields.io/npm/v/@prezly/docx-cleaner)
![License](https://img.shields.io/npm/l/@prezly/docx-cleaner)

## Usage

```tsx
import React, { ClipboardEvent, useState } from 'react';
import { cleanDocx } from '@prezly/docx-cleaner';

const MyComponent = () => {
    const [value, setValue] = useState<string>('');

    function handlePaste(event: ClipboardEvent<HTMLTextAreaElement>) {
        const html = event.clipboardData.getData('text/html');
        const rtf = event.clipboardData.getData('text/rtf');

        try {
            const cleanHtml = cleanDocx(html, rtf);
            setValue(cleanHtml);
        } catch (error) {
            setValue(error.message);
            console.error(error);
        }
    };

    return <textarea value={value} onPaste={handlePaste} />;
};

export default MyComponent;
```

# Development

In order to start developing, run the build in watch mode.

## Setup

```Shell
npm install           # install dependencies
npm run build:watch   # start watcher
```

## Publishing

```Shell
npm run release     # reinstall & rebuild everything from scratch and...
                    # ...and run a wizard that'll guide you through publishing the npm package
```

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/docx-cleaner).
npm package: @prezly/eslint-config
Description: ESLint, Prettier and StyleLint configs used for Prezly TypeScript projects
Latest version: 6.0.0

Prezly code style configurations
================================

PHP Code Style checker (and fixer) is built with 
[Easy-Coding-Standard](https://github.com/symplify/easy-coding-standard).

### Usage

1. (Optional) Add prefixed ECS CLI tool into your composer requirements
   (if you're not a fan of resolving conflicts with enormous dependencies
   list of `simplify/easy-coding-standard`).
 
   ```bash
   composer require --dev symplify/easy-coding-standard-prefixed
   ```

2. Link prezly/code-style repo as composer dependency

   ```bash
   composer require prezly/code-style:~4.0
   ```

3. Include the provided configuration into your project.

   Simply create an *ecs.php* file in your project root 
   and include the *ecs.php* provided by this package into it.
   
   ```php
   <?php
    
   // Include the stock prezly/code-style config as is.
   return require __DIR__ . '/vendor/prezly/code-style/ecs.php';
   ```

4. If you need to extend or override the stock configuration, 
   you can of course do it by adding code on top of it:
   
   ```php
   <?php
   
   declare(strict_types=1);
   
   use PhpCsFixer\Fixer\Operator\BinaryOperatorSpacesFixer;
   use Symfony\Component\DependencyInjection\Loader\Configurator\ContainerConfigurator;
   
   return static function (ContainerConfigurator $config): void {
       // Include the stock prezly/code-style config.
       (require __DIR__ . '/vendor/prezly/code-style/ecs.php')($config);
   
       $services = $config->services();
   
       // Override stock preset configuration.
       $services->set(BinaryOperatorSpacesFixer::class)->call('configure', [
           [
               'operators' => [
                   '=>' => 'align',
               ],
           ],
       ]);
   };
   ```

5. Run checks (you can also configure your CI to run this for you on every push):

   ```bash
   vendor/bin/ecs check src/
   ```

6. Fix problems:

   ```bash
   vendor/bin/ecs check src/ --fix
   ```
npm package: @prezly/events
Description: Event emitter with DOM-like EventTarget API & strong TypeScript typings
Latest version: 2.0.3

# @prezly/events

![Version](https://img.shields.io/npm/v/@prezly/events)
![License](https://img.shields.io/npm/l/@prezly/events)
![Build](https://github.com/prezly/events/workflows/Build/badge.svg)
![Prettier](https://github.com/prezly/events/workflows/Prettier/badge.svg)

Event emitter with [DOM-like `EventTarget` API](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget) & strong TypeScript typings.

---

## Alternatives

There's this great [mitt](https://github.com/developit/mitt) package which implements `EventEmitter` interface from node.js but it does not have strong typings. [There's a PR pending](https://github.com/developit/mitt/pull/114) with this feature, but there's been no activity for 7 months. Perhaps in the future we might not want to maintain this `@prezly/events` package. But on the other hand, we should think twice before using a package where last PR got merged over half year ago.

## Example

Demo: https://codesandbox.io/s/prezlyevents-demo-2k7pd

```tsx
import { Events } from '@prezly/events';

const ref = { current: 0 };

const events = new Events<{
    add: number;
    substract: number;
    log: never; // "never" means that event has no payload
}>();

const add = (value: number) => {
    ref.current += value;
};

const substract = (value: number) => {
    ref.current -= value;
};

const log = () => {
    console.log(ref.current);
};

// Attach event handlers
events.addEventListener('add', add);
events.addEventListener('substract', substract);
const removeLogListener = events.addEventListener('log', log);

// Dispatch events
events.dispatchEvent('add', 2);
events.dispatchEvent('substract', 5);
events.dispatchEvent('log');

// Remove event handlers
events.removeEventListener('add', add);
events.removeEventListener('substract', substract);
removeLogListener(); // this is another way to unsubscribe event listener
```

---

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/events).
npm package: @prezly/linear-partition
Description: Solution to The Partition Problem, in TypeScript
Latest version: 1.0.3

# @prezly/linear-partition

![Version](https://img.shields.io/npm/v/@prezly/linear-partition)
![License](https://img.shields.io/npm/l/@prezly/linear-partition)
![Build](https://github.com/prezly/linear-partitioning/workflows/Build/badge.svg)
![Test](https://github.com/prezly/linear-partitioning/workflows/Test/badge.svg)
![Prettier](https://github.com/prezly/linear-partitioning/workflows/Prettier/badge.svg)

Solution to The Partition Problem, in TypeScript.

- based on: https://github.com/technically-php/linear-partitioning/blob/master/src/LinearPartitioning.php
- which is based on: http://www8.cs.umu.se/kurser/TDBAfl/VT06/algorithms/BOOK/BOOK2/NODE45.HTM
- related stackoverflow thread: https://stackoverflow.com/questions/7938809/how-to-understand-the-dynamic-programming-solution-in-linear-partitioning/7942946

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/linear-partitioning).
npm package: @prezly/progress-promise
Description: Promise implementation that can report progress
Latest version: 2.0.1

# @prezly/progress-promise

![Version](https://img.shields.io/npm/v/@prezly/progress-promise)
![License](https://img.shields.io/npm/l/@prezly/progress-promise)
![Build](https://github.com/prezly/slate/workflows/Build/badge.svg)
![Prettier](https://github.com/prezly/slate/workflows/Prettier/badge.svg)

Promise implementation that can report progress.

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/progress-promise).
npm package: @prezly/sdk
Description: Prezly API SDK
Author: Prezly Team
Latest version: 26.3.1

## Prezly JavaScript SDK

### Getting started

```sh
npm install --save @prezly/sdk
# or yarn
yarn add @prezly/sdk
```

### Using the code

Using ES Modules:

```js
import { createPrezlyClient } from '@prezly/sdk';

const prezlyClient = createPrezlyClient({
    accessToken: 'your-access-token',
});
```

Or Using CommonJS:

```js
const { createPrezlyClient } = require('@prezly/sdk').default;

const prezlyClient = createPrezlyClient({
    accessToken: 'your-access-token',
});
```

## Requirements

### API token

At this moment, the UI does not support issuing API tokens. Please contact support to issue one for you.

### [`fetch`](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) API support

`@prezly/sdk` is using `fetch` to create requests. We assume that the environment running the code supports it.

We understand that some of the environments, such as node.js or old browsers, do not support `fetch`. This can be resolved by including a polyfill.

#### Polyfilling in browsers using [`whatwg-fetch`](https://www.npmjs.com/package/whatwg-fetch)

```sh
npm install --save whatwg-fetch
# or yarn
yarn add whatwg-fetch
```

```js
import 'whatwg-fetch';
// ...
import { createPrezlyClient } from '@prezly/sdk';
```

We recommend referring to the [official `whatwg-fetch` module documentation](https://www.npmjs.com/package/whatwg-fetch) for more information.

#### Polyfilling in browsers using [`node-fetch`](https://www.npmjs.com/package/node-fetch)

```sh
npm install --save node-fetch
# or yarn
yarn add node-fetch
```

```js
global.fetch = require('node-fetch');
// ...
const { createPrezlyClient } = require('@prezly/sdk');
```

We recommend referring to the [official `node-fetch` module documentation](https://www.npmjs.com/package/node-fetch) for more information.

#### Platform-agnostic polyfill using [`cross-fetch`](https://www.npmjs.com/package/cross-fetch)

```sh
npm install --save cross-fetch
# or yarn
yarn add cross-fetch
```

Using ES Modules:

```js
import 'cross-fetch/polyfill';
// ...
import { createPrezlyClient } from '@prezly/sdk';
```

Or Using CommonJS:

```js
require('cross-fetch/polyfill');
// ...
const { createPrezlyClient } = require('@prezly/sdk');
```

We recommend referring to the [official `cross-fetch` module documentation](https://www.npmjs.com/package/cross-fetch) for more information.

#### Custom `fetch` implementation

Additionally, you can initialize the API client with your own implementation of `fetch`:

```js
import { createPrezlyClient } = from '@prezly/sdk';

const prezlyClient = createPrezlyClient({
    accessToken: 'your-access-token',
    fetch: customFetch,
});
```
npm package: @prezly/slate-commons
Description: Low-level commands, utilities, plugins, types, etc. used throughout Prezly-Slate packages
Latest version: 0.118.0

# @prezly/slate-commons

Low-level commands, utilities, plugins, types, etc. used throughout Prezly-Slate packages

![Version](https://img.shields.io/npm/v/@prezly/slate-commons)
![License](https://img.shields.io/npm/l/@prezly/slate-commons)

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-commons).
npm package: @prezly/slate-editor
Description: The Prezly Slate Editor
Latest version: 0.118.0

# @prezly/slate-editor

The [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-editor) [Slate](https://www.slatejs.org/) Editor.

![Version](https://img.shields.io/npm/v/@prezly/slate-editor)
![License](https://img.shields.io/npm/l/@prezly/slate-editor)

---

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-editor).
npm package: @prezly/slate-hyperscript
Description: Hyperscript helpers for creating Slate documents with JSX
Latest version: 0.32.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# @prezly/slate-hyperscript

Hyperscript helpers for creating [Slate](https://www.slatejs.org/) documents with JSX.

![Version](https://img.shields.io/npm/v/@prezly/slate-hyperscript)
![License](https://img.shields.io/npm/l/@prezly/slate-hyperscript)

## Description

This is a copy of [slate-hyperscript](https://github.com/ianstormtaylor/slate/tree/93fe25151722343488e9002a0ebd8ed3ba66ee95/packages/slate-hyperscript/src) package into our code (v0.58.0).

The only changes done to this code are:

-   formatting this code with prettier
-   adding `/* eslint-disable */` comments at the top of these files so that ESLint does not complain
-   prefixing unused function arguments with `_` to avoid TS6133

## Why

We need `createText` function in our code and `slate-hyperscript` package does not export it.

## Why do we need `createText` function in our code

Slate uses `createText` function for handling `<text>` elements in hyperscript.
This collides with `<text>` elements from [React TypeScript definitions](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/0182cd9094aa081558a3c4bfc970bbdfb71d891d/types/react/index.d.ts#L3136).
That's why we need a different tag name to represent `text` elements from Slate.
We chose `h-text` for that tag name (and actually apply `h-` prefix for all other custom tag names). But to make it work we need `createText` function.

See `src/createHyperscript.ts` to see how it's composed.

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-hyperscript).
npm package: @prezly/slate-renderer
Description: Render Slate documents used at Prezly
Latest version: 0.3.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# @prezly/slate-renderer

Render [Slate](https://www.slatejs.org/) documents used at [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-renderer).

![Version](https://img.shields.io/npm/v/@prezly/slate-renderer)
![License](https://img.shields.io/npm/l/@prezly/slate-renderer)

## Setup

### npm

```Shell
npm install --save @prezly/slate-renderer
```

#### peerDependencies

Make sure all peer dependencies are met (`react`, `react-dom`).

```Shell
npm install --save react react-dom
npm install --save-dev @types/react @types/react-dom
```

### object-fit-images polyfill

If you need to support older browsers, you can use this polyfill for `object-fit`: https://github.com/fregante/object-fit-images. This package already includes necessary syntax to work with the polyfill - all you have to do is include the polyfill.

```html
<script src="//cdnjs.cloudflare.com/ajax/libs/object-fit-images/3.2.4/ofi.min.js"></script>
<script>
    objectFitImages();
</script>
```

## Usage

```tsx
import React from 'react';
import { DOCUMENT_NODE_TYPE, HEADING_1_NODE_TYPE, DocumentNode } from '@prezly/slate-types';
import { Renderer } from '@prezly/slate-renderer';

const documentNode: DocumentNode = {
    children: [
        {
            children: [{ text: 'Hello world!' }],
            type: HEADING_1_NODE_TYPE,
        },
    ],
    type: DOCUMENT_NODE_TYPE,
    version: '0.50',
};

const MyComponent = () => (
    <Renderer
        nodes={documentNode} /* or nodes={[documentNode]}, up to you */
        options={{
            /* override default heading render */
            [HEADING_1_NODE_TYPE]: ({ children, className, node, ...props }) => (
                <div className={className} style={{ color: 'red' }}>
                    {children}
                </div>
            ),
        }}
    />
);

export default MyComponent;
```

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-renderer).
npm package: @prezly/slate-types
Description: TypeScript definitions for Slate document structure used at Prezly
Latest version: 0.118.0

# @prezly/slate-types

TypeScript definitions for [Slate](https://www.slatejs.org/) document structure used at [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-types).

![Version](https://img.shields.io/npm/v/@prezly/slate-types)
![License](https://img.shields.io/npm/l/@prezly/slate-types)

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/slate-types).
npm package: @prezly/theme-kit-core
Description: Data layer and utility library for developing Prezly themes with JavaScript
Author: Prezly Team
Latest version: 10.6.2

# JavaScript Prezly Theme Kit

![Version](https://img.shields.io/npm/v/@prezly/theme-kit-core)
![License](https://img.shields.io/npm/l/@prezly/theme-kit-core)

This library is a collection of data-fetching and utility functions to abstract some of the under-the-hood logic used by Prezly sites and help developers create themes with JavaScript much faster.

The package is built with [Typescript] on top of [Prezly SDK].

## Adding the library to your theme

### npm

```Shell
npm install --save @prezly/sdk @prezly/theme-kit-core
```

#### peerDependencies

This library depends on `@prezly/sdk`, which provides the communication with Prezly API and typings. We will occasionally bump the minimum required SDK version to ensure compatibility with latest Prezly features.

### .env

Prezly themes use two ways of getting base environment variables:
- Getting variables straight from `.env` file
- Extracting variables from HTTP headers (when hosted on the Prezly infrastructure)

For local development, and for self-hosted themes, you can only use the former option. Add these variables to your `.env` file:
```
PREZLY_ACCESS_TOKEN=your access token
PREZLY_NEWSROOM_UUID=your site UUID
PREZLY_THEME_UUID=your theme UUID
```

`PREZLY_THEME_UUID` variable is only reqiured for developing themes that are already hosted on Prezly infrastructure.
It determines which theme preset will be pulled from the API. For self-hosted themes, you'll want to handle the theme settings in some other way.

If you don't have these credentials, you can use one of our [testing sites credentials](https://github.com/prezly/theme-nextjs-starter#testingtoken).

----

## What's next

This kit is just a collection of building blocks, so it doesn't really force any page structure or guidelines on how to render the content.
You can learn more on how this kit can be used by checking the code of Prezly's themes:
- [Prezly Starter Theme](https://github.com/prezly/theme-nextjs-starter) - this is a bare-bones application created to demonstrate how to display the fetched content and recommended page structure
- [Prezly Bea Theme](https://github.com/prezly/theme-nextjs-bea) - this is our new fully-fledged theme available to all Prezly customers. It has lots of stuff on top, both in styling and in data logic.

You can also learn more about Prezly API by checking out typings in [Prezly SDK] package, and referring to the [Prezly API Docs]

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/theme-kit-js).

[Prezly SDK]: https://www.npmjs.com/package/@prezly/sdk
[Prezly API Docs]: https://developers.prezly.com/docs/api
[Typescript]: https://www.typescriptlang.org
npm package: @prezly/theme-kit-react
Description: Data layer and utility library for developing Prezly themes with NextJS
Author: Prezly Team
Latest version: 10.6.2

# React Prezly Theme Kit

![Version](https://img.shields.io/npm/v/@prezly/theme-kit-nextjs)
![License](https://img.shields.io/npm/l/@prezly/theme-kit-nextjs)

This library is a collection of common React hooks and components used with Prezly themes.  

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/theme-kit-nextjs).
npm package: @prezly/themes-ui-components
Description: A collection of UI components for Prezly Themes
Author: Prezly Team
Latest version: 0.9.0
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# UI Components library for Prezly Themes

![Version](https://img.shields.io/npm/v/@prezly/themes-ui-components)
![License](https://img.shields.io/npm/l/@prezly/themes-ui-components)

This library provides some basic components intended to be used with Prezly Themes.

## Adding the library to your Next.js theme

### npm

```Shell
npm install --save @prezly/themes-ui-components
```

### peerDependencies

This library is intended to be used with [Next.js] applications, so it requires `next`, `react` and `react-dom` to work. These should already be installed if you have an existing [Next.js] app.
If you're starting from scratch, use [create-next-app] to quick-start the project.

To keep things fresh, we require at least Next.js 12 and React 17.

The library also expects your project to have the [Prezly Theme Kit] and [React Intl] libraries installed. These are basic dependencies for every Prezly theme.

You can install the dependencies manually
```Shell
npm install --save next react react-dom @prezly/theme-kit-nextjs react-intl
npm install --save-dev @types/react @types/react-dom
```

### Styles

In order for the UI components to display properly, you'll need to import the library stylesheets into your app. This allows for greater control over the order of you styles, since the UI library have the lowest specificity possible to make customizing the components easier.

You can import the stylesheet in you `/pages/_app.tsx`:
```ts
import '@prezly/themes-ui-components/styles.css';
```

Or import them directly in your stylesheets:
```css
@import '~@prezly/themes-ui-components/styles.css';
```

----

## What's next

You can learn more on how about Prezly's themes by checking these repos:
- [Prezly Starter Theme](https://github.com/prezly/theme-nextjs-starter) - this is a bare-bones application created to demonstrate how to display the fetched content and recommended page structure
- [Prezly Bea Theme](https://github.com/prezly/theme-nextjs-bea) - this is our new fully-fledged theme available to all Prezly customers. It has lots of stuff on top, both in styling and in data logic.

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/themes-ui-components).

[create-next-app]: https://nextjs.org/docs/api-reference/create-next-app
[Next.js]: https://nextjs.org
[Prezly Theme Kit]: https://github.com/prezly/themes-ui-components
[React Intl]: https://formatjs.io/docs/react-intl/
npm package: @prezly/typed-events
Description: Event emitter with DOM-like EventTarget API & strong TypeScript typings
Latest version: 1.0.1
Deprecated: Package has been renamed to @prezly/events

# @prezly/typed-events

![Version](https://img.shields.io/npm/v/@prezly/typed-events)
![License](https://img.shields.io/npm/l/@prezly/typed-events)
![Build](https://github.com/prezly/typed-events/workflows/Build/badge.svg)
![Prettier](https://github.com/prezly/typed-events/workflows/Prettier/badge.svg)

Event emitter with [DOM-like `EventTarget` API](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget) & strong TypeScript typings.

---

## Alternatives

There's this great [mitt](https://github.com/developit/mitt) package which implements `EventEmitter` interface from node.js but it does not have strong typings. [There's a PR pending](https://github.com/developit/mitt/pull/114) with this feature, but there's been no activity for 7 months. Perhaps in the future we might not want to maintain this `@prezly/typed-events` package. But on the other hand, we should think twice before using a package where last PR got merged over half year ago.

## Example

Demo: https://codesandbox.io/s/prezlytyped-events-demo-2k7pd

```tsx
import Events from '@prezly/typed-events';

const ref = { current: 0 };

const events = new Events<{
    add: number;
    substract: number;
    log: never; // "never" means that event has no payload
}>();

const add = (value: number) => {
    ref.current += value;
};

const substract = (value: number) => {
    ref.current -= value;
};

const log = () => {
    console.log(ref.current);
};

// Attach event handlers
events.addEventListener('add', add);
events.addEventListener('substract', substract);
const removeLogListener = events.addEventListener('log', log);

// Dispatch events
events.dispatchEvent('add', 2);
events.dispatchEvent('substract', 5);
events.dispatchEvent('log');

// Remove event handlers
events.removeEventListener('add', add);
events.removeEventListener('substract', substract);
removeLogListener(); // this is another way to unsubscribe event listener
```

---

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/typed-events).
npm package: @prezly/uploadcare
Description: Uploadcare utilities used at Prezly
Latest version: 2.6.0

# @prezly/uploadcare

![Version](https://img.shields.io/npm/v/@prezly/uploadcare)
![License](https://img.shields.io/npm/l/@prezly/uploadcare)
![Build](https://github.com/prezly/uploadcare/workflows/Build/badge.svg)
![Prettier](https://github.com/prezly/uploadcare/workflows/Prettier/badge.svg)

[Uploadcare](https://uploadcare.com/) utilities used at [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/uploadcare).

----

Brought to you by [Prezly](https://www.prezly.com/?utm_source=github&utm_campaign=@prezly/uploadcare).