open-index/open-npm huggingface dataset:
npm package: @sharingapples/calendar
Description: React Native Calendar Widget
Latest version: 1.0.16

# Calendar

## Dependencies

- @sharingapples/theme : standard theme packages , used in component for color definition.
  - primary: the app/ brand color , border color for selected dates
  - onPrimary: the font color with background primary color
  - disableSurface: disable color
  - background: default background color of app
  - onBackground: default font color of app

## Props
- value: a single date or an array of Dates
- setValue: a setter function for above mentioned value

## Usage

1) Include @sharingapples/theme  package in the project
2) Define custom theme
3) Provide the component with the props

## Example

- Light Theme (default)

  - Output (single select)

  ![Alt text](docs/light.png?raw=true "Single Select Light theme")

  - Output (multiple select)

  ![Alt text](docs/lightMultiple.png?raw=true "Multiple Select Light theme")

- Dark Theme (custom)

  - Define the custom theme in app entry level
    ```jsx

      import { setTheme } from '@sharingapples/theme';

      const darkTheme = {
        brand: '#b00020',
        primary: '#dfe38e',
        primaryVariant: '#efca8c',
        onPrimary: '#ffffff',

        secondary: '#03dac6',
        secondaryVariant: '#018786',
        onSecondary: '#000000',

        background: '#000000', /* default background to black */
        onBackground: '#ffffff', /* default fontColor to white */

        surface: '#000000', /* default background to black */
        onSurface: '#ffffff', /* default fontColor to white */

        error: '#b00020',
        onError: '#ffffff',
        disableSurface: '#808080',
      };

      setTheme(darkTheme);

      require('./App');

    ```

  - Output

    ![Alt text](docs/dark.png?raw=true "Single Select Dark theme")

  - Output (multiple select)

    ![Alt text](docs/darkMultiple.png?raw=true "Multiple Select Dark theme")
npm package: @sharingapples/eslint-config
Description: Linter setup
Author: Ranjan Shrestha
Latest version: 1.0.4

Eslint configuration for our organization based on
airbnb, flowtype:recommended and react-hooks

## Installation
`> yarn add --dev @sharingapples/eslint-config`

## Usage
Create `.eslintrc` on your project root with the
following content
```json
{
  "extends": "@sharingapples"
}
```
npm package: @sharingapples/redux
Description: Redux based offline database with index support
Author: Ranjan Shrestha
Latest version: 1.0.16

# redux-db
Redux without boilerplate

## Using hydration
```javascript
import { createHydrator, schema, record } from '@sharingapples/redux';
const books = schema('books', 1);
const user = record('user');

const structure = { user, books };
const hydrator = createHydrator(structure, (state) => {
  localStorage.setItem('skey', JSON.stringify(state));
});

const reducer = hydrator.enhanceReducer(structureReducer);
const store = createStore(reducer);

const data = localStorage.getItem('skey');
if (data) {
  hydrator.hydrate(store, JSON.parse(data));
}
```

## Using memoization with selectors
```javascript
import React, { useState } from 'react';
import { useSelector } from '../store';

function getTodos(selector, [completed]) {
  const allIds = selector.todos.allIds();
  return completed === null || allIds === null ? allIds : selector.memoize(() => {
    return allIds.filter(selector => selector.todos.get(id).completed === completed);
  }, [allIds, completed]);
}

function Todo({ id }) {
  const todo = useSelector(db => db.todos.get(id), [id]);
  return todo.title;
}

export default function Todos() {
  const [completed, setCompleted] = useState(null);
  const todos = useSelector(getTodos, [completed]);

  return (
    <div>
      {todos.map(id => <Todo key={id} id={id} />)}
      <input type="checkbox" checked={completed} onClick={(e) => setCompleted(e.target.value)} />
    </div>
  );
}

```

