open-index/open-npm huggingface dataset:
npm package: @ilchin/schematics
Description: Nest - modern, fast, powerful node.js web framework (@schematics)
Latest version: 10.2.3

<p align="center">
  <a href="http://nestjs.com/" target="blank"><img src="https://nestjs.com/img/logo-small.svg" width="120" alt="Nest Logo" /></a>
</p>

  <p align="center">A progressive <a href="http://nodejs.org" target="blank">Node.js</a> framework for building efficient and scalable server-side applications.</p>
    <p align="center">
<a href="https://www.npmjs.com/~nestjscore"><img src="https://img.shields.io/npm/v/@nestjs/schematics.svg" alt="NPM Version" /></a>
<a href="https://www.npmjs.com/~nestjscore"><img src="https://img.shields.io/npm/l/@nestjs/schematics.svg" alt="Package License" /></a>
<a href="https://www.npmjs.com/~nestjscore"><img src="https://img.shields.io/npm/dm/@nestjs/schematics.svg" alt="NPM Downloads" /></a>
  <a href="https://coveralls.io/github/nestjs/nest?branch=master" target="_blank"><img src="https://coveralls.io/repos/github/nestjs/nest/badge.svg?branch=master#9" alt="Coverage" /></a>
<a href="https://discord.gg/G7Qnnhy" target="_blank"><img src="https://img.shields.io/badge/discord-online-brightgreen.svg" alt="Discord"/></a>
<a href="https://opencollective.com/nest#backer" target="_blank"><img src="https://opencollective.com/nest/backers/badge.svg" alt="Backers on Open Collective" /></a>
<a href="https://opencollective.com/nest#sponsor" target="_blank"><img src="https://opencollective.com/nest/sponsors/badge.svg" alt="Sponsors on Open Collective" /></a>
  <a href="https://paypal.me/kamilmysliwiec" target="_blank"><img src="https://img.shields.io/badge/Donate-PayPal-ff3f59.svg"/></a>
  <a href="https://twitter.com/nestframework" target="_blank"><img src="https://img.shields.io/twitter/follow/nestframework.svg?style=social&label=Follow"></a>

## Description

