# operation-utils

> A collection of operation utils

Latest version **0.0.3** (published 2019-07-10) · ISC license · 0 weekly downloads

## Install

```sh
npm install operation-utils
pnpm add operation-utils
yarn add operation-utils
bun add operation-utils
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2019-07-10 |
| First published | 2019-06-12 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 69.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | chenchao17@58.com |
| Maintainers | chenchao17 |
| Keywords | operation, utils |

## Links

- npm: https://www.npmjs.com/package/operation-utils
- Repository: https://github.com/liuding-Jason/operation-utils
- Homepage: https://github.com/liuding-Jason/operation-utils#readme
- Issues: https://github.com/liuding-Jason/operation-utils/issues
- npm.io page: https://npm.io/package/operation-utils

## Dependencies (6)

- [cross-env](https://npm.io/package/cross-env.md) ^5.2.0
- [babel-core](https://npm.io/package/babel-core.md) 6.26.0
- [babel-loader](https://npm.io/package/babel-loader.md) 7.1.2
- [webpack-merge](https://npm.io/package/webpack-merge.md) ^4.2.1
- [react-pure-check](https://npm.io/package/react-pure-check.md) ^0.1.3
- [function-com-utils](https://npm.io/package/function-com-utils.md) ^0.0.2

## Recent versions

- 0.0.3 (latest) — 2019-07-10
- 0.0.1 — 2019-06-12

## README

## operation-utils

***operation-utils*** module is a basic module for operation needs .

Because of usage of dom operation , this module could be used normally .

-----------

## Modules

### 1 TopMessage

####	Use Pattern :

```js
	TopMessage(<options>).pushMessage(messageString , <typeName>) 
```

	TopMessage would offer light message prompt from top ,
	which contains info 、success、error and warning topics .

	At the same time , you could define personal options to reset 
	the style of each component and running time .

	You could use like these : 

### How to use

```js
	import { TopMessage } from "operation-fun" ;
	let tm = TopMessage({ 
		closeTime : 1500 , 
		messageIcon : { style : {} } ,
		messageConstructor : { style : {} }
	}) ;
	tm.pushMessage("info" , "info") ;
	tm.pushMessage("success" , "success") ;
	tm.pushMessage("error" , "error") ;
	tm.pushMessage("warning" , "warning") ;
```

-----------

### 2 RightMessage

###	Use Pattern :

```js
	RightMessage(<options>).pushMessage(title , message , <link> , <target>) ;
```

	RightMessage could offer you some notice from right way .

### How to use 
	
```js
	import { RightMessage } from "operation-utils" ;
	let rm = RightMessage({
		autoClose : true ,
		closeTime : 3000 ,
		titleContainer : { style : {} } ,
		itemContainer : { style : {} }
	}) ;
	rm.pushMessage("Topic" , "Please notice your message from this way." , "//www.baidu.com" , "_blank") ;
```
-----------

### 3 ScrollIds

#### Use Pattern

```js
	ScrollIds(<option>).setScrollMessage(domIdSelector , list)
```
	
	ScrollIds module would offer a vertical scolling infos .
	Through setting option , you could reset style 、 running time and 
	icon render function .

	If you want to clear scroll container , you could use clearScroll 
	function to do it .
	
#### How To Use 

```js
	import { RightMessage } from "operation-utils" ;
	let sl = ScrollIds({
		scrollTime : 2000 ,
		renderIcon : function(){} ,
		height : "30px" ,
		width : "150px" ,
		mainContainer : { style }
	}) ;
	let list = [{text : "message one"} , {text : "message two"}] ;
	sl.setScrollMessage("my-scroll" , list) ;
	setTimeout(() => {
		sl.clearScroll("my-scroll") ;
	} , 30000) ;
```
-----------

### 4 Toast

#### Use Pattern
	
```js
	Toast(<option>).pushMessage(message) ;
```

	Toast module offer a light message notice . 
	Through option , you could set closeTime and wether to show backgroud .

	But remeber , you could only push one message in 4000 ms .

#### How To Use

```js
	import { Toast } from "operation-utils" ;
	let ts = Toast({
		closeTime : 3000 ,
		showBackground : true ,
		backgroundContainer : { style : {} } ,
		contentContainer : { style : {} }
	}) ;
	ts.pushMessage("网络错误") ;
```
-----------

### 5 BottomBanner

### Use Pattern

```js
	BottomBanner(<option>)setBottomBanner(<setting>) ;
```
	BottomBanner would offer you a bottom banner transfor .
	You could use options.defaultActive to control the default controller ,
	and this option could only be main or sub .

	But remeber , i assumed that you would only has one bttom banner 
	in one page .

### How To Use

```js
	import { BottomBanner } from "operation-utils" ;
	let bb = BottomBanner({
		mainLink : "" , // main img link 
		subLink : "" ,	// sub controller link
		defaultActive : "main"
	}) ;
	bb.setBottomBanner({
		jumpLink : "//www.baidu.com" ,
		jumpTarge : "_blank"
	}) ;
```
-----------

### 6 Banner (plan)

## LINCESE
	
	MIT

---
_Source: https://npm.io/package/operation-utils · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