```javascript
import { schema, record } from '@sharingapples/redux';

const totalPrice = book => aggr.sum(book.price);
const totalAmount = copoun => aggr.sum(coupon.amount);

const bookings = schema('books', 1, {
  byAuthor: {
    version: 1,
    index: 'author',
    aggr: { totalPrice }
  },
  byDate: {
    version: 1,
    index: book => book.date.toDateString(),
    aggr: { totalPrice },
  }
});

const coupons = schema(1, {
  daily: {
    version: 1,
    index: coupon => Math.floor(coupon.created / 1000),
    order: 'DESC',
    aggr: { totalAmount: coupon => aggr.sum(coupon.amount) },
  },
  monthly: {
    version: 1,
    index: coupon => {
      const dt = new Date(coupon.created);
      return `${dt.getYear()}-${dt.getMonth()}`
    },
    aggr: { totalAmount: coupon => aggr.sum(coupon.amount) },
  },
});

const struture = {
  user: record(),
  bookings,
  coupons,
};

const store = createStore(combineReducers(createReducer(structure)));
const reduxDB = createActor(structure, store.dispatch);
const useSelector = createSelector(structure, store);

// Use the actor
reduxDB.books.insert({ id: 1, title: 'Dr. Frankestein' });

// Actions available with `record`
// reduxDB.user.update({});
// reduxDB.user.replace({});
// reduxDB.user.clear();

// Use the selector
function AwesomeComponent() {
  const books = useSelector(db => db.books.allIds());

  return (
    <div>
      {books.map(id => <Book key={id} id={id} />)}
    </div>
  );
}
```
npm package: @sharingapples/safe-padding
Description: Safe padding for notch based devices
Author: Ranjan Shrestha
Latest version: 1.0.12


# react-native-safe-padding

## Getting started

`$ npm install react-native-safe-padding --save`

### Mostly automatic installation

`$ react-native link react-native-safe-padding`

### Manual installation


#### iOS

1. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`
2. Go to `node_modules` ➜ `react-native-safe-padding` and add `RNSafePadding.xcodeproj`
3. In XCode, in the project navigator, select your project. Add `libRNSafePadding.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`
4. Run your project (`Cmd+R`)<

#### Android

1. Open up `android/app/src/main/java/[...]/MainActivity.java`
  - Add `import com.reactlibrary.RNSafePaddingPackage;` to the imports at the top of the file
  - Add `new RNSafePaddingPackage()` to the list returned by the `getPackages()` method
2. Append the following lines to `android/settings.gradle`:
  	```
  	include ':react-native-safe-padding'
  	project(':react-native-safe-padding').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-safe-padding/android')
  	```
3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:
  	```
      compile project(':react-native-safe-padding')
  	```

#### Windows
[Read it! :D](https://github.com/ReactWindows/react-native)

1. In Visual Studio add the `RNSafePadding.sln` in `node_modules/react-native-safe-padding/windows/RNSafePadding.sln` folder to their solution, reference from their app.
2. Open up your `MainPage.cs` app
  - Add `using Safe.Padding.RNSafePadding;` to the usings at the top of the file
  - Add `new RNSafePaddingPackage()` to the `List<IReactPackage>` returned by the `Packages` method


## Usage
```javascript
import RNSafePadding from 'react-native-safe-padding';

// TODO: What to do with the module?
RNSafePadding;
```
npm package: @sharingbox/eslint-config
Description: JavaScript Eslint configuration
Author: nicolasmondain
Latest version: 2.0.32

# @sharingbox/eslint-config

Core coding standards for sharingbox FRANCE.

[![npm version](https://img.shields.io/npm/v/@sharingbox/eslint-config)](https://www.npmjs.com/package/@sharingbox/eslint-config)

## Installation

You'll need to install [`ESLint`](https://www.npmjs.com/package/eslint) into your project. Run this command to install the config:

```sh
npm install @sharingbox/eslint-config --save-dev
```

## Usage

Create a `.eslintrc` file with the following contents:

```js
{
  "extends": [
    "@sharingbox/eslint-config"
  ]
}
```
npm package: @sharingbox/zip-compression-webpack-plugin
Description: Create zip folders into your webpack bundle
Author: nicolasmondain
Latest version: 1.0.1

# zip-compression-webpack-plugin
Create zip folders into your webpack bundle.
Uses [`archiver`](https://www.npmjs.com/package/archiver) behind the scene (a streaming interface for archive generation).

[![npm version](https://img.shields.io/npm/v/@sharingbox/zip-compression-webpack-plugin)](https://www.npmjs.com/package/@sharingbox/zip-compression-webpack-plugin)

## Installation

```
npm install @sharingbox/zip-compression-webpack-plugin --save-dev
```
## Usage

List of actions to perform (Array of objects).
Each object must have 4 properties:

* `from`: string
* `name`: string
* `to`: string
* `deleteOriginalAssets`: boolean

### `from` (string)
Path of the folder you want to zip (relative path from the root of your project).
### `name` (string)
Name of the generated zip that will be added to your Webpack bundle (needs the `.zip` extension).
### `to` (string)
Path of the folder you want your generated zip to be moved to (relative path from the root of your project).

### `deleteOriginalAssets` (boolean)
Remove the original assets you have added to your generated zip.


```js
const ZipFolderWebpackPlugin = require('@sharingbox/zip-compression-webpack-plugin');

