Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.
Awesome Lists | Featured Topics | Projects
https://github.com/persian-tools/vue-persian-tools

Persian tools wrapper for vue.js
https://github.com/persian-tools/vue-persian-tools
card-number fuzzy-matching iban number-to-words persian persian-language vue words-to-numbers
Last synced: 3 days ago
JSON representation
Persian tools wrapper for vue.js
Host: GitHub
URL: https://github.com/persian-tools/vue-persian-tools
Owner: persian-tools
License: mit
Created: 2021-03-05T18:16:41.000Z (over 3 years ago)
Default Branch: master
Last Pushed: 2023-12-15T14:33:36.000Z (11 months ago)
Last Synced: 2024-09-21T12:11:29.620Z (about 2 months ago)
Topics: card-number, fuzzy-matching, iban, number-to-words, persian, persian-language, vue, words-to-numbers
Language: TypeScript
Homepage: https://persian-tools.github.io/vue-persian-tools/
Size: 3.45 MB
Stars: 25
Watchers: 3
Forks: 2
Open Issues: 2
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: .github/contributing.md
- License: LICENSE
Awesome Lists containing this project

README

        


	

		

	

  Vue persian tools

  Persian tools wrapper for vue.js

	

![CI/CD](https://github.com/persian-tools/vue-persian-tools/actions/workflows/storybook.yml/badge.svg)

![CI/CD](https://github.com/persian-tools/vue-persian-tools/actions/workflows/continuous-integration.yml/badge.svg)

![codecov](https://codecov.io/gh/persian-tools/vue-persian-tools/branch/master/graph/badge.svg)

[![GitHub license](https://img.shields.io/github/license/persian-tools/vue-persian-tools)](https://github.com/persian-tools/vue-persian-tools/blob/master/LICENSE)

[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-orange.svg)](https://github.com/persian-tools/vue-persian-tools/compare) 

[![CodeFactor](https://www.codefactor.io/repository/github/persian-tools/vue-persian-tools/badge)](https://www.codefactor.io/repository/github/persian-tools/vue-persian-tools)



---

### [See demo](https://persian-tools.github.io/vue-persian-tools)

### [Persian tools repo](https://github.com/persian-tools/persian-tools)




---




### Installation

npm

```bash

npm i @persian-tools/vue-persian-tools

```

**⚠️ If you are using vue2 you need to install composition api alongside the main package**

```bash

npm i @vue/composition-api

```

### Usage

```js

// in vue 2

import Vue from "vue";

import tools from "@persian-tools/vue-persian-tools";

Vue.use(tools, {

    components: true,

    directives: true

});

// in vue 3

import tools from "@persian-tools/vue-persian-tools";

createApp(App).use(tools, options);

```

this way, you can install directives & components globally.

by default only components will install globally. by passing `directives: true` to plugin options you can also enable directives

```js

{

    components: false, // it wont install components

    directives: true, // install directives globally

}

```

You can also install components & directives globally by their names.

```js

{

    components: ['isPersian', 'addOrdinalSuffix', '...'],

    directives: ['halfSpace'],

}

```

Or import them locally

```js

// import components from module directory

import { halfSpace } from "@persian-tools/vue-persian-tools/dist/modules";

// import directives from directive directory

import { numberToWords, removeOrdinalSuffix } from "@persian-tools/vue-persian-tools/dist/directives";

export default {

    // install locally

    directives: { numberToWords, removeOrdinalSuffix },

    components: { halfSpace }

};

```




---




## components

### `tag prop`

every component accept a `tag` prop. you can use it to customize component html tag. default is `span`

```js

```




---

### `isPersian` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-ispersian--default)

**slots**:




`isPersian`: boolean

```html

{{ isPersian }}

```




---

### `URLfix` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-urlfix--default)

**slots**:




`url`: string

```html

fixed URL: {{ url }}

```




---

### `Sheba` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-sheba--default)

**slots**:




`isValid`: boolean




`info`: ShebaResult

```html

    is sheba valid: {{ isValid }}

    
info about sheba

    nickname: {{ info.nickname }}

    name: {{ info.name }}

    persianName: {{ info.persianName }}

    code: {{ info.code }}

    accountNumberAvailable: {{ info.accountNumberAvailable }}


```




---

### `addOrdinalSuffix` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-addordinalsuffix--default)

**slots**:




`text`: string

```html

{{ text }}

```




---

### `bill` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-bill--default)

**slots**:




`result`: billResult




`amount`: number




`type`: billType




`isBillValid`: boolean




`isBillIdValid`: boolean




`isBillPaymentValid`: boolean

```html

    
result of bill:{{ result }}

    amount:{{ amount }}

    bill type:{{ type }}

    is bill valid:{{ isBillValid }}

    is bill id valid:{{ isBillIdValid }}

    is bill payment id valid:{{ isBillPaymentValid }}


```




---

### `commas` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-commas--default)

**slots**:




`number`: number | string

```html



     {{ number }}

    {{ number }}



```




---

### `digits` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-digits--default)

**slots**:




`value`: string

```html

converted to: {{ value }}

```




---

### `extractCardNumber` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-extractcardnumber--default)

**slots**:




`cards`: ExtractCardNumber[]




`valid`: ExtractCardNumber[]

```html

    


        all extracted cards:

        

            index: {{ card.index }}

            pure: {{ card.pure }}

            base: {{ card.base }}

            isValid: {{ card.isValid }}

        

        

            index: {{ card.index }}

            pure: {{ card.pure }}

            base: {{ card.base }}

            isValid: {{ card.isValid }}

        

    


```




---

### `getBankNameFromCardNumber` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-getbanknamefromcardnumber--default)

**slots**:




`bankName`: string

```html

 {{ bankName }}

```




---

### `getPlaceByIranNationalId` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-getplacebyirannationalid--default)

**slots**:




`city`: string




`codes`: string[]




`province`: string

```html

    city:  {{ city }}  


    province:  {{ province}}  codes:  {{ codes }} 

```




---

### `halfSpace` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-halfspace--default)

**slots**:




`text`: string

```html

{{ text }}

```




---

### `hasPersian` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-haspersian--default)

**slots**:




`hasPersian`: boolean

```html

{{ hasPersian }}

```




---

### `isArabic` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-isarabic--default)

**slots**:




`isArabic`: boolean

```html

{{ isArabic }}

```




---

### `numberToWords` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-numbertowords--default)

**slots**:




`words`: string

```html

{{ words }}

```




---

### `phoneNumber` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-phonenumber--default)

**slots**:




`details`: OperatorModel | null




`isValid`: boolean

```html

    
details: {{ details }}

    is phone number valid: {{ isValid }}


```




---

### `removeOrdinalSuffix` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-removeordinalsuffix--default)

**slots**:




`text`: string

```html

{{ text }}

```




---

### `toPersianChars` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-topersianchars--default)

**slots**:




`text`: string

```html

{{ text }}

```




---

### `verifyCardNumber` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-verifycardnumber--default)

**slots**:




`isValid`: boolean

```html

{{ isValid }}

```




---

### `verifyIranianNationalId` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-verifyiraniannationalid--default)

**slots**:




`isValid`: boolean

```html

{{ isValid }}

```




---

### `wordsToNumber` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-wordstonumber--default)

**slots**:




`number`: number

```html

{{ number }}

```




---

### `plate` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-plate--default)

**slots**:




`number`: String | PlateOptions

```html

{{ info }} | {{ isValid }}

```




---

### `timeAgo` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/modules-timeago--default)

**slots**:




`date`: String

```html

{{ time }}

```




## directives

all directives have sync modifiers. using this modifier will enable reactive data in your directive.

### `halfSpace directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-halfspace--default)

```html

your text 

```




---

### `toPersian directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-topersian--default)

```html

... 

```




---

### `URLFix directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-topersian--default)

```html

... 

```




---

### `addOrdinalSuffix directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-addordinalsuffix--default)

```html

... 

```




---

### `removeOrdinalSuffix directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-removeordinalsuffix--default)

```html

... 

```




---

### `numberToWords directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-numbertowords--default)

```html

... 

```




---

### `wordsToNumber directive` [See details](https://persian-tools.github.io/vue-persian-tools/?path=/docs/directives-wordsToNumber--default)

**modifires**:




`addCommas`, `fuzzy`




**argument**:




`digits`: 'fa' | 'en' | 'ar'

```html

... 

```




---

## Contributing

check [Contributing.md](https://github.com/persian-tools/vue-persian-tools/blob/master/.github/contributing.md) for more information

## License

This project is licensed under the MIT License - see the [LICENSE.md](https://github.com/persian-tools/vue-persian-tools/blob/master/LICENSE) file for details.

## Changelogs

-   [changelog](https://github.com/persian-tools/vue-persian-tools/blob/master/CHANGELOG.md)