open-index/open-npm huggingface dataset:
npm package: @hadl-labs/changelog-github
Description: Fork of [@changesets/changelog-github ](https://github.com/changesets/changesets/tree/f6f3d0bfdb69a80648eee5734762bb59c5cdbbca/packages/changelog-github)
Latest version: 0.5.0

Fork of [@changesets/changelog-github
](https://github.com/changesets/changesets/tree/f6f3d0bfdb69a80648eee5734762bb59c5cdbbca/packages/changelog-github)
npm package: @hadl/patternlab-plugin-pattern-wrap
Description: Pattern Wrapper Plugin for Pattern Lab Node
Author: Andreas Bibow
Latest version: 1.0.2

# Pattern Wrapper Plugin for Pattern Lab Node

This plugin allows users to add a wrapper div with css class(es) around a pattern when shown in the
single preview.   
If it gets included in another pattern, the wrapper is not added.

This comes in handy if you, for example, use theming classes to visualize different backgrounds, colors etc.

## Install

```
npm i @hadl/patternlab-plugin-pattern-wrap -D
```

## Configuration

After the installation, you will see the config in your `patternlab-config.json`:

```
"plugins": {
  "@hadl/patternlab-plugin-pattern-wrap": {
    "enabled": true,
    "initialized": false,
    "options": {
      "wrapClassKey": [""]
    }
  }
}
```

If you don't see this config object, add the plugin via the command:

``` 
npx patternlab install --plugins @hadl/patternlab-plugin-pattern-wrap 
```

In the `wrapClassKey` array you can add the data keys which should be used to get the class names.

## How does it work?

The plugin will look for any "data key" added to the `wrapClassKey` array and then will add that
entry to the wrapper element.

Data key can be set inside the Markdown or JSON file of any pattern.

**Example Config**

```
"wrapClassKey": ["theme-class"]
```

### Markdown

Usage https://patternlab.io/docs/documenting-patterns/

_my-pattern.md_

``` 
---
theme-class: my-theme-class
---
```

Will create `<div class="pl-pattern-wrapper-element my-theme-class"></div>` around the rendered
pattern.

### JSON

Usage https://patternlab.io/docs/creating-pattern-specific-values/

_my-pattern.json_

``` 
{
  "theme-class": "my-other-theme-class"
}
```

Will create `<div class="pl-pattern-wrapper-element my-other-theme-class"></div>` around the
rendered pattern.

#### Pseudo-Patterns

This will work with pseudo-patterns too (Usage https://patternlab.io/docs/using-pseudo-patterns/)

_my-pattern~variant.json_

``` 
{
  "theme-class": "my-variant-theme-class"
}
```

Will create `<div class="pl-pattern-wrapper-element my-variant-theme-class"></div>` around the
rendered pattern.

### Multiple entries in "wrapClassKey"

Will result in multiple classes in the wrapper div.

**Example Config**

```
"wrapClassKey": ["theme-class", "other-class"]
```

_my-pattern.json_

``` 
{
  "theme-class": "theme-class",
  "other-class": "some-other-class"
}
```

_Result_

```
<div class="pl-pattern-wrapper-element theme-class some-other-class"></div>
```
npm package: @hadmean/bacteria
Description: Bacteria is a database introspection library
Author: Ayobami Akingbade
Latest version: 0.0.9

# Bacteria

Bacteria is a database introspection library

Supports
 - MySQL/MariaDB
 - Postgres
 - MsSQL
 - Sqlite

## Commands
### Development

To run, use:

```bash
npm start 
```

### Build

To do a one-off build, use:

```bash
npm run build 
```

This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` cause a rebuild to `/dist`.


### Tests

Tests are set up to run with 

```bash
npm test 
```
npm package: @hadmean/chromista
Description: This is the design system used for Hadmean
Author: Ayobami Akingbade
Latest version: 1.0.104

# Hadmean Chromista

This is the design system used for Hadmean

## Commands
### Development

To run, use:

```bash
npm run storybook
```


### Build

To do a one-off build, use:

```bash
npm run build # or yarn build.
```

This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.


### Tests

Tests are set up to run with 

```bash
npm test # or yarn test
```
npm package: @hadmean/protozoa
Description: This house all the generic, business void code that are used in multiple projects.
Author: Ayobami Akingbade
Latest version: 1.0.26

# Hadmean Protozoa

This house all the generic, business void code that are used in multiple projects.

Items found here are
 - Validation logic
 - Authentication storage
 - Configuration reader
 - App storage implementation
 - Toast implementation
 - App Language for button, mutation, labels
 - State management creator
 - Data fetching 
 - Form utils
 - Number Utils
 - General types
 - Filters for date, string and numbers

## Commands
### Development

To run, use:

```bash
npm start 
```


### Build

To do a one-off build, use:

```bash
npm run build 
```

This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` cause a rebuild to `/dist`.


### Tests

Tests are set up to run with 

```bash
npm test 
```
npm package: @hadnet/react-native-hold-menu-no-expo
Description: A performant, easy to use hold to open context menu for React Native CLI projects powered by Reanimated.
Author: hadnet
Latest version: 0.3.0

# react-native-hold-menu-no-expo

[![Reanimated v2 version](https://img.shields.io/github/package-json/v/hadnet/react-native-hold-menu-no-expo/master?label=Version&style=flat-square)](https://www.npmjs.com/package/@hadnet/react-native-hold-menu-no-expo)
[![Licensen](https://img.shields.io/github/package-json/license/hadnet/react-native-hold-menu-no-expo/master?label=License&style=flat-square)](https://www.npmjs.com/package/@hadnet/react-native-hold-menu-no-expo)
[![npm](https://img.shields.io/badge/Types-included-blue?style=flat-square)](https://www.npmjs.com/package/@hadnet/react-native-hold-menu-no-expo)


A performant, easy to use hold to open context menu for React Native CLI projects powered by Reanimated.

## Dependencies

```
  @react-native-community/blur react-native-gesture-handler react-native-haptic-feedback react-native-reanimated
```

> With Reanimated 3 there is an issue [#4613](https://github.com/software-mansion/react-native-reanimated/issues/4613#issuecomment-1663211375) and a fix.

## Installation

```sh
yarn add @hadnet/react-native-hold-menu-no-expo
```

## Usage

```js
import { HoldItem, HoldMenuProvider } from "react-native-hold-menu-no-expo";
```

![hold-menu-preview](./preview.gif)

## Features

- Powered with Reanimated v2. 🚀
- Smooth interactions & animations.
- Supports dark/light Mode. 🌚 🌝
- Supports device orientation change.
- Written in `TypeScript`.


## Getting Started

Check out [the documentation website](https://enesozturk.github.io/react-native-hold-menu).

 #### Based on react-native-hold-menu from

- [Mo Gorhom](https://gorhom.dev/)
- [Enes Öztürk](https://github.com/enesozturk)

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---
npm package: @hadnet/react-native-ios-toggle
Description: A modern iOS toggle component for RN made it with Reanimated (better perf), haptics feedback and fully customizable.
Author: hadnet
Latest version: 0.2.0

# react-native-ios-toggle

A modern iOS toggle component for RN made it with Reanimated (better perf), haptics feedback and fully customizable.

## Installation

`react-native-reanimated` 3, `react-native-gesture-handler` and `react-native-haptic-feedback` are dependencies, 
so you need to have them installed first in order to use this package.

```sh
npm install @hadnet/react-native-ios-toggle
```

```sh
yarn add @hadnet/react-native-ios-toggle
```

## Usage

```tsx
import Toggle from 'react-native-ios-toggle';

export default function App() {
  const [enabled, setEnabled] = React.useState(false);

  return (
    <GestureHandlerRootView style={styles.container}>
      <Toggle onValueChange={setEnabled} value={enabled} />
    </GestureHandlerRootView>
  );
}
```

Using a custom style

```tsx
  <Toggle
    thumbColor="black"
    backgroundColor="rgba(255, 255, 255, 0.8)"
    // or
    // backgroundColor={false: 'white', true: 'red'}
    onValueChange={setEnabled}
    value={enabled}
  />
```

Or just using standard light/dark mode

```tsx
import Toggle from 'react-native-ios-toggle';
import {useColorScheme} from 'react-native';

export default function App() {
  const theme = useColorScheme();
  const [enabled, setEnabled] = React.useState(false);

  return (
    <GestureHandlerRootView style={styles.container}>
      <Toggle dark={theme === 'dark'} onValueChange={setEnabled} value={enabled} />
    </GestureHandlerRootView>
  );
}
```




## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---
npm package: @hadnet/react-native-segmented-control
Description: A fully customizable iOS like segmented control component for RN CLI projects powered by Reanimated 2/3
Author: hadnet
Latest version: 1.0.0

# @hadnet/react-native-segmented-control

A fully customizable iOS like segmented control component for RN CLI projects powered by Reanimated 2/3

![segmented-control-preview](./preview.gif)

## Installation

```sh
yarn add @hadnet/react-native-segmented-control
```

## Usage

```tsx
import SegmentedControl, {Segment} from "@hadnet/react-native-segmented-control";

export default function App() {
  return (
    <View style={styles.container}>
      <SegmentedControl
        haptics
        containerMargin={16}
        segmentedControlWrapper={{
          backgroundColor: '#1e1e1e',
          width: 300,
          borderRadius: 12,
        }}
        tileStyle={{
          margin: 4,
          backgroundColor: 'black',
          // paddingVertical: 18
          // borderRadius: 12,
        }}
        segments={[
          <Segment
            title="GPT-3.5"
            inactiveTitleStyle={{color: '#9a999f'}}
            activeTitleStyle={{color: 'white'}}
            activeIconColor={'limegreen'}
            icon={
              // Accepts react-native-vector-icons
              <MaterialCommunityIcons name="lightning-bolt" size={22} />
            }
          />,
          <Segment
            title="GPT-4"
            inactiveTitleStyle={{color: '#9a999f'}}
            activeTitleStyle={{color: 'white'}}
            activeIconColor={'#9978f2'}
            icon={<MaterialIcons name="auto-awesome" size={18} />}
          />,
        ]}
        // badgeValues={[null, 2]}
        onChange={index => setTabIndex(index)}
        currentIndex={tabIndex}
      />
    </View>
  )
}
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---