open-index/open-npm huggingface dataset:
npm package: @i-con/pcd-viewer
Description: This library is a visualization *React* module developed to efficiently render data output from the module [pcd-lod](https://github.com/AMDlab/pcd-lod), which converts point cloud data into an LOD (Level of Detail) format for efficient drawing. The purpos
Latest version: 0.0.24

# pcd viewer

This library is a visualization *React* module developed to efficiently render data output from the module [pcd-lod](https://github.com/AMDlab/pcd-lod), which converts point cloud data into an LOD (Level of Detail) format for efficient drawing. The purpose of this module is to facilitate effective visualization of this data on web browsers.

It includes a collection of components using [React Three Fiber](https://github.com/pmndrs/react-three-fiber), allowing for easy integration into any React project.

[API Documentation](https://github.com/AMDlab/rcde-viewer/blob/main/docs/modules.md)

## Installation

```bash
npm install @i-con/pcd-viewer # or yarn add @i-con/pcd-viewer
```

## Usage

```tsx
/**
 * Example component for the point cloud.
 * fetches & renders the point cloud in the /examples/public/uav-8bit directory.
 */
const Example = () => {
  const root = "/uav-8bit";
  const [meta, setMeta] = useState<PointCloudMeta | null>(null);

  // Fetch & set the metadata of the point cloud.
  useEffect(() => {
    axios.get(`${root}/meta.json`).then(({ data }) => {
      setMeta(data);
    });
  }, [root]);

  // Loader callback for the point cloud.
  const loader: PointCloudLODLoader<PngBuffer> = useCallback((props) => {
    const { address, color } = props;
    const { lod, coordinate } = address;
    // Construct the URL of the PNG file from the address.
    const url = `${root}/${lod}/${coordinate.x}-${coordinate.y}-${coordinate.z}`;
    return pngLoader({ url, color });
  }, [root]);

  return meta !== null ? (
    <Visualizer
      pointCloud={{
        meta,
        loader,
        parser: pngParser,
        pointSize: 15,
        lodHelper: true,
      }}
    />
  ) : null;
};
```

## Run example

```bash
git clone pcd-viewer

cd pcd-viewer

npm install # or yarn install

npm run dev # or yarn dev

# then serve the example folder with a static server
```
npm package: @i-dan/cypress-antd
Description: Helpers for interacting with Ant Design components in Cypress tests.
Author: Jan Konopásek
Latest version: 0.4.18

# cypress-antd

Helpers for interacting with Ant Design components in Cypress tests.


## Use

Import the provided helpers directly:

```javascript
import { getButton, shouldHaveTooltip } from '@i-dan/cypress-antd'

// note that "child command" (Cypress terminology) helpers are curried to be used inside `then`
getButton('Cool Button').then(shouldHaveTooltip('The coolness of this button knows no bounds.'))
```

or register them automatically with Cypress as custom commands:

```javascript
import '@i-dan/cypress-antd/lib/register'

// note that "child commands" are registered properly to automatically consume the yielded subject
cy.getButton('Uncool Button').shouldHaveTooltip('This button is so very sad.')
```

_Documentation of individual commands is TBD. For now, the helper names and contracts should be self-explanatory._ 

## Development

### Install

Install dependencies using:

```sh
npm install
```

### Develop

After you modify sources, run the following (or set up your IDE to do it for you):

- format the code using `npm run format`
- lint it using `npm run lint`
- test it using `npm test`

and fix the errors, if there are any.

### Publish

Publishing is done in two steps:

1. Create a new version tag and push it to the repository:
    ```sh
    npm version <patch|minor|major>
    git push --follow-tags
    ```
1. Build and publish the new version as a npm package:
    ```sh
    npm publish --access public
    ```
npm package: @i-davies/minha-lib-shadcn
Description: Biblioteca de componentes React customizados baseados em shadcn/ui
Author: Seu Nome
Latest version: 0.0.3

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## React Compiler

The React Compiler is currently not compatible with SWC. See [this issue](https://github.com/vitejs/vite-plugin-react/issues/428) for tracking the progress.

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```
npm package: @i-group/react-shepherd
Description: [![NPM](https://img.shields.io/npm/v/@shepherdpro/react.svg)](https://www.npmjs.com/package/@shepherdpro/react)
Latest version: 0.0.1-alpha.0

# react

[![NPM](https://img.shields.io/npm/v/@shepherdpro/react.svg)](https://www.npmjs.com/package/@shepherdpro/react)

This is a React wrapper for the [Shepherd](https://github.com/@shepherdpro/react) tour library.
It's mainly a wrapper around the Shepherd library that exposes the tour object and methods to the context object
that can be passed into props for dynamic interactivity.

## Install

Use this simple NPM command or whatever package manager is your favorite.

```bash
npm install --save react-shepherd
```

## Usage

### Via Provider/Context

```tsx
import { Component, useContext } from 'react';
import { ShepherdJourneyProvider, useShepherd } from '@shepherdpro/react';
import newSteps from './steps';

const tourOptions = {
  defaultStepOptions: {
    cancelIcon: {
      enabled: true
    }
  },
  useModalOverlay: true
};

function Button() {
  const Shepherd = useShepherd();
  const tour = new Shepherd.Tour({
    ...tourOptions,
    steps: newSteps
  });

  return (
    <button className="button dark" onClick={tour.start}>
      Start Tour
    </button>
  );
}

export default function App() {
  return (
    <div>
      <ShepherdJourneyProvider>
        <Button />
      </ShepherdJourneyProvider>
    </div>
  );
}
```

## Configuration

The following configuration options for a tour can be set on the `useShepherd` hook to control the way that Shepherd is used. This is simply a POJO passed to Shepherd to use the options noted in the Shepherd Tour [options](https://docs.shepherdjs.dev/api/tour/classes/tour/). 

## License

MIT
npm package: @i-is-as-i-does/jack-js
Description: Minimal sets of utilities. Notable mentions: easy dynamic CSS/JS loading, easy oembed request, pretty url shorteners, element-in-dom promise, template CSS stylesheet generator, easy local storage handling.
Author: i-is-as-i-does
Latest version: 1.0.11

# Jack Js

Minimal sets of utilities.

Jack of all trades is now in Javascript flavour!  
PHP counterpart over [here](https://github.com/I-is-as-I-does/Jack).

This is a work in progress.  
Cherrypick anything.

## Notable mentions 

- easy dynamic CSS/JS loading
- easy oembed request
- pretty url shorteners
- element-in-dom promise
- template CSS stylesheet generator
- easy local storage handling

Just take a look at those files already!

## How to

Install

```bash
npm install @i-is-as-i-does/jack-js
```

Use

```js
import Jack from '@i-is-as-i-does/jack-js';

console.log(Jack.ucFirst('bob'))
```

## Overview

### Check

```js
isEmpty(it)
isElement(obj)
seemsLikeValidDate(string)
isNonEmptyStr(it)
isNonEmptyObj(it)
isNonEmptyArr(it)
isEven(numbr)
```

### Help

```js
ucFirst(string)
randomInt(min, max)
charCut(string, limit, cutAnywhere = false)
randomString(length = 10)
waitForElmInDOM(elmSelector, parentElm = null)
replaceDiacritics(text)
escapeRegExp(string)
deepCopy (obj) 
splitOnLineBreaks (string)
toNum(string)
```

### Stock

```js
getSessionStorage()
getLocalStorage()
sizeInBytes(s)
jsonSize(obj, inKb = true, alreadyJson = false)
clearPartialStorage(store, threshold = 2000)
isStorageAvailable(type)
copyToClipboard(content, callback)
```

### Style

```js
nonRenderedElmHeight(elm)
elmHasStyle(elm, property)
cssExtract(strength = 2)
autoScrollToBottom(elm)
autoScrollToTop(elm)
```

### Web

```js
loadJs(signatureVar, url)
isValidHttpUrl(string)
loadJson(url)
oembedLink(url, provider, maxwidth = null, maxheight = null)
oembedResponse(oembedLink)
oembedIframe(oembedResponse)
pathBasename(path)
pageHasSheet(signatureRule, url)
loadCss(signatureRule, url, shadowRootElm = null)
loadPagePreviewImg(url, useCache = true)
conciseUrl(string, withPath = true)
miniUrl(string)
searchUrlParam(name)
toLastSlash(url)
displayUrl (url)
stripHttp (url)
stripLastSlash (url)
```


## Contributing

Sure! You can take a loot at [CONTRIBUTING](CONTRIBUTING.md).

## License

This project is under the MIT License; cf. [LICENSE](LICENSE) for details.

![All The Trades!](https://github.com/I-is-as-I-does/Jack/raw/main/Jack-of-all-Trades-Lynn-Fisher_Hyperbole-and-a-half.jpg)
npm package: @i-is-as-i-does/vue-3-slide-fade
Description: Added optional fade in / fade out support to Craig Riley's vue3-slide-up-down
Author: i-is-as-i-does
Latest version: 1.0.0

# Vue 3 Slide Fade

Quick and dirty fork of Craig Riley's [`vue3-slide-up-down`](https://github.com/craigrileyuk/vue3-slide-up-down.git)  
Added optional fade in / fade out support

Regarding transitions, you might also take a look at ['Vâlvă'](https://github.com/I-is-as-I-does/Valva)  
You'll find a Vue 3 component in ['src/vue'](https://github.com/I-is-as-I-does/Valva/tree/main/src/vue)

## Usage

The component takes 8 props:  

| name           | type    | required | description                                        | default       |
| -------------- | ------- | -------- | -------------------------------------------------- | ------------- |
| v-model*       | boolean | yes      | Whether to show the component or not               | N/A           |
| fade           | boolean | no       | Animate opacity or not                             | false         |
| duration       | number  | no       | How long the animation will be in ms               | 400           |
| slideTiming    | string  | no       | CSS transition-timing-function applied to height   | "ease-in-out" |
| fadeTiming     | string  | no       | CSS transition-timing-function applied to opacity  | "ease-in-out" |
| tag            | string  | no       | The HTML tag to use for the wrapper element        | "div"         |
| responsive     | boolean | no       | Animate height when contents are changed           | false         |


* or `modelValue` if a method is required

```html
<div class="MyContent">
  <h1>Always show this</h1>
  <ul>
<li v-for="(item, index) in list" :key="index">
  <slide-fade :modelValue="isActive(index)" :fade="true">
    Only show this if "isActive(index)" returns true
  </slide-fade>
<li>
  </ul>
</div>
```

The component emits five Vue events:

- `open-start`
- `open-end`
- `close-start`
- `close-end`
- `layout-shift`

```html
<slide-fade @close-end="() => console.log('done closing!')" />
```
npm package: @i-lab/next-server
Description: A comprehensive server-side framework for Next.js applications
Author: Milad Khaleghi
Latest version: 0.0.5

# i-Lab Next.js Server

A comprehensive server-side framework for Node.js applications with built-in support for Next.js, Prisma, and authentication.

## Features

- 🚀 Built for Next.js API routes
- 🔒 Built-in authentication with NextAuth.js
- 📦 Prisma integration
- 🔍 Advanced query builder
- 🎯 Type-safe with TypeScript
- ⚡ High performance
- 🛠️ Extensible architecture

## Installation

```bash
npm install @i-lab/next-server
```

## Quick Start

```typescript
import { BaseController, BaseService, BaseRepository } from '@i-lab/next-server';

// Define your repository
class UserRepository extends BaseRepository<User> {
  constructor() {
    super('User');
  }
}

// Define your service
class UserService extends BaseService<User> {
  constructor() {
    super(
      new UserRepository(),
      userCreateSchema,
      userUpdateSchema,
      ['name', 'email'],
      ['posts']
    );
  }
}

// Define your controller
class UserController extends BaseController<User> {
  constructor() {
    super(new UserService());
  }
}
```

## Documentation

For detailed documentation, visit [our documentation site]().

## Contributing

We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for details.
npm package: @i-m-afk/node-modules-cleaner
Description: find and delete node_modules
Author: Rishav Kumar
Latest version: 2.0.2

# `node_modules` Cleaner

![Image](image.png)

## Description

An easy way to clean all the `node_modules` folders in your projects. This script will search and delete all the selected `node_modules` folders in the current directory/ path provided by user and all its the subdirectories.
An alternative to npkill.

## Usage

1. `npm i @i-m-afk/node-modules-cleaner`
2. `npx node-modules-cleaner`