const configuration = {

    plugins: [

        new ZipFolderWebpackPlugin([

			{

				from                : './node_modules/@sharingbox/documents-A',
				name                : 'documents-A.zip',
				to                  : './dist/zip',
				deleteOriginalAssets: false

			},

			{

				from                : './src/assets/documents-B',
				name                : 'documents-B.zip',
				to                  : './dist/zip',
				deleteOriginalAssets: true

			}

		])

    ]

};
```
npm package: @shariqriaz/context7-enhanced
Description: Private MCP server implementation
Author: abdush
Latest version: 1.0.0

# Context7 Enhanced - Private MCP Server Implementation

[![GitHub](https://img.shields.io/badge/GitHub-shariqriazz/context7--enhanced-blue)](https://github.com/shariqriazz/context7-enhanced) [![npm](https://img.shields.io/npm/v/@shariqriaz/context7-enhanced)](https://www.npmjs.com/package/@shariqriaz/context7-enhanced)

## Features
- Private MCP server implementation
- Up-to-date documentation fetching
- Customized for private use

## Installation

### Requirements
- Node.js >= v18.0.0
- npm or yarn
- MCP-compatible client

### Install Package
```bash
npm install -g @shariqriaz/context7-enhanced
```

### Run Server
```bash
context7-enhanced
```

## Configuration

For most clients, use this configuration:
```json
{
  "mcpServers": {
    "context7-enhanced": {
      "command": "npx",
      "args": ["-y", "@shariqriaz/context7-enhanced"]
    }
  }
}
```

## Development

```bash
git clone https://github.com/shariqriazz/context7-enhanced
cd context7-enhanced
npm install
npm run build
```

## License
MIT
npm package: @sharjeel143/ma-ui
Description: Custom Angular Material UI Library with branded components and theme support
Author: Sharjeel
Latest version: 1.0.9

# MaUi

This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.0.0.

## Code scaffolding

Angular CLI includes powerful code scaffolding tools. To generate a new component, run:

```bash
ng generate component component-name
```

For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:

```bash
ng generate --help
```

## Building

To build the library, run:

```bash
ng build ma-ui
```

This command will compile your project, and the build artifacts will be placed in the `dist/` directory.

### Publishing the Library

Once the project is built, you can publish your library by following these steps:

1. Navigate to the `dist` directory:
   ```bash
   cd dist/ma-ui
   ```

2. Run the `npm publish` command to publish your library to the npm registry:
   ```bash
   npm publish
   ```

## Running unit tests

To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:

```bash
ng test
```

## Running end-to-end tests

For end-to-end (e2e) testing, run:

```bash
ng e2e
```

Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.

## Additional Resources

For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
npm package: @sharjeelalphabravomike/ma-ui
Description: Custom Angular Material UI Library with branded components and theme support
Author: Sharjeel
Latest version: 1.0.2

# MaUi

This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.0.0.

## Code scaffolding

Angular CLI includes powerful code scaffolding tools. To generate a new component, run:

```bash
ng generate component component-name
```

For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:

```bash
ng generate --help
```

## Building

To build the library, run:

```bash
ng build ma-ui
```

This command will compile your project, and the build artifacts will be placed in the `dist/` directory.

### Publishing the Library

Once the project is built, you can publish your library by following these steps:

1. Navigate to the `dist` directory:
   ```bash
   cd dist/ma-ui
   ```

2. Run the `npm publish` command to publish your library to the npm registry:
   ```bash
   npm publish
   ```

## Running unit tests

To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:

```bash
ng test
```

## Running end-to-end tests

For end-to-end (e2e) testing, run:

```bash
ng e2e
```

Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.

## Additional Resources

For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.