open-index/open-npm huggingface dataset:
npm package: @iim-backrow/b3-libraryui
Description: ## Aperçu
Author: IIM-Backrow
Latest version: 1.0.3

# Projet Library UI

## Aperçu

Ce projet est une bibliothèque de composants UI développée par Michel, Thomas, Quentin et Pierric comme exercice de formation en Intégration Continue et publication de packages npm. L'objectif principal était de mettre en œuvre des workflows GitHub Actions efficaces pour l'automatisation des tests, de la construction et de la publication.

## Équipe

Notre équipe est composée de :
- Michel MoccandJacquet - [GitHub](https://github.com/Kan-A-Pesh)
- Thomas Candille - [GitHub](https://github.com/ThomasCandille)
- Quentin Garnier - [GitHub](https://github.com/F1N3X)
- Pierric Letard - [GitHub](https://github.com/Mrpierrouge)

## Objectif

Les objectifs principaux de ce projet étaient :
1. Mettre en place des pipelines CI/CD en utilisant GitHub Actions
2. S'entraîner à la publication de packages sur npm

## Workflows

### Workflow CI (`ci.yml`)
Ce workflow s'exécute à chaque push et pull request pour assurer la qualité du code :
- **Linting** : Vérifie le formatage et le style du code
- **Tests** : Exécute des tests unitaires pour vérifier le fonctionnement des composants
- **Construction** : S'assure que le projet se compile correctement

### Workflow de Publication (`release.yml`)
Ce workflow gère le processus de versionnement et de publication :
- Déclenché manuellement ou sur des tags spécifiques
- Crée un versionnement sémantique basé sur les messages de commit
- Construit le package pour la distribution
- Publie le package sur npm

### Workflow Chromatic (`chromatic.yml`)
Ce workflow gère les tests visuels :
- Déploie les composants sur Chromatic pour révision visuelle
- Capture des instantanés des composants UI
- Détecte les changements visuels entre les versions
- Fournit une plateforme pour la révision visuelle et l'approbation
npm package: @iimm/ckeditor5-first-line-indent
Description: Add firstLineIndent feature ,a plugin for CKEditor 5. 
Latest version: 1.1.0

# @iimm/ckeditor5-first-line-indent
=================================

[![NPM version](https://img.shields.io/npm/v/@iimm/ckeditor5-first-line-indent.svg?style=flat)](https://npmjs.org/package/@iimm/ckeditor5-first-line-indent)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/ckeditor5-first-line-indent.svg?style=flat)](https://npmjs.org/package/@iimm/ckeditor5-first-line-indent)


This package was created by the [ckeditor5-package-generator](https://www.npmjs.com/package/ckeditor5-package-generator) package.

This is a ckeditor5 plugin that adds the first line indent feature.

这是一个Ckeditor5插件，添加了首行缩进功能。


## Install

```bash
npm install @iimm/ckeditor5-first-line-indent
```

## Usage

```js
import { DecoupledEditor } from "ckeditor5";
import { CKEditor } from "@ckeditor/ckeditor5-react";
import { FirstLineIndent } from '@iimm/ckeditor5-first-line-indent';
import translations from "ckeditor5/translations/zh-cn.js";
import firstLineIndentTranslations from "@iimm/ckeditor5-first-line-indent/translations/zh-cn.js";
import "ckeditor5/ckeditor5.css";


const Exmaple = () => {
  return (
    <>
      {/* other elements */}
      <CKEditor 
        editor = {DecoupledEditor}
        config = {{
          toolbar: {items:["firstLineIndent"]},
          plugins: [FirstLineIndent],
          language: "zh-cn",
          translations: [translations, firstLineIndentTranslations],
          firstLineIndent: {
          /**
           * @default 2em
           */
            value: "2em",
            /**
           * elements to exclude
           * @default [ 'image', 'media', 'table' ]
           */
            exclude: [ 'image', 'media', 'table' ]
          },
        }}
      />
    </>
  );
}
```
npm package: @iimm/ckeditor5-paste-from-office
Description: A plugin for CKEditor 5.
Latest version: 1.1.0

# @iimm/ckeditor5-paste-from-office

[![NPM version](https://img.shields.io/npm/v/@iimm/ckeditor5-paste-from-office.svg?style=flat)](https://npmjs.org/package/@iimm/ckeditor5-paste-from-office)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/ckeditor5-paste-from-office.svg?style=flat)](https://npmjs.org/package/@iimm/ckeditor5-paste-from-office)


## Install

```bash
npm install @iimm/ckeditor5-paste-from-office
```
npm package: @iimm/data-view-react
Description: React Large screen data display component library
Latest version: 1.0.0

# @iimm/data-view-react

[![NPM version](https://img.shields.io/npm/v/@iimm/data-view-react.svg?style=flat)](https://npmjs.com/package/@iimm/data-view-react)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/data-view-react.svg?style=flat)](https://npmjs.com/package/@iimm/data-view-react)

## 说明
** fork from [@jiaminghi/data-view-react](https://github.com/DataV-Team/DataV-React) 的1.2.5版本，
仅添加了类型，修改成了TypeScript版本,修改了下文件结构,基本未修改组件内容（调整了下格式）**

### npm 安装

```shell
$ npm install @iimm/data-view-react
```


## DataV-React 是干什么的?

- DataV-React 是一个基于**React**的数据可视化组件库(当然也有[Vue 版本](https://github.com/DataV-Team/DataV))
- 提供用于提升页面视觉效果的**SVG**边框和装饰
- 提供常用的**图表**如折线图等
- 飞线图/轮播表等其他组件

### 注意事项

**使用了 React Hooks, 简化了许多内部工作。您需要 React 版本 16.8.0 及以上**


### 使用
详细文档及示例请移步[HomePage](http://datav-react.jiaminghi.com).

### Demo

Demo 页面使用了全屏组件，请 F11 全屏后查看。

- [施工养护综合数据](http://datav-react.jiaminghi.com/demo/construction-data/index.html)

![construction-data](./demoImg/construction-data.jpg)

- [机电运维管理台](http://datav-react.jiaminghi.com/demo/manage-desk/index.html)

![manage-desk](./demoImg/manage-desk.jpg)

- [机电设备电子档案](http://datav-react.jiaminghi.com/demo/electronic-file/index.html)

![electronic-file](./demoImg/electronic-file.jpg)
npm package: @iimm/formily-joy
Description: formily components of @mui/joy UI
Latest version: 0.1.1

# @iimm/formily-joy

[![NPM version](https://img.shields.io/npm/v/@iimm/formily-joy.svg?style=flat)](https://npmjs.org/package/@iimm/formily-joy)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/formily-joy.svg?style=flat)](https://npmjs.org/package/@iimm/formily-joy)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimm/icons
Description: some react svg icons
Latest version: 1.1.0

# @iimm/icons

[![NPM version](https://img.shields.io/npm/v/@iimm/icons.svg?style=flat)](https://npmjs.org/package/@iimm/icons)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/icons.svg?style=flat)](https://npmjs.org/package/@iimm/icons)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimm/nestjs-microservice-shared
Description: nestjs microservice shared utils 
Latest version: 1.1.1

# @iimm/nestjs-microservice-shared

[![NPM version](https://img.shields.io/npm/v/@iimm/nestjs-microservice-shared.svg?style=flat)](https://npmjs.org/package/@iimm/nestjs-microservice-shared)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/nestjs-microservice-shared.svg?style=flat)](https://npmjs.org/package/@iimm/nestjs-microservice-shared)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimm/nestjs-shared
Description: nestjs shared utils 
Latest version: 1.5.1

# @iimm/nestjs-shared

[![NPM version](https://img.shields.io/npm/v/@iimm/nestjs-shared.svg?style=flat)](https://npmjs.org/package/@iimm/nestjs-shared)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/nestjs-shared.svg?style=flat)](https://npmjs.org/package/@iimm/nestjs-shared)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimm/react-shared
Description: [![NPM version](https://img.shields.io/npm/v/@iimm/react-shared.svg?style=flat)](https://npmjs.org/package/@iimm/react-shared) [![NPM downloads](http://img.shields.io/npm/dm/@iimm/react-shared.svg?style=flat)](https://npmjs.org/package/@iimm/react-shared)
Latest version: 0.1.2

# @iimm/react-shared

[![NPM version](https://img.shields.io/npm/v/@iimm/react-shared.svg?style=flat)](https://npmjs.org/package/@iimm/react-shared)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/react-shared.svg?style=flat)](https://npmjs.org/package/@iimm/react-shared)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimm/richtext-utils
Description: 使用ckeditor5富文本及其与word转化时使用的一些简单工具
Latest version: 2.6.0

# @iimm/richtext-utils

[![NPM version](https://img.shields.io/npm/v/@iimm/richtext-utils.svg?style=flat)](https://npmjs.org/package/@iimm/richtext-utils)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/richtext-utils.svg?style=flat)](https://npmjs.org/package/@iimm/richtext-utils)

一些处理ckeditor5粘贴word内容后尽量保留原格式转回docx格式的word文档的处理过程(使用了xml-js处理xml文件内容)的一些方法和配置

## Install

```bash
$ pnpm add @iimm/richtext-utils
```

## breakChange
v2和v1有巨大变化，函数名都变了，而且内容部分移动到@iimm/shared里了


## LICENSE

MIT
npm package: @iimm/shared
Description: shared utils on browser and react env
Latest version: 2.5.0

# @iimm/shared

[![NPM version](https://img.shields.io/npm/v/@iimm/shared.svg?style=flat)](https://npmjs.org/package/@iimm/shared)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/shared.svg?style=flat)](https://npmjs.org/package/@iimm/shared)

## Install

```bash
npm install
```

## 导出内容

### nanoid 
```typescript
const nanoid: (size?: number = 21) => string
const customNanoidAlphabet: (alpha: string, defaultSize?: number = 21) => ((size?: number = defaultSize) => string)
```

#### file

```typescript
// ===== convert =====
const fileToBase64 = (file: File) => Promise<string>;
const fileToArrayBuffer = (file: File) => Promise<ArrayBuffer>;
const fileToBinaryString = (file: File) => Promise<string>;
const fileToText = (file: File, encoding = 'utf-8') => Promise<string>;

// ==== info =====
const getMimeTypeFromBase64 = (base64Str: string) => mimeType:string;

// ==== download ====
const generateFileDownload = (file: InputFile, fileName = '', extension = '', onDownloadSuccess?: (file: InputFile, fileName: string) => void, onDownloadFail?: (file: InputFile, fileName: string) => void) => void;
```

#### image

```typescript
const isImageMimeType = (type: string) => type.indexOf('image/') === 0;
```

#### url

```typescript
const getFileNameFromUrl = (url = '') => string;
const getFileExtensionFromUrl = (url = '') => string;
```

### isX

```typescript
const isEqual = (a?: any, b?: any) => [ 'number', 'string' ].includes(typeof (a ?? 0))
  ? a === b
  : JSON.stringify(a) === JSON.stringify(b);

const isInArray = (value: any, array: any[]) => {
  if (!array || !Array.isArray(array)) return false;
  return [ 'number', 'string' ].includes(typeof (value ?? 0))
    ? array.includes(value)
    : array.some(item => isEqual(value, item));
};

const isObject = (value: any) => value !== null && typeof value === 'object';
const isFunction = (value: any) => typeof value === 'function';
const isString = (value: any) => typeof value === 'string';
const isNumber = (value: any) => typeof value === 'number';
const isUndefined = (value: any) => typeof value === 'undefined';


const isBrowser = !!(typeof window !== 'undefined' && window.document && window.document.createElement);

/** 字符串是否是Base64，可以有data前缀，也可以无 */
const isBase64 = (str: string) => {
  if (!str) return false;
  const re = /^(data:([a-z0-9/+.-])+;base64,)?([A-Za-z0-9+/]{4})*([A-Za-z0-9+/]{4}|[A-Za-z0-9+/]{3}=|[A-Za-z0-9+/]{2}==)$/;
  return re.test(str);
};
```

TODO

## LICENSE

MIT
npm package: @iimm/x-data-grid
Description: @mui/x-data-grid
Latest version: 1.4.0

# @iimm/x-data-grid

[![NPM version](https://img.shields.io/npm/v/@iimm/x-data-grid.svg?style=flat)](https://npmjs.com/package/@iimm/x-data-grid)
[![NPM downloads](http://img.shields.io/npm/dm/@iimm/x-data-grid.svg?style=flat)](https://npmjs.com/package/@iimm/x-data-grid)

## Install

```bash
$ pnpm install
```

```bash
$ npm run dev
$ npm run build
```

## Options

TODO

## LICENSE

MIT
npm package: @iimmaannuueell/tiny
Description: Removes all spaces from a string
Latest version: 2.0.0

# iimmaannuueell/tiny

Removes all spaces from a string.

## Installation

```bash
$ npm install @iimmaannuueell/tiny
```

## Usage

```python
const tiny = require("@iimmaannuueell/tiny");

tiny("So much space!");
//=> "Somuchspace!"

tiny(1337);
//=> Uncaught TypeError: Tiny wants a string!
//    at tiny (<anonymous>:2:41)
//    at <anonymous>:1:1
```

## Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

## License
[MIT](https://choosealicense.com/licenses/mit/)
npm package: @iin-mdc/react-daterange-picker
Description: A react date range picker using Material Design
Author: Manpreet Singh Matharu
Latest version: 1.0.6

# react-daterange-picker 
A react date range picker using material-ui components.

<a href='https://www.npmjs.com/package/@matharumanpreet00/react-daterange-picker'>
    <img src='https://img.shields.io/npm/v/@matharumanpreet00/react-daterange-picker.svg' alt='Latest npm version'>
</a>

## Live Demo: https://flippingbitss.github.io/react-daterange-picker/




## Usage

```bash
npm install @matharumanpreet00/react-daterange-picker --save
# or with yarn
yarn add @matharumanpreet00/react-daterange-picker
```

![Screenshot](/screenshot_1.png?raw=true "Screenshot")

## Basic Example
```tsx
import React from "react";
import { DateRangePicker, DateRange } from "@matharumanpreet00/react-daterange-picker";

type Props = {}
type State = {
    open: boolean,
    dateRange: DateRange
}

class App extends React.Component<Props, State> {
	state = {
		open: true,
		dateRange: {}
	};
	
	render() {
		return (
			<DateRangePicker
				open={this.state.open}
				onChange={range => this.setState({ dateRange: range })}
			/>
		);
	}
}

export default App;
```

## Basic example using hooks
```tsx
import React from "react";
import { DateRangePicker, DateRange } from "@matharumanpreet00/react-daterange-picker";

type Props = {}

const App: React.FunctionComponent<Props> = props => {
	const [open, setOpen] = React.useState(false);
	const [dateRange, setDateRange] = React.useState<DateRange>({});

	return (
		<DateRangePicker
			open={open}
			onChange={range => setDateRange(range)}
		/>
	);
}

export default App;
```

## Types 
```ts
interface DateRange {
    startDate?: Date,
    endDate?: Date
}

interface DefinedRange {
    label: string,
    startDate: Date,
    endDate: Date
}
```

## Props

Name | Type | Required | Default value | Description
:--- | :--- | :--- | :--- | :---
`initialDateRange` | `DateRange` | | `{}` | initially selected date range
`minDate` | `Date | string` | | 10 years ago | min date allowed in range
`maxDate` | `Date | string` | | 10 years from now | max date allowed in range
`onChange` | `(DateRange) => void` | _required_ | - | handler function for providing selected date range
`definedRanges` | `DefinedRange[]` | | - | custom defined ranges to show in the list