# vue-minefield

> The great mine field component for Vue.js applications.

Latest version **0.3.75** (published 2021-03-11) · 0 weekly downloads

## Install

```sh
npm install vue-minefield
pnpm add vue-minefield
yarn add vue-minefield
bun add vue-minefield
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.3.75 |
| Published | 2021-03-11 |
| First published | 2021-03-10 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 7.9 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | HeskemoParadox |
| Maintainers | jrhess |

## Links

- npm: https://www.npmjs.com/package/vue-minefield
- Repository: https://bitbucket.org/hesk/vue-mf-form
- Homepage: https://bitbucket.org/hesk/vue-mf-form/src/master/
- npm.io page: https://npm.io/package/vue-minefield

## Dependencies (2)

- [core-js](https://npm.io/package/core-js.md) ^2.6.11
- [compass-mixins](https://npm.io/package/compass-mixins.md) ^0.12.10

## Recent versions

- 0.3.75 (latest) — 2021-03-11
- 0.3.74 — 2021-03-11
- 0.3.73 — 2021-03-10
- 0.3.72 — 2021-03-10

## README

# vue-minefield
The great mine field component for Vue.js applications.

![vue-minefield](https://user-images.githubusercontent.com/629338/110722716-ba9ee400-824d-11eb-93ba-3ea3933d099b.png)

Demo on [GitHub Pages](https://seokky.github.io/vue-minefield/)

## Features
- custom configurations
- locked, unlock, load data, clear reset, disabled, undisabled
- full scss style framework

## Attention!

Styles that component have are written just for demo. But that styles are override-friendly, so you can write any styles you want.

## Usage

```
  npm i --save vue-minefield
```
or with yarn
```
  yarn add vue-minefield
```

Then in any component:

```
import MineField from 'vue-minefield';
// The name can be different depending on your desire
```

```
import {MineField} from "vue-minefield"


<div class="input-wrapper">
  <MineField
        ref="pickmatrix"
             :lvl1w="8"
             :lvl1h="5"
             :box-length="40 + 10"
             :max-picked="max_pick"
             @update_list="setlist"
  />
</div>
```

**Attention**: you should use .. in order to rule  ...

```
<style lang="scss">
@import "@node_modules/vue-minefield/src/presents/base";

.box_nfx {
  margin: 1px;
  border: 1px solid #222;
  @include btn3dbase;
  @include btn3dGreen;
  // any styles you want for each cell
  

  span {
    font-size: 14px;
    color: #ffffff;
    align-self: center;
    justify-self: center;
    width: 100%;
  }


  &.highlight {
    @include claw_machine_button_style_ex1(#73ff4a);
    @include activeButton;

    span {
      color: #c61616;
    }
  }

}

<style>
```

## Props

- **lvl1w** (number of columns)
  - type: Number
  - default: 0

- **lvl1h** (number of rows)
  - type: Number
  - default: 0

- **box-length** (the size of the box)
  - type: Number
  - default: 0

- **max-picked** (preview character on typing)
  - type: Boolean
  - default: true

- **update_list** (event during updating the list items)
  - type: Event

- **exceed_max_picked** (event that exceed the max picked counts)
  - type: Event
  
- **error_locked** (event error from locked)
  - type: Event

- **locked** (event locked)
  - type: Event
  
## ToDo

    Note: in Minesweeper mode, you need to click at least 7 times with 1 bomb, 5 times with 3 bombs, 3 times with 5
        bombs or once with 24 bombs in order to receive wager.
    
         The player can login the bigbang game platform and make deposit of the token BBGC, HT, ZB, OKB, ETH, GTS and the
            supported tokens. The player can obtain the tokens from the exchange platforms. HOTBIT.io, FCOIN.com, EXX.com,
            and ZBG.com.

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