Skip to content

Commit

Permalink
Merge pull request #204 from IlyaSemenov/replace_binded_bound
Browse files Browse the repository at this point in the history
Replace "binded" with "bound"
  • Loading branch information
beholdr authored Mar 30, 2024
2 parents 18191d2 + a38e8a2 commit fe2dc8a
Show file tree
Hide file tree
Showing 9 changed files with 37 additions and 37 deletions.
22 changes: 11 additions & 11 deletions docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -153,15 +153,15 @@ import { reactive, ref } from "vue"
import { vMaska } from "maska"
const maskedValue = ref('')
const bindedObject = reactive({})
const boundObject = reactive({})
</script>

<template>
<input v-maska="bindedObject" v-model="maskedValue">
<input v-maska="boundObject" v-model="maskedValue">

Masked value: {{ maskedValue }} or {{ bindedObject.masked }}
Unmasked value: {{ bindedObject.unmasked }}
<span v-if="bindedObject.completed">✅ Mask completed</span>
Masked value: {{ maskedValue }} or {{ boundObject.masked }}
Unmasked value: {{ boundObject.unmasked }}
<span v-if="boundObject.completed">✅ Mask completed</span>
</template>
```

Expand All @@ -175,7 +175,7 @@ export default {
directives: { maska: vMaska },
data: () => ({
maskedValue: "",
bindedObject: {
boundObject: {
masked: "",
unmasked: "",
completed: false
Expand All @@ -185,11 +185,11 @@ export default {
</script>

<template>
<input v-maska="bindedObject" v-model="maskedValue">
<input v-maska="boundObject" v-model="maskedValue">

Masked value: {{ maskedValue }} or {{ bindedObject.masked }}
Unmasked value: {{ bindedObject.unmasked }}
<span v-if="bindedObject.completed">✅ Mask completed</span>
Masked value: {{ maskedValue }} or {{ boundObject.masked }}
Unmasked value: {{ boundObject.unmasked }}
<span v-if="boundObject.completed">✅ Mask completed</span>
</template>
```
<!-- tabs:end -->
Expand Down Expand Up @@ -245,7 +245,7 @@ export default {
You can set options and bind to an object at the same time:

``` html
<input v-maska:[options]="bindedObject">
<input v-maska:[options]="boundObject">
```

#### Global registration of directive
Expand Down
8 changes: 4 additions & 4 deletions src/directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,11 @@ export const vMaska: MaskaDirective = (el, binding) => {
}

if (binding.value != null) {
const binded = binding.value
const bound = binding.value
const onMaska = (detail: MaskaDetail): void => {
binded.masked = detail.masked
binded.unmasked = detail.unmasked
binded.completed = detail.completed
bound.masked = detail.masked
bound.unmasked = detail.unmasked
bound.completed = detail.completed
}

opts.onMaska =
Expand Down
6 changes: 3 additions & 3 deletions test/components/BindInitial.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
import { reactive } from 'vue'
import { MaskaDetail, vMaska } from '../../src'
const binded = reactive<Partial<MaskaDetail>>({})
const bound = reactive<Partial<MaskaDetail>>({})
</script>

<template>
<input v-maska="binded" data-maska="#-#" value="123" />
<div>{{ binded.masked }}</div>
<input v-maska="bound" data-maska="#-#" value="123" />
<div>{{ bound.masked }}</div>
</template>
6 changes: 3 additions & 3 deletions test/components/BindMasked.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
import { reactive } from 'vue'
import { MaskaDetail, vMaska } from '../../src'
const binded = reactive<Partial<MaskaDetail>>({})
const bound = reactive<Partial<MaskaDetail>>({})
</script>

<template>
<input v-maska="binded" data-maska="#-#" />
<div>{{ binded.masked }}</div>
<input v-maska="bound" data-maska="#-#" />
<div>{{ bound.masked }}</div>
</template>
6 changes: 3 additions & 3 deletions test/components/BindUnmasked.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
import { reactive } from 'vue'
import { MaskaDetail, vMaska } from '../../src'
const binded = reactive<Partial<MaskaDetail>>({})
const bound = reactive<Partial<MaskaDetail>>({})
</script>

<template>
<input v-maska="binded" data-maska="#-#" />
<div>{{ binded.unmasked }}</div>
<input v-maska="bound" data-maska="#-#" />
<div>{{ bound.unmasked }}</div>
</template>
8 changes: 4 additions & 4 deletions test/components/Callbacks.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ import { MaskaDetail, vMaska } from '../../src'
const emit = defineEmits(['mask1', 'mask2', 'mask3'])
const binded1 = reactive({})
const binded2 = reactive({})
const bound1 = reactive({})
const bound2 = reactive({})
const options1 = {
onMaska: (detail: MaskaDetail) => emit('mask1', detail)
Expand All @@ -19,6 +19,6 @@ const options2 = {
</script>

<template>
<input id="input1" v-maska:[options1]="binded1" data-maska="#-#" />
<input id="input2" v-maska:[options2]="binded2" data-maska="#-#" />
<input id="input1" v-maska:[options1]="bound1" data-maska="#-#" />
<input id="input2" v-maska:[options2]="bound2" data-maska="#-#" />
</template>
6 changes: 3 additions & 3 deletions test/components/Completed.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@
import { reactive } from 'vue'
import { MaskaDetail, vMaska } from '../../src'
const binded = reactive<Partial<MaskaDetail>>({})
const bound = reactive<Partial<MaskaDetail>>({})
</script>

<template>
<input v-maska="binded" data-maska="#-#-#" />
<div v-if="binded.completed">Completed</div>
<input v-maska="bound" data-maska="#-#-#" />
<div v-if="bound.completed">Completed</div>
<div v-else>Uncompleted</div>
</template>
6 changes: 3 additions & 3 deletions test/components/Config.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import { reactive } from 'vue'
import { vMaska, MaskaDetail, MaskInputOptions } from '../../src'
const binded = reactive<Partial<MaskaDetail>>({})
const bound = reactive<Partial<MaskaDetail>>({})
const config = reactive<MaskInputOptions>({
mask: 'A A',
tokens: {
Expand All @@ -16,6 +16,6 @@ const config = reactive<MaskInputOptions>({
</script>

<template>
<input v-maska:[config]="binded" />
<div>{{ binded.masked }}</div>
<input v-maska:[config]="bound" />
<div>{{ bound.masked }}</div>
</template>
6 changes: 3 additions & 3 deletions test/components/Options.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { vMaska } from '../../src'
export default {
data() {
return {
binded: {
bound: {
masked: ''
}
}
Expand All @@ -16,6 +16,6 @@ export default {
</script>

<template>
<input v-maska="binded" data-maska="#-#" />
<div>{{ binded.masked }}</div>
<input v-maska="bound" data-maska="#-#" />
<div>{{ bound.masked }}</div>
</template>

0 comments on commit fe2dc8a

Please sign in to comment.