open-index/open-npm huggingface dataset:
npm package: @mirandaplayer/check-material-requirement
Description: Validador de materiales multimedia
Author: Miranda Player
Latest version: 1.0.13


## Como instalar en tu proyecto

ve al directorio de tu proyecto

```bash
  cd my-project
```

instalar la version mas actual del paquete

```bash
   npm install @mirandaplayer/check-material-requirement
```

recomendado siempre usar la ultima tag "@1.0.13" del paquete

publicar el paquete en tu proyecto

```bash
  npm run build
  npm publish --access public
```
npm package: @mirango/eslint-config
Description: An ESLint configuration file that enforces company-wide frontend TypeScript and React best practices.
Author: zsparal
Latest version: 0.100.1

# @mirango/eslint-config

An ESLint configuration file that enforces company-wide frontend TypeScript and React best practices.

## Install

```
yarn add --dev @mirango/eslint-config
```

## Usage

Install all required packages:

```
yarn add --dev eslint typescript prettier
```

Modify your `.eslintrc.json` file:

```json
{
  "parserOptions": {
    "project": "tsconfig.json"
  },
  "extends": ["@mirango/eslint-config"],
  "rules": {
    "modified-rule": "off"
  }
}
```
npm package: @mirango/re-ts
Description: A redux helper library for TypeScript. Historically using TypeScript with redux resulted in a lot of boilerplate code. With the most recent additions to the language it is now possible to write convenient helper functions that generate type-safe action cr
Author: Gustorn
Latest version: 25.0.0

# re-ts

A redux helper library for TypeScript. Historically using TypeScript with redux resulted in a lot of boilerplate code. With the most recent additions to the language it is now possible to write convenient helper functions that generate type-safe action creators, action types and reducers.

## Install

```
yarn add --dev @mirango/re-ts
```

## Example

```ts
import { CreateActionType, createActions, makeReducer } from ".";

// Use the createActions helper function to define your actions and action types at the same time
export const [actions, actionTypes] = createActions(action => ({
  increment: action("counter/increment", (value: number) => ({ value })),
  decrement: action("counter/decrement", (value: number) => ({ value })),
  reset: action("counter/reset")
}));

// You can use the CreateActionType helper to define your action type
type TodoAction = CreateActionType<typeof actions>;

// Defining the reducer
const initialState = {
  counter: 0
};

// Create your reducer by specifying:
// - the action type(s) it can handle as the type parameter
// - the initial state
// - and the handler functions for the handled action types
export const reducer = makeReducer<TodoAction>()(initialState, {
  [actionTypes.increment]: (state, { value }) => {
    state.counter += value;
  },
  [actionTypes.decrement]: (state, { value }) => {
    state.counter -= value;
  },
  [actionTypes.reset]: state => {
    state.counter = 0;
  }
});
```
npm package: @mirania/console-colors
Description: useful console text coloring methods
Author: Me
Latest version: 1.0.2

# Console-colors

Improve the JS console's capabilities with pretty colors.

```
npm i @mirania/console-colors
```

The module inherits all functionality from the native ```console```, so you can safely replace it as such:

```js 
const console = require("@mirania/console-colors");
```

-----

## Features

  - methods for coloring a line of text: ```bold(), black(), red(), green(), gold(), blue(), magenta(), cyan(), white(), grey(), gray(), ruby(), leaf(), yellow(), ocean(), pink(), sky(), light()```
  
  - method to create a string with the intended colors: ```format()```, which accepts a **style**. A **style** is an object that can have 2 keys:
  
      - **text**, which may be any of the colors mentioned above
      
      - **bg** or **background**, any of the colors above except **bold**
  
![](https://i.imgur.com/fineExl.png)
npm package: @miranix/tiptap-drag
Description: drag handle extension for tiptap
Latest version: 0.0.1

# Tiptap Extension: GlobalDragHandle
<a href="https://www.npmjs.com/package/tiptap-extension-global-drag-handle"><img alt="NPM Downloads" src="https://img.shields.io/npm/dw/tiptap-extension-global-drag-handle"></a>


## Install

NPM
```
$ npm install tiptap-extension-global-drag-handle
```

Yarn
```
$ yarn add tiptap-extension-global-drag-handle
```

## Usage

```js
import GlobalDragHandle from 'tiptap-extension-global-drag-handle'

new Editor({
  extensions: [
    GlobalDragHandle,
  ],
})
```

In order to enjoy all the advantages of the drag handle, it is recommended to install the [AutoJoiner](https://github.com/NiclasDev63/tiptap-extension-auto-joiner) extension as well, which allows you to automatically join various nodes such as 2 lists that are next to each other.

## Configuration

Optionally, you can also configure the drag handle.

```js
import GlobalDragHandle from 'tiptap-extension-global-drag-handle'

new Editor({
  extensions: [
    GlobalDragHandle.configure({
        dragHandleWidth: 20, // default

        // The scrollTreshold specifies how close the user must drag an element to the edge of the lower/upper screen for automatic 
        // scrolling to take place. For example, scrollTreshold = 100 means that scrolling starts automatically when the user drags an 
        // element to a position that is max. 99px away from the edge of the screen
        // You can set this to 0 to prevent auto scrolling caused by this extension
        scrollTreshold: 100, // default

        // The css selector to query for the drag handle. (eg: '.custom-handle').
        // If handle element is found, that element will be used as drag handle. 
        // If not, a default handle will be created
        dragHandleSelector: ".custom-drag-handle", // default is undefined


        // Tags to be excluded for drag handle
        // If you want to hide the global drag handle for specific HTML tags, you can use this option.
        // For example, setting this option to ['p', 'hr'] will hide the global drag handle for <p> and <hr> tags.
        excludedTags: [], // default

        // Custom nodes to be included for drag handle
        // For example having a custom Alert component. Add data-type="alert" to the node component wrapper.
        // Then add it to this list as ['alert']
        //
        customNodes: [],
    }),
  ],
})
```

## Styling
By default the drag handle is headless, which means it doesn't contain any css. If you want to apply styling to the drag handle, use the class "drag-handle" in your css file.
Take a look at [this](https://github.com/steven-tey/novel/blob/main/apps/web/styles/prosemirror.css#L131) example, to see how you can apply styling.
npm package: @miranser/now-cli-create
Description: Now Component cli creation tool
Latest version: 0.0.4

# now-cli-create
install package from npm :
```
npm i @miranser/now-cli-create -g
```
run command inside your now project to create component.

```
now-cli-create
```
or do it with arguments
```
now-cli-create -c component-name
```