open-index/open-npm huggingface dataset:
npm package: @jailandrade/dropdown-menu
Description: A simple dropdown menu
Author: Mikhail Cruz Andrade
Latest version: 1.0.11

# Dropdown Menu

This is a simple dropdown menu to display an array of strings and select one.


## How to use


You could use this component in two ways:

### Select any option

```jsx
import {DropdownMenu} from "@jailandrade/dropdown-menu";

function App() {
  const options = [
    "Victor",
    "Emiliano",
    "Maximiliano",
    "Juan Gabriel",
    "Juan Camaney",
    "Gol D. Roger",
    "Hercules",
  ];
  return (
    <div class="p-8">
      <DropdownMenu legend="Elige un usuario" options={options} match="" />
    </div>
  );
}
```

### Only one option is selectable

If you pass a string to the `match` prop, then only that option will be selectable.


To use this package you could use the next snippet:

```jsx
import {DropdownMenu} from "@jailandrade/dropdown-menu";

function App() {
  const options = [
    "Victor",
    "Emiliano",
    "Maximiliano",
    "Juan Gabriel",
    "Juan Camaney",
    "Gol D. Roger",
    "Hercules",
  ];
  return (
    <div class="p-8">
      <DropdownMenu legend="Elige un usuario" options={options} match="" />
    </div>
  );
}
```

If you pass a string to the `match` prop, then only that option will be selectable.
npm package: @jailbreak-paris/svelte-mapbox-gl
Description: Mapbox GL components for Svelte
Author: Christophe Benz
Latest version: 0.1.9

# svelte-mapbox-gl

Svelte 3 components for Mapbox GL.

[Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js) is a JavaScript library that uses WebGL to render interactive maps from vector tiles and Mapbox styles.

[Svelte](https://svelte.dev/) is a JavaScript compiler used to build user interfaces similar to React or Vue, but lighter because components are compiled.

The provided components follow Svelte idioms as much as possible (declarative props, etc.), while keeping the same namings used by Mapbox GL JS (for objects, options and events).

## Usage

See Storybook: https://jailbreak.gitlab.io/svelte-mapbox-gl

Basic usage:

```javascript
<script>
  import {
    Map,
    Marker,
    NavigationControl,
    Popup
  } from "@jailbreak-paris/svelte-mapbox-gl";
  const coordinates = { lat: 48, lng: 3 };
</script>

<Map
  accessToken="xxx"
  style="mapbox://styles/mapbox/streets-v11"
  center={coordinates}
  zoom={10}>
  <NavigationControl />
  <Marker {coordinates}>
    <Popup>I'm a popup attached to a marker!</Popup>
  </Marker>
</Map>
```

### Mapbox GL Javascript and CSS

This package defines [mapbox-gl](https://www.npmjs.com/package/mapbox-gl) as a peer dependency.
It needs it, but it's the responsibility of the application using it to provide the `mapbox-gl` module.

About JavaScript two scenarios are possible:

- source Mapbox GL script in the DOM via a `<script src="">` tag targeting the CDN URL, and configure your module bundler (e.g. [Rollup](https://rollupjs.org/), [Webpack](https://webpack.js.org/), etc.) to consider the `mapbox-gl` module as external (see below).
- install the `mapbox-gl` from npm in your application

About CSS two scenarios are possible:

- source Mapbox GL stylesheet in the DOM via a `<link>` tag targeting the CDN URL
- import `mapbox-gl/dist/mapbox-gl.css` from your JavaScript code and setup your module bundler to manage CSS

See also: https://docs.mapbox.com/mapbox-gl-js/overview/

If you choose to include the script via a `<script>` DOM element, you must configure your module bundler to let it "redirect" the `mapbox-gl` module to the global variable `window.mapboxgl` which is provided by the sourced `<script>`. For example, see [Webpack externals](https://webpack.js.org/configuration/externals/) or [Rollup globals + externals](https://rollupjs.org/guide/en/#outputglobals).

### Access token

To avoid hard-coding your `accessToken`, you may load it from your environment (e.g. with [dotenv](https://www.npmjs.com/package/dotenv)). The Storybook uses the access token of all Mapbox GL JS demos (e.g. [Display a map](https://docs.mapbox.com/mapbox-gl-js/example/simple-map/)).

## Documentation

TODO

Meanwhile, read the source code and look at the [Storybook](https://jailbreak.gitlab.io/svelte-mapbox-gl) to know about components, their properies and events.

## Similar projects

- https://github.com/beyonk-adventures/svelte-mapbox
- https://soal.github.io/vue-mapbox/
- http://alex3165.github.io/react-mapbox-gl/
- https://uber.github.io/react-map-gl/
npm package: @jailers-oss/internal-mde
Description: Internal markdown editor
Author: Jailers
Latest version: 0.1.2

# @jailers-oss/internal-mde

> Internal Markdown editor

## Install

### NPM

```bash
npm install --save vue markdown-it @jailers-oss/internal-mde
```

### Yarn

```bash
yarn add vue markdown-it @jailers-oss/internal-mde
```

## Basic usage

```vue
<template>
  <div id="app">
    <markdown-editor v-model="output" locale="cs" />
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import MarkdownEditor from '@jailers-oss/internal-mde'

export default Vue.extend({
  name: 'app',

  components: {
    MarkdownEditor,
  },

  data() {
    return {
      output: '',
    }
  },
})
</script>
```

## License

MIT
npm package: @jaimebboyjt/three-scatter
Description: A Three.js library for scattering 3D models
Latest version: 0.5.0

![npm](https://img.shields.io/npm/v/@jaimebboyjt/three-scatter)
<!-- ![downloads](https://img.shields.io/npm/dw/@jaimebboyjt/three-scatter) -->

# Three scatter

> Inspired by a GScatter (plugin for blender) in Three.js

Spread all types of objects/models into a geometry easily

![Demo GIF](./public/Multi_model.gif)

## Installation

```bash
npm i @jaimebboyjt/three-scatter
```

## Why to use it

Three.js already comes with [MeshSurfaceSampler](https://threejs.org/docs/?q=meshS#examples/en/math/MeshSurfaceSampler) you can think in `three-scatter` as an "extension" of it. I said it in quotes because is not quite true, `three-scatter` the approach is different and it comes with method to help scatter your Meshes.

Use `three-scatter` if you:
- Would like to scatter complex models (3D models with animations, rigging, etc)
- Want to align your model to the surface base, easily
- Would like to tweak in real-time (or with panels) seeds, or any property of your 3D model to scatter
- Want to remove collisions, easily.

## Docs

Check our new demos: https://three-scatter-docs.netlify.app/

## Contributing

We are open to contributions, please read the [contributing guide](/CONTRIBUTING.md) to get started.

## License

[MIT](/LICENSE)

## Sponsors

Be the first to support this project [here](LINK) ☺️.