The Nest CLI is a command-line interface tool that helps you to initialize, develop, and maintain your Nest applications. It assists in multiple ways, including scaffolding the project, serving it in development mode, and building and bundling the application for production distribution. It embodies best-practice architectural patterns to encourage well-structured apps. Read more [here](https://docs.nestjs.com/cli/overview).

## Installation

```bash
$ npm install -g @nestjs/schematics
```

## Usage

Learn more in the [official documentation](https://docs.nestjs.com/).

## Stay in touch

- Website - [https://nestjs.com](https://nestjs.com/)
- Twitter - [@nestframework](https://twitter.com/nestframework)

## License

Nest is [MIT licensed](LICENSE).
npm package: @ildella/nostandard
Description: Eslint standard for bad people.
Author: Daniele Dellafiore
Latest version: 0.3.1

# NoStandard

A consolidation of my old [eslint configurations](https://github.com/ildella/eslint-config-node-moar) ported to ESLint 9+ and Flat configuration. 

The overall project structure has been taken from [NeoStandard](https://github.com/neostandard/neostandard) from which I also borrowed some additional `base` and `style` rules that despite were not in my original ruleset, were not causing any issue with my current projects. They have all been converted to the Golden Rule. 

## Usage

```shell
yarn add -D @ildella/nostandard

# Or
pnpm add -D @ildella/nostandard

# Or, if you are an horrible person:
npm install -D @ildella/nostandard
```

And this is and example on how to use it in your `eslint-config.js`.

```js
import nostandard from '@ildella/nostandard'

export default [
  {
    name: 'Your project name',
    // ...
  },
  ...nostandard(),
  {
    // languageOptions: {...},
    // plugins: {...},
    // rules: {...}
  },
  {
    name: 'Testing config...',
    files: ['tests/**/*.*js'],
    // ...mytestlib.configs['flat/recommended'],
    // rules: {...},
  },
]
````

## Why not NeoStandard then?

There are too many useless dependencies. Especially I do not consider usable anything that gives for granted that developers use React, or any other specific framework. Why would I want anytning JSX or React in my NodeJS or Svelte projects? 

For the same reason, I do not want `eslint-plugin-n` as a default dependency.

Finally, they do not respect my golden rule.

## Golden Rule

If it breaks, it's an error. 
If it does not break, it's a warning. 

With one and only one special exception, as all good rules must have an exception. 

## What's in here?

For now only basic ESLint basic and [Stylistic](https://eslint.style/)

I will consider adding more stuff here like `Promise`, `eslint-plugin-import-x` and `security`.

I will also create a NodeJS dedicated configuration, based on `eslint-plugin-n`, `eslint-plugin-functional` and `eslint-plugin-unicorn`, refactoring them out of my current projects into a companion library to NoStandard.
npm package: @ildm/demo-package
Description: Sample package: Node.js for beginners
Author: Igor Leandro Dantas Medeiros
Latest version: 1.1.0

# Exemplo de pacote:  Dominando Node.Js

## Instalação

```bash
npm install @ildm/demo-package
```

## Uso

```js
import {sum, multiply} from '@ildm/demo-package'
console.log(sum(1, 2)
console.log(multiply(5, 2)
```
npm package: @ildug/cookie-consent
Description: banner for cookies law, and proof of consent
Author: DagTech
Latest version: 3.1.1

# cookie-consent

[![build and test](https://github.com/ilDug/cookie-consent/actions/workflows/test.yaml/badge.svg)](https://github.com/ilDug/cookie-consent/actions/workflows/test.yaml)

banner for cookies law

## Installation

install via npm package manager.

```bash
npm install @ildug/cookie-consent
```

## Import

Import into each html page the main script andrun main function.

```html
<script src="/lib/dcc/cookie-consent-bundle.js"></script>
<script>
    window.onload = async () => {
        window.dcc_init({
            /** override default configs*/
            policyVersion: new Date("2022-10-24"),
            cookiePolicyLink: "/privacy/cookies",
        });
    };
</script>
```

as well css styles:

```html
<link rel="stylesheet" href="/lib/dcc/cookie-consent.css" />
```

### Default configurations

```typescript
{
    selectorId: "dcc-container",
    diplayRejectAllBtn: true,
    updateFrequency: /** 6 month expressed in milliseconds*/,
    policyVersion: /** set your policy Date*/,
    consentCookieName: 'dcc',
    cookiePolicyLink: "/privacy/cookies"
}
```

## Block Scripts

Any script that can write cookies must be blocked.

STEP1: replace type.

-   Simply replace attribute _text/javascript_ with _text/plain_

STEP2: bind to a selected categories.

There is some main categories that the user can be select as preferences:

-   technical **(always active)**
-   functional
-   performance
-   targeting
-   social

Add attribute `dcc` to each blocked script in order to apply the user preferences.
Example:

```html
<script src="/my-script.js" type="text/plain" dcc-script="technical"></script>

or

<script type="text/plain" dcc-script="functional">
    alert("Hello World")
</script>
```

### Behaviour

The script run on windows load. Then check if preferences cookie is present. If not, diplay the banner.

## Open prefences

To open consent preferences, you must place a link with attributes _`dcc-open`_:

```html
<p>
    <a href="#" dcc-open>opens cookie settings</a>
</p>
```

## Listen save event

After you savedyour consent you can run any other task by listening for the DccSaveEvent.

```javascript
document.addEventListener("dcc-save", (e) => {
    console.log("Consent saved");
})
```

## Configuration and prefences

TO DO.
npm package: @ildug/dag-mat-spinner
Description: full screen spinner based on Angular Material
Author: ilDug
Latest version: 0.2.6

# dag-mat-spinner

A full screen spinner based on Angular Material
This package is intended to be use in Angular projects as NgModule. See [demo](http://dagtech.it).

Updated to Angular 11.

## Installation 

To get started, install the package with npm or Yarn:

    npm install @ildug/dag-mat-spinner

or 

    yarn add  @ildug/dag-mat-spinner


## Usage

Import the module in your angular app. In your module **app.module.ts**

``` typescript
    ...
    import { DagMatSpinnerModule } from 'dag-mat-spinner';

    @NgModule({
        declarations: [
            AppComponent,
        ],
        imports: [
            ...
            DagMatSpinnerModule,
            ...
        ],
        bootstrap: [AppComponent]
    })
    export class AppModule { }
```

Then add directive "*dagSpinner*" to your template wherever you want. The spinner is triggered through a boolean property.
In **my.component.ts**

``` typescript
    @Component({
        selector: 'root',
        templateUrl: "my.component.html",
        styles: []
    })
    export class MyComponent {
        ...
        public loading : boolean;

        onLoadMethod(){
            this.loading = true;
            /** your logic */
        }
        ...
    }

``` 

In **my.component.html**

``` html
    <div [dagSpinner]="loading">
            <!-- template content -->
    </div>
```


## Theming

This package is dependent from [Angular Material](https://material.angular.io). It comes with all dependencies, *but you must to theming colors*.

Add  material themes style reference to your angular project **angular.json** file:

``` json
    ...
    "styles": [
      "node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
      "src/styles.scss"
    ],
    ...
``` 

or include one line in your **styles.css** file

``` css
    @import '@angular/material/prebuilt-themes/indigo-pink.css';
 ``` 

Alternatively, you can just reference the file directly. This would look something like:

``` html
    <link href="node_modules/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">
```
npm package: @ildug/dag-ngx
Description: A utilities library for Angular applications.
Author: ilDug
Latest version: 21.0.2

# DagNgx
[![Build](https://github.com/ilDug/ngx/actions/workflows/build-and-test.yaml/badge.svg)](https://github.com/ilDug/ngx/actions/workflows/build-and-test.yaml)


DagNgx is a collection of Angular components and utilities designed to simplify the development of complex applications. It provides a set of reusable UI components, services, and tools that can be easily integrated into your Angular projects.


## Installation
To install DagNgx, you can use npm:

```bash
npm install dag-ngx
```

## Usage
After installing DagNgx, you can import the desired components and services into your Angular modules. For example, to use a component:

```typescript
...
import { DagError } from 'dag-ngx';
...

@Component({
    ...,
    imports: [..., DagError],
    ...
})
export class YourComponent {
  ...
}
```


## Features

### DagError
A component for displaying error messages in a user-friendly manner when used with **Angular signal forms**. It can be used to show validation errors, server errors, or any other type of error that may occur in your form.

```html
    <form novalidate (submit)="onSubmit($event)">
        <div>
            <label>email</label>
            <input type="email" [formField]="form.email" />
            <dag-error [field]="form.email"></dag-error>
        </div>
        <div>
            <button type="submit" class="btn">Submit</button>
        </div>
    </form>
```

### DagDrag and DagDrop
Directives for implementing drag-and-drop functionality in your Angular applications. They allow you to easily make elements draggable and define drop zones where draggable items can be dropped.

```html
    <div id="dragme">
        <h5>drag a object</h5>
        <div id="cards">
            @for (obj of items; track obj.name) {
                <span class="semen">
                    <img [src]="obj.src" [dagDrag]="obj" (onDrag)="isDragging($event)" />
                </span>
            }
        </div>
    </div>
    <div id="dropme" (dagDrop)="setObject($event)">
        <h5>drop here</h5>
        @if (object()) {
            <span class="semen">
                <img [src]="object().src" />
            </span>
        }
    </div>
```

Use `[dagDrag]` to make an element draggable and bind it to the data you want to transfer during the drag operation. Use `(dagDrop)` to define a drop zone and handle the dropped data.

Use `(onDrag)` to listen for dragging events and update your component state accordingly. it returns a boolean indicating whether the element is currently being dragged.

### DagLoader
A collection of loading spinner components that can be used to indicate loading states in your Angular applications.
DagLoader includes various spinner styles, such as pulsing and bouncing loaders, which can be easily customized and integrated into your application.

```html
    <div *dagLoader="loading(); color: '#e4b2b2'; fullScreen: false; type: 'bouncing'">
        <p>...it's not a moon it's a space station...</p>
    </div>
```
npm package: @ildug/ngx-confirm
Description: a mat-dialog to get confirm
Author: ilDug
Latest version: 2.2.0

# ngx-confirm

[![Publish Node.js Package](https://github.com/ilDug/ngx-confirm/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/ilDug/ngx-confirm/actions/workflows/npm-publish.yml)

A mat-dialog to get cofirmations. Use it with a button.

[Demo](https://ildug.github.io/ngx-confirm/)

## Installation

```
npm i @ildug/ngx-confirm
```

## Usage

import the diretive into your component:

```typescript
...
import { NgxConfirmDirective } from '@ildug/ngx-confirm';
...

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    standalone:true,
    imports:[ ...,  NgxConfirmDirective]
})
export class AppComponent {

    ....

    doSomething() {
        ....
    }

}


```

Add the directive into a button. Bind the confrim event to the method to trigger.

```html
<button ngxConfirm (confirm)="doSomething()">delete</button>

/* or pass a custom message*/
<button ngxConfirm="my message: Are your sure?" (confirm)="doSomething()">delete</button>
```

## Style

Be sure to,import Angular Material Theme, in order to get a nice behaviour.

```scss
@import "@angular/material/prebuilt-themes/azure-blue.css";
```

To style buttons , you have to define some class:

```scss

// with aphrodite-sass
.btn{...}
.btn-main{...}

// or alternatively
.ngx-confirm-btn{...}
.ngx-confirm-btn-main{...}
.ngx-confirm-btn-cancel{...}

```
npm package: @ildug/ngx-dragdrop
Description: Angular directives for passing data with Drag & Drop
Author: ilDug
Latest version: 1.2.0

# ngx-dragdrop
Angular directives for passing data with Drag & Drop.

## Demo
See [demo](http://ngx-dragdrop.dagtech.it)


## Install

Install via package manager or fork this project ("projects/ngx-dragdrop/src")

NPM 

```
npm install @ildug/ngx-dragdrop
```
YARN 

```
yarn add @ildug/ngx-dragdrop
```

## Usage in angular app

Import the module in your angular app. In your module **app.module.ts**

``` typescript
    ...
    import { NgxDragdropModule } from '@ildug/ngx-dragdrop';

    @NgModule({
        declarations: [
            AppComponent,
        ],
        imports: [
            ...
            NgxDragdropModule,
            ...
        ],
        bootstrap: [AppComponent]
    })
    export class AppModule { }
```

### dagDrag

Add the directive to an element to give it the *draggable* behaviour. Then assign a value to an element witch will be dragged.


In **my.component.html**

``` html
<div [dagDrag]="item" > drag me </div>
```

### dagDrop
Add the directive to an element to give it the *droppable* behaviour. Listen for the drop event and get dropped data

``` html
<div (dagDrop)="useItem($event)" > drop here </div>
``` 

When the draggable element enter in drop area,  **drop-over**  class is added to this element.

## To Do

- drag-start and drag-end events emitters
- drag-enter and drag-leave events emitters
npm package: @ildug/ngx-errors
Description: Form errors display directives for Angular
Author: ilDug
Latest version: 2.5.1

# ngx-errors

[![Publish Node.js Package](https://github.com/ilDug/ngx-errors/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/ilDug/ngx-errors/actions/workflows/npm-publish.yml)
[![Build and Test](https://github.com/ilDug/ngx-errors/actions/workflows/build%20and%20test.yml/badge.svg)](https://github.com/ilDug/ngx-errors/actions/workflows/build%20and%20test.yml)

Form errors display directives for Angular.

Updated to Angular 18.

try a [demo](https://ildug.github.io/ngx-errors/)

## Install

Install via package manager or fork this project ("projects/ngx-errors/src")

NPM 

```
npm install @ildug/ngx-errors
```

## Usage in angular app

Import the module in your angular component. In your module **app.module.ts**

``` typescript
    ...
@Component({
    ...,
    standalone: true,
    imports: [..., ReactiveFormsModule, NgxErrorsModule],
    ...
})
export class AppComponent {
    form = new FormGroup({
        "email": new FormControl(null, [Validators.required, Validators.email])
    });
}

```

### Form errors display

Add the directive to an element where errors will be diplayed.

**dagErrors** is the *name* of the reference input element.

**dagError** is the error name issued by  *Angular Validator* 

**when** indicates when the error message will be shown.

In **my.component.html**

``` html
<form [formGroup]="form" >
    ...
    <div class="my-input-container">

        <input type="email" formControlName="email">

        <div dagErrors="email" class="error">
            <div dagError="required" when="touched"> Please, insert a value</div>
            <div dagError="email" when="touched"> Ops, incorrect email format</div>
            <div dagError="otherError" [when]="[dirty, pristine]"> always show this message when otherError is present</div>
        </div>

    </div>
    ...
</form>
```
npm package: @ildug/ngx-loader
Description: spinner loader angular directive
Author: ilDug
Latest version: 1.0.0

# ngx-loader

[![Publish Node Package](https://github.com/ilDug/ngx-loader/actions/workflows/publish.yml/badge.svg)](https://github.com/ilDug/ngx-loader/actions/workflows/publish.yml)

spinner loader directive for angular project

## Install 
```
npm i @ildug/ngx-loader
```


## Usage

Import the module **NgxLoaderModule** into the main module of App.

``` typescript
...
import { NgxLoaderModule } from 'ngx-loader';


@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        ...,
        NgxLoaderModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }
```
Use th structural diretcive in Template. Prefix the directive with *. 

Use a variable to trigger the spinner.
**Always use a parent container or div.**


``` html
    <div class="box">
        <div *dagLoader="loading">
            <h1>B</h1>
        </div>
    </div>
```

with options:
``` html
    <div class="box">
        <div *dagLoader="loading; color:'#e4b2b2'; fullScreen: false; type:'pulsing';">
            <h1>B</h1>
        </div>
    </div>
```

## Options
| | |
| ---: | --- |
| **color**: | *Spinner color as HEX string* |
| **fullScreen**: | *whether spinner cover the parent element or the whole screen.* |
| **type**: | *spinner type. Select between PULSING (default),  BOUNCING or SPINNER. |
npm package: @ildug/ngx-toast
Description: another angular toast
Author: ilDug
Latest version: 3.4.0

# NgxToast

[![Publish Node.js Package](https://github.com/ilDug/ngx-toast/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/ilDug/ngx-toast/actions/workflows/npm-publish.yml)

Angular Toast

ANGULAR VERSION: 18 (now it use signals)

See [demo](https://ildug.github.io/ngx-toast/)

## Installation

```
npm i @ildug/ngx-toast
```

## Usage

Import the main module **NgxToastModule** in your angular component:

```typescript
import { CommonModule } from "@angular/common";
import { Component, inject } from "@angular/core";
import { NgxToastModule } from "ngx-toast";
import { NgxToastService } from "ngx-toast";

@Component({
    selector: "app-root",
    templateUrl: "./app.component.html",
    styleUrls: ["./app.component.scss"],
    standalone: true,
    imports: [CommonModule, NgxToastModule],
})
export class AppComponent {
    private toast = inject(NgxToastService);

    open() {
        this.toast.info("May the Force be with you.", 55000);
        this.toast.error("These aren't the droids you're looking for. ", 55000);
        this.toast.warning("Do or do not. There is no try.", 55000);
    }
}
```

The directive **dagToast** must be added everywhere in a component into an element that is always visible. We suggest to add to the main container of the application page.

```html
<div dagToast>
    Main content of the application

    <button (click)="open()">Toast</button>
</div>
```

Open a toast using the service NgxToastService.

NgxToastService has a main methods **create**

```typescript
create(message: string, options?: {type: ['INFO', 'WARNING', 'ERROR'],  duration: milliseconds})

```

and muliple shortcuts:

-   info
-   danger
-   warning

## Styling colors

Some style properties can be adjusted usign css variables.

add these definition to your css style

```scss
:root {
    --c-main: hsl(194, 38%, 57%); // color for INFO toast
    --c-warn: hsl(48, 100%, 67%); // color for WARNING toast
    --c-error: hsl(0, 100%, 67%); // color for ERROR toast

    --toast-c: hsl(0, 0%, 25%); // toast text color
    --toast-bg: hsl(0, 0%, 100%); // toast background color
    --toast-b: hsl(0, 0%, 80%); // toast border color
}
```
npm package: @ildug/sub-limbo
Description: RXJS subscriptions managment
Author: ilDug
Latest version: 1.0.1

# sub-limbo

## RXJS subscriptions managment

Forget to manage all subscriptions in tour Angular component.


## Installation

```
npm install @ildug/sub-limbo
```

## Usage

Example:

``` typescript

import { Limbo } from '@ildug/sub-limbo';

...
export class SomeComponent implements OnDestroy{
    
    private subs = new Limbo();

    ...
    this.subs.oblium = observable1$.subscribe();
    this.subs.oblium = observable2$.subscribe();
    this.subs.oblium = observable3$.subscribe();
    ...

    ngOnDestroy(){ this.subs.forget() }
}

```
npm package: @ilearnbydoing/gatsby-wordpress-deva-theme
Description: A Feature-rich Gatsby theme plugin for creating blogs from headless WordPress CMS.
Author: Durgesh Gupta
Latest version: 1.0.41

# gatsby-wordpress-deva-theme

A Gatsby theme plugin for creating blogs from headless WordPress CMS.

The theme is inspired and customized from [Draftbox Gatbsy Balsa Theme](https://github.com/draftbox-co/gatsby-wordpress-balsa-theme). Thanks to Draftbox team.

Turn your WordPress blog into a lightning fast static website. This Gatsby theme is a frontend replacement of the WordPress engine featuring the standard Deva theme skin and functionality. All content is sourced from a headless WordPress CMS.

> Get lightning fast, secure front-end for your WordPress blog, in 5 minutes or less, without coding. For our fellow devs, we also provide code export feature.

## Demo

Play with the [Demo - My Personal Website](https://durgeshgupta.com) to get a first impression.

## Features

- Deva theme
- SEO optimized
- Fully responsive
- Gatsby images
- Styled 404 page
- RSS Feed
- AMP Pages
- Sitemap
- Contact Form
- Subscribe Form
- Social Sharing
- Composable and extensible

Credit: [Draftbox WordPress Balsa Theme](https://github.com/draftbox-co/gatsby-wordpress-balsa-theme)
npm package: @ileostar/tailwind-config
Description: The Tailwind CSS configuration for LeoStar's projects
Author: ileostar
Latest version: 0.0.3

# @ileostar/tailwind-config

The Tailwind CSS configuration for LeoStar's projects.

## Usage

```bash
pnpm add @ileostar/tailwind-config
```

```ts
// tailwind.config.ts
import sharedConfig from '@ileostar/tailwind-config'
import type { Config } from 'tailwindcss'

const config: Config = {
  darkMode: 'class',
  content: ['./src/**/*.{ts,tsx}'],
  presets: [sharedConfig],
  // ...
}
export default config
```

## License

[MIT](./LICENSE) License © 2024 [ileostar](https://github.com/ileostar)