mirror of
https://github.com/tenrok/maska.git
synced 2026-05-15 11:59:38 +03:00
refactor: move to single package
This commit is contained in:
Alexander Shabunevich
@@ -0,0 +1,73 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Maska Alpine Demo</title>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.min.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><h1>Maska demos</h1></li>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Vanilla JS</a></li>
|
||||||
|
<li><strong>Alpine.js</strong></li>
|
||||||
|
<li><a href="svelte.html">Svelte</a></li>
|
||||||
|
<li><a href="vue.html">Vue</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<article>
|
||||||
|
<div x-data="{
|
||||||
|
maskedvalue: '123',
|
||||||
|
unmaskedvalue: '',
|
||||||
|
options: { eager: true }
|
||||||
|
}">
|
||||||
|
<input
|
||||||
|
x-model="maskedvalue"
|
||||||
|
x-maska:unmaskedvalue.unmasked="options"
|
||||||
|
x-on:maska="console.log($event.detail)"
|
||||||
|
data-maska="##-##"
|
||||||
|
>
|
||||||
|
<div><label><input type="checkbox" x-model="options.eager"> eager?</label></div>
|
||||||
|
<div>masked value: <span x-text="maskedvalue"></span></div>
|
||||||
|
<div>unmasked value: <span x-text="unmaskedvalue"></span></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div x-data="{
|
||||||
|
maskedvalue: '-1234.90',
|
||||||
|
unmaskedvalue: '',
|
||||||
|
options: { number: { locale: 'ru', fraction: 2 }}
|
||||||
|
}" style="margin-top: 1em">
|
||||||
|
<input
|
||||||
|
x-model="maskedvalue"
|
||||||
|
x-maska:unmaskedvalue.unmasked="options"
|
||||||
|
x-on:maska="console.log($event.detail)"
|
||||||
|
>
|
||||||
|
<div>masked value: <span x-text="maskedvalue"></span></div>
|
||||||
|
<div>unmasked value: <span x-text="unmaskedvalue"></span></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div x-data style="margin-top: 1em">
|
||||||
|
<input x-maska data-maska="+1 (###) ###-####" data-maska-eager value="1234567">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="module">
|
||||||
|
import Alpine from 'alpinejs'
|
||||||
|
import { xMaska } from '../src/alpine'
|
||||||
|
|
||||||
|
Alpine.plugin(xMaska)
|
||||||
|
|
||||||
|
window.Alpine = Alpine
|
||||||
|
Alpine.start()
|
||||||
|
</script>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Maska Vanilla JS Demo</title>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.min.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><h1>Maska demos</h1></li>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Vanilla JS</strong></li>
|
||||||
|
<li><a href="alpine.html">Alpine.js</a></li>
|
||||||
|
<li><a href="svelte.html">Svelte</a></li>
|
||||||
|
<li><a href="vue.html">Vue</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<article>
|
||||||
|
<div id="app">
|
||||||
|
<input data-maska="#-#" value="123">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script type="module">
|
||||||
|
import { MaskInput } from '../src'
|
||||||
|
|
||||||
|
new MaskInput('[data-maska]')
|
||||||
|
</script>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Maska Svelte Demo</title>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.min.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><h1>Maska demos</h1></li>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Vanilla JS</a></li>
|
||||||
|
<li><a href="alpine.html">Alpine.js</a></li>
|
||||||
|
<li><strong>Svelte</strong></li>
|
||||||
|
<li><a href="vue.html">Vue</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<article>
|
||||||
|
<div id="app"></div>
|
||||||
|
|
||||||
|
<script type="module">
|
||||||
|
import Demo from '../test/svelte/Demo.svelte'
|
||||||
|
|
||||||
|
new Demo({
|
||||||
|
target: document.getElementById('app')
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,38 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Maska Vue Demo</title>
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.min.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><h1>Maska demos</h1></li>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Vanilla JS</a></li>
|
||||||
|
<li><a href="alpine.html">Alpine.js</a></li>
|
||||||
|
<li><a href="svelte.html">Svelte</a></li>
|
||||||
|
<li><strong>Vue</strong></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<article>
|
||||||
|
<div id="app"></div>
|
||||||
|
|
||||||
|
<script type="module">
|
||||||
|
import { createApp } from 'vue'
|
||||||
|
import Demo from '../test/vue/Demo.vue'
|
||||||
|
|
||||||
|
createApp(Demo).mount('#app')
|
||||||
|
</script>
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta http-equiv="refresh" content="0;URL=/v3" />
|
<meta http-equiv="refresh" content="0;URL=v3/" />
|
||||||
</head>
|
</head>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -0,0 +1,6 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="refresh" content="0;URL=demo/" />
|
||||||
|
</head>
|
||||||
|
</html>
|
||||||
Generated
+471
-825
File diff suppressed because it is too large
Load Diff
+88
-3
@@ -1,6 +1,91 @@
|
|||||||
{
|
{
|
||||||
|
"name": "maska",
|
||||||
|
"description": "Simple zero-dependency input mask for Vanilla JS, Vue, Alpine.js and Svelte",
|
||||||
|
"version": "3.0.0-beta",
|
||||||
"private": true,
|
"private": true,
|
||||||
"workspaces": [
|
"keywords": [
|
||||||
"packages/*"
|
"mask",
|
||||||
]
|
"inputmask",
|
||||||
|
"alpinejs",
|
||||||
|
"svelte",
|
||||||
|
"vue"
|
||||||
|
],
|
||||||
|
"author": "Alexander Shabunevich",
|
||||||
|
"homepage": "https://beholdr.github.io/maska/",
|
||||||
|
"repository": {
|
||||||
|
"url": "https://github.com/beholdr/maska",
|
||||||
|
"type": "git"
|
||||||
|
},
|
||||||
|
"license": "MIT",
|
||||||
|
"files": ["dist"],
|
||||||
|
"exports": {
|
||||||
|
".": "./src/index.ts",
|
||||||
|
"./alpine": "./src/alpine/index.ts",
|
||||||
|
"./svelte": "./src/svelte/index.ts",
|
||||||
|
"./vue": "./src/vue/index.ts"
|
||||||
|
},
|
||||||
|
"publishConfig": {
|
||||||
|
"main": "./dist/maska.js",
|
||||||
|
"module": "./dist/maska.mjs",
|
||||||
|
"unpkg": "./dist/cdn/maska.js",
|
||||||
|
"types": "./dist/maska.d.ts",
|
||||||
|
"exports": {
|
||||||
|
".": {
|
||||||
|
"types": "./dist/maska.d.ts",
|
||||||
|
"import": "./dist/maska.mjs",
|
||||||
|
"require": "./dist/maska.js"
|
||||||
|
},
|
||||||
|
"./alpine": {
|
||||||
|
"types": "./dist/alpine.d.ts",
|
||||||
|
"import": "./dist/alpine.mjs",
|
||||||
|
"require": "./dist/alpine.js"
|
||||||
|
},
|
||||||
|
"./svelte": {
|
||||||
|
"types": "./dist/svelte.d.ts",
|
||||||
|
"import": "./dist/svelte.mjs",
|
||||||
|
"require": "./dist/svelte.js"
|
||||||
|
},
|
||||||
|
"./vue": {
|
||||||
|
"types": "./dist/vue.d.ts",
|
||||||
|
"import": "./dist/vue.mjs",
|
||||||
|
"require": "./dist/vue.js"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"docs": "cd docs && http-server",
|
||||||
|
"build": "tsc && vite build && npm run build:alpine && npm run build:maska && npm run build:vue",
|
||||||
|
"build:alpine": "tsc && vite build -m alpine",
|
||||||
|
"build:maska": "tsc && vite build -m maska",
|
||||||
|
"build:vue": "tsc && vite build -m vue",
|
||||||
|
"test": "vitest run",
|
||||||
|
"test:coverage": "vitest run --coverage",
|
||||||
|
"lint": "ts-standard src",
|
||||||
|
"lint:fix": "ts-standard --fix src",
|
||||||
|
"version": "npm run build && npm test"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@sveltejs/vite-plugin-svelte": "^3.1.1",
|
||||||
|
"@testing-library/dom": "^10.1.0",
|
||||||
|
"@testing-library/jest-dom": "^6.4.5",
|
||||||
|
"@testing-library/svelte": "^5.1.0",
|
||||||
|
"@testing-library/user-event": "^14.5.2",
|
||||||
|
"@tsconfig/svelte": "^5.0.4",
|
||||||
|
"@types/alpinejs": "^3.13.10",
|
||||||
|
"@types/node": "^20.13.0",
|
||||||
|
"@vitejs/plugin-vue": "^5.0.5",
|
||||||
|
"@vitest/coverage-v8": "^1.6.0",
|
||||||
|
"@vue/test-utils": "^2.4.6",
|
||||||
|
"alpinejs": "^3.14.0",
|
||||||
|
"happy-dom": "^14.12.0",
|
||||||
|
"svelte": "^4.2.17",
|
||||||
|
"ts-standard": "^12.0.2",
|
||||||
|
"typescript": "^5.4.5",
|
||||||
|
"vite": "^5.2.12",
|
||||||
|
"vite-plugin-banner": "^0.7.1",
|
||||||
|
"vite-plugin-dts": "^3.9.1",
|
||||||
|
"vitest": "^1.6.0",
|
||||||
|
"vue": "^3.4.27"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,54 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Maska Alpine Demo</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div x-data="{
|
|
||||||
maskedvalue: '123',
|
|
||||||
unmaskedvalue: '',
|
|
||||||
options: { eager: true }
|
|
||||||
}">
|
|
||||||
<input
|
|
||||||
x-model="maskedvalue"
|
|
||||||
x-maska:unmaskedvalue.unmasked="options"
|
|
||||||
x-on:maska="console.log($event.detail)"
|
|
||||||
data-maska="##-##"
|
|
||||||
>
|
|
||||||
<div><label><input type="checkbox" x-model="options.eager"> eager?</label></div>
|
|
||||||
<div>masked value: <span x-text="maskedvalue"></span></div>
|
|
||||||
<div>unmasked value: <span x-text="unmaskedvalue"></span></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div x-data="{
|
|
||||||
maskedvalue: '-1234.90',
|
|
||||||
unmaskedvalue: '',
|
|
||||||
options: { number: { locale: 'ru', fraction: 2 }}
|
|
||||||
}" style="margin-top: 1em">
|
|
||||||
<input
|
|
||||||
x-model="maskedvalue"
|
|
||||||
x-maska:unmaskedvalue.unmasked="options"
|
|
||||||
x-on:maska="console.log($event.detail)"
|
|
||||||
>
|
|
||||||
<div>masked value: <span x-text="maskedvalue"></span></div>
|
|
||||||
<div>unmasked value: <span x-text="unmaskedvalue"></span></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div x-data style="margin-top: 1em">
|
|
||||||
<input x-maska data-maska="+1 (###) ###-####" data-maska-eager value="1234567">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="module">
|
|
||||||
import Alpine from 'alpinejs'
|
|
||||||
import { xMaska } from './src'
|
|
||||||
|
|
||||||
Alpine.plugin(xMaska)
|
|
||||||
|
|
||||||
window.Alpine = Alpine
|
|
||||||
Alpine.start()
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,56 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "@maskajs/alpine",
|
|
||||||
"version": "3.0.0-beta",
|
|
||||||
"description": "Simple zero-dependency input mask for Alpine.js",
|
|
||||||
"keywords": [
|
|
||||||
"mask",
|
|
||||||
"inputmask",
|
|
||||||
"alpinejs"
|
|
||||||
],
|
|
||||||
"author": "Alexander Shabunevich",
|
|
||||||
"homepage": "https://beholdr.github.io/maska/",
|
|
||||||
"repository": {
|
|
||||||
"url": "https://github.com/beholdr/maska",
|
|
||||||
"type": "git",
|
|
||||||
"directory": "packages/alpine"
|
|
||||||
},
|
|
||||||
"license": "MIT",
|
|
||||||
"files": [
|
|
||||||
"dist"
|
|
||||||
],
|
|
||||||
"main": "./dist/maska.umd.js",
|
|
||||||
"module": "./dist/maska.mjs",
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"exports": {
|
|
||||||
".": {
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"import": "./dist/maska.mjs",
|
|
||||||
"require": "./dist/maska.umd.js"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"dev": "vite",
|
|
||||||
"build": "tsc && vite build",
|
|
||||||
"test": "vitest run",
|
|
||||||
"test:coverage": "vitest run --coverage",
|
|
||||||
"lint": "ts-standard src",
|
|
||||||
"lint:fix": "ts-standard --fix src",
|
|
||||||
"version": "npm run build && npm test"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@testing-library/dom": "^10.0.0",
|
|
||||||
"@testing-library/jest-dom": "^6.4.2",
|
|
||||||
"@testing-library/user-event": "^14.5.2",
|
|
||||||
"@types/alpinejs": "^3.13.10",
|
|
||||||
"@types/node": "^20.12.7",
|
|
||||||
"@vitest/coverage-v8": "^1.5.0",
|
|
||||||
"alpinejs": "^3.13.8",
|
|
||||||
"happy-dom": "^14.7.1",
|
|
||||||
"ts-standard": "^12.0.2",
|
|
||||||
"typescript": "^5.4.5",
|
|
||||||
"vite": "^5.2.8",
|
|
||||||
"vite-plugin-banner": "^0.7.1",
|
|
||||||
"vite-plugin-dts": "^3.8.2",
|
|
||||||
"vitest": "^1.5.0"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,21 +0,0 @@
|
|||||||
import {
|
|
||||||
Mask,
|
|
||||||
MaskType,
|
|
||||||
MaskOptions,
|
|
||||||
MaskInput,
|
|
||||||
MaskInputOptions,
|
|
||||||
MaskaDetail,
|
|
||||||
tokens,
|
|
||||||
MaskTokens
|
|
||||||
} from 'maska'
|
|
||||||
import { xMaska } from './alpine'
|
|
||||||
|
|
||||||
export { Mask, MaskInput, tokens, xMaska }
|
|
||||||
export type { MaskaDetail, MaskInputOptions, MaskOptions, MaskTokens, MaskType }
|
|
||||||
|
|
||||||
if (document.currentScript?.dataset.init !== undefined) {
|
|
||||||
document.addEventListener('alpine:init', () => {
|
|
||||||
// @ts-expect-error
|
|
||||||
window.Alpine.plugin(xMaska)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"extends": "../../tsconfig.json",
|
|
||||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx"]
|
|
||||||
}
|
|
||||||
@@ -1,32 +0,0 @@
|
|||||||
import { resolve } from 'path'
|
|
||||||
import { defineConfig } from 'vitest/config'
|
|
||||||
|
|
||||||
import banner from 'vite-plugin-banner'
|
|
||||||
import dts from 'vite-plugin-dts'
|
|
||||||
|
|
||||||
import pkg from './package.json'
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
build: {
|
|
||||||
lib: {
|
|
||||||
entry: resolve(__dirname, 'src/index.ts'),
|
|
||||||
name: 'Maska',
|
|
||||||
fileName: 'maska'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
dts({ rollupTypes: true, bundledPackages: ["maska"] }),
|
|
||||||
banner(
|
|
||||||
`/*! ${pkg.name} v${pkg.version} */`
|
|
||||||
)
|
|
||||||
],
|
|
||||||
test: {
|
|
||||||
setupFiles: 'test/setup.ts',
|
|
||||||
environment: 'happy-dom',
|
|
||||||
coverage: {
|
|
||||||
provider: 'v8',
|
|
||||||
reporter: ['text', 'json-summary']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
@@ -1,20 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Maska Demo</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="app">
|
|
||||||
<input data-maska="#-#" value="123">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script type="module">
|
|
||||||
import { MaskInput } from './src'
|
|
||||||
|
|
||||||
new MaskInput('[data-maska]')
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,54 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "maska",
|
|
||||||
"version": "3.0.0-beta",
|
|
||||||
"description": "Simple zero-dependency input mask for Vanilla JS",
|
|
||||||
"keywords": [
|
|
||||||
"mask",
|
|
||||||
"inputmask"
|
|
||||||
],
|
|
||||||
"author": "Alexander Shabunevich",
|
|
||||||
"homepage": "https://beholdr.github.io/maska/",
|
|
||||||
"repository": {
|
|
||||||
"url": "https://github.com/beholdr/maska",
|
|
||||||
"type": "git",
|
|
||||||
"directory": "packages/maska"
|
|
||||||
},
|
|
||||||
"license": "MIT",
|
|
||||||
"files": [
|
|
||||||
"dist"
|
|
||||||
],
|
|
||||||
"main": "./dist/maska.umd.js",
|
|
||||||
"module": "./dist/maska.mjs",
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"exports": {
|
|
||||||
".": {
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"import": "./dist/maska.mjs",
|
|
||||||
"require": "./dist/maska.umd.js"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"dev": "vite",
|
|
||||||
"build": "tsc && vite build",
|
|
||||||
"build:watch": "vite build --watch",
|
|
||||||
"test": "vitest run",
|
|
||||||
"test:coverage": "vitest run --coverage",
|
|
||||||
"lint": "ts-standard src",
|
|
||||||
"lint:fix": "ts-standard --fix src",
|
|
||||||
"version": "npm run build && npm test"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@testing-library/dom": "^10.0.0",
|
|
||||||
"@testing-library/jest-dom": "^6.4.2",
|
|
||||||
"@testing-library/user-event": "^14.5.2",
|
|
||||||
"@types/node": "^20.12.7",
|
|
||||||
"@vitest/coverage-v8": "^1.5.0",
|
|
||||||
"happy-dom": "^14.7.1",
|
|
||||||
"ts-standard": "^12.0.2",
|
|
||||||
"typescript": "^5.4.5",
|
|
||||||
"vite": "^5.2.8",
|
|
||||||
"vite-plugin-banner": "^0.7.1",
|
|
||||||
"vite-plugin-dts": "^3.8.2",
|
|
||||||
"vitest": "^1.5.0"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1 +0,0 @@
|
|||||||
import '@testing-library/jest-dom/vitest'
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"extends": "../../tsconfig.json",
|
|
||||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx"]
|
|
||||||
}
|
|
||||||
@@ -1,32 +0,0 @@
|
|||||||
import { resolve } from 'path'
|
|
||||||
import { defineConfig } from 'vitest/config'
|
|
||||||
|
|
||||||
import banner from 'vite-plugin-banner'
|
|
||||||
import dts from 'vite-plugin-dts'
|
|
||||||
|
|
||||||
import pkg from './package.json'
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
build: {
|
|
||||||
lib: {
|
|
||||||
entry: resolve(__dirname, 'src/index.ts'),
|
|
||||||
name: 'Maska',
|
|
||||||
fileName: 'maska'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
dts({ rollupTypes: true }),
|
|
||||||
banner(
|
|
||||||
`/*! ${pkg.name} v${pkg.version} */`
|
|
||||||
)
|
|
||||||
],
|
|
||||||
test: {
|
|
||||||
setupFiles: 'test/setup.ts',
|
|
||||||
environment: 'happy-dom',
|
|
||||||
coverage: {
|
|
||||||
provider: 'v8',
|
|
||||||
reporter: ['text', 'json-summary']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
@@ -1,20 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Maska Svelte Demo</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="app"></div>
|
|
||||||
|
|
||||||
<script type="module">
|
|
||||||
import Demo from './test/components/Demo.svelte'
|
|
||||||
|
|
||||||
new Demo({
|
|
||||||
target: document.getElementById('app')
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,58 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "@maskajs/svelte",
|
|
||||||
"version": "3.0.0-beta",
|
|
||||||
"description": "Simple zero-dependency input mask for Svelte",
|
|
||||||
"keywords": [
|
|
||||||
"mask",
|
|
||||||
"inputmask",
|
|
||||||
"svelte"
|
|
||||||
],
|
|
||||||
"author": "Alexander Shabunevich",
|
|
||||||
"homepage": "https://beholdr.github.io/maska/",
|
|
||||||
"repository": {
|
|
||||||
"url": "https://github.com/beholdr/maska",
|
|
||||||
"type": "git",
|
|
||||||
"directory": "packages/svelte"
|
|
||||||
},
|
|
||||||
"license": "MIT",
|
|
||||||
"files": [
|
|
||||||
"dist"
|
|
||||||
],
|
|
||||||
"main": "./dist/maska.umd.js",
|
|
||||||
"module": "./dist/maska.mjs",
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"exports": {
|
|
||||||
".": {
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"import": "./dist/maska.mjs",
|
|
||||||
"require": "./dist/maska.umd.js"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"dev": "vite",
|
|
||||||
"build": "tsc && vite build",
|
|
||||||
"test": "vitest run",
|
|
||||||
"test:coverage": "vitest run --coverage",
|
|
||||||
"lint": "ts-standard src",
|
|
||||||
"lint:fix": "ts-standard --fix src",
|
|
||||||
"version": "npm run build && npm test"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@sveltejs/vite-plugin-svelte": "^3.1.0",
|
|
||||||
"@testing-library/dom": "^10.0.0",
|
|
||||||
"@testing-library/jest-dom": "^6.4.2",
|
|
||||||
"@testing-library/svelte": "^5.1.0",
|
|
||||||
"@testing-library/user-event": "^14.5.2",
|
|
||||||
"@tsconfig/svelte": "^5.0.4",
|
|
||||||
"@types/node": "^20.12.7",
|
|
||||||
"@vitest/coverage-v8": "^1.5.0",
|
|
||||||
"happy-dom": "^14.7.1",
|
|
||||||
"svelte": "^4.2.15",
|
|
||||||
"ts-standard": "^12.0.2",
|
|
||||||
"typescript": "^5.4.5",
|
|
||||||
"vite": "^5.2.8",
|
|
||||||
"vite-plugin-banner": "^0.7.1",
|
|
||||||
"vite-plugin-dts": "^3.8.2",
|
|
||||||
"vitest": "^1.5.0"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
import {
|
|
||||||
Mask,
|
|
||||||
MaskType,
|
|
||||||
MaskOptions,
|
|
||||||
MaskInput,
|
|
||||||
MaskInputOptions,
|
|
||||||
MaskaDetail,
|
|
||||||
tokens,
|
|
||||||
MaskTokens
|
|
||||||
} from 'maska'
|
|
||||||
import { maska } from './svelte'
|
|
||||||
|
|
||||||
export { Mask, MaskInput, tokens, maska }
|
|
||||||
export type { MaskaDetail, MaskInputOptions, MaskOptions, MaskTokens, MaskType }
|
|
||||||
@@ -1 +0,0 @@
|
|||||||
import '@testing-library/jest-dom/vitest'
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"extends": "../../tsconfig.json",
|
|
||||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.svelte"]
|
|
||||||
}
|
|
||||||
@@ -1,36 +0,0 @@
|
|||||||
import { resolve } from 'path'
|
|
||||||
import { defineConfig } from 'vitest/config'
|
|
||||||
|
|
||||||
import { svelte } from '@sveltejs/vite-plugin-svelte'
|
|
||||||
import { svelteTesting } from '@testing-library/svelte/vite'
|
|
||||||
import banner from 'vite-plugin-banner'
|
|
||||||
import dts from 'vite-plugin-dts'
|
|
||||||
|
|
||||||
import pkg from './package.json'
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
build: {
|
|
||||||
lib: {
|
|
||||||
entry: resolve(__dirname, 'src/index.ts'),
|
|
||||||
name: 'Maska',
|
|
||||||
fileName: 'maska'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
svelte(),
|
|
||||||
svelteTesting(),
|
|
||||||
dts({ rollupTypes: true, bundledPackages: ["maska"] }),
|
|
||||||
banner(
|
|
||||||
`/*! ${pkg.name} v${pkg.version} */`
|
|
||||||
)
|
|
||||||
],
|
|
||||||
test: {
|
|
||||||
setupFiles: 'test/setup.ts',
|
|
||||||
environment: 'happy-dom',
|
|
||||||
coverage: {
|
|
||||||
provider: 'v8',
|
|
||||||
reporter: ['text', 'json-summary']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
@@ -1,19 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Maska Vue Demo</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="app"></div>
|
|
||||||
|
|
||||||
<script type="module">
|
|
||||||
import { createApp } from 'vue'
|
|
||||||
import Demo from './test/components/Demo.vue'
|
|
||||||
|
|
||||||
createApp(Demo).mount('#app')
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,58 +0,0 @@
|
|||||||
{
|
|
||||||
"name": "@maskajs/vue",
|
|
||||||
"version": "3.0.0-beta",
|
|
||||||
"description": "Simple zero-dependency input mask for Vue 2/3",
|
|
||||||
"keywords": [
|
|
||||||
"mask",
|
|
||||||
"inputmask",
|
|
||||||
"vue"
|
|
||||||
],
|
|
||||||
"author": "Alexander Shabunevich",
|
|
||||||
"homepage": "https://beholdr.github.io/maska/",
|
|
||||||
"repository": {
|
|
||||||
"url": "https://github.com/beholdr/maska",
|
|
||||||
"type": "git",
|
|
||||||
"directory": "packages/vue"
|
|
||||||
},
|
|
||||||
"license": "MIT",
|
|
||||||
"files": [
|
|
||||||
"dist"
|
|
||||||
],
|
|
||||||
"main": "./dist/maska.umd.js",
|
|
||||||
"module": "./dist/maska.mjs",
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"exports": {
|
|
||||||
".": {
|
|
||||||
"types": "./dist/maska.d.ts",
|
|
||||||
"import": "./dist/maska.mjs",
|
|
||||||
"require": "./dist/maska.umd.js"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"scripts": {
|
|
||||||
"dev": "vite",
|
|
||||||
"build": "vue-tsc && vite build",
|
|
||||||
"test": "vitest run",
|
|
||||||
"test:coverage": "vitest run --coverage",
|
|
||||||
"lint": "ts-standard src",
|
|
||||||
"lint:fix": "ts-standard --fix src",
|
|
||||||
"version": "npm run build && npm test"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@testing-library/dom": "^10.0.0",
|
|
||||||
"@testing-library/jest-dom": "^6.4.2",
|
|
||||||
"@testing-library/user-event": "^14.5.2",
|
|
||||||
"@types/node": "^20.12.7",
|
|
||||||
"@vitejs/plugin-vue": "^5.0.4",
|
|
||||||
"@vitest/coverage-v8": "^1.5.0",
|
|
||||||
"@vue/test-utils": "^2.4.5",
|
|
||||||
"happy-dom": "^14.7.1",
|
|
||||||
"ts-standard": "^12.0.2",
|
|
||||||
"typescript": "^5.4.5",
|
|
||||||
"vite": "^5.2.8",
|
|
||||||
"vite-plugin-banner": "^0.7.1",
|
|
||||||
"vite-plugin-dts": "^3.8.2",
|
|
||||||
"vitest": "^1.5.0",
|
|
||||||
"vue": "^3.2.45",
|
|
||||||
"vue-tsc": "^2.0.13"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,14 +0,0 @@
|
|||||||
import {
|
|
||||||
Mask,
|
|
||||||
MaskType,
|
|
||||||
MaskOptions,
|
|
||||||
MaskInput,
|
|
||||||
MaskInputOptions,
|
|
||||||
MaskaDetail,
|
|
||||||
tokens,
|
|
||||||
MaskTokens
|
|
||||||
} from 'maska'
|
|
||||||
import { vMaska } from './vue'
|
|
||||||
|
|
||||||
export { Mask, MaskInput, tokens, vMaska }
|
|
||||||
export type { MaskaDetail, MaskInputOptions, MaskOptions, MaskTokens, MaskType }
|
|
||||||
@@ -1 +0,0 @@
|
|||||||
import '@testing-library/jest-dom/vitest'
|
|
||||||
@@ -1,4 +0,0 @@
|
|||||||
{
|
|
||||||
"extends": "../../tsconfig.json",
|
|
||||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
|
|
||||||
}
|
|
||||||
@@ -1,34 +0,0 @@
|
|||||||
import { resolve } from 'path'
|
|
||||||
import { defineConfig } from 'vitest/config'
|
|
||||||
|
|
||||||
import vue from '@vitejs/plugin-vue'
|
|
||||||
import banner from 'vite-plugin-banner'
|
|
||||||
import dts from 'vite-plugin-dts'
|
|
||||||
|
|
||||||
import pkg from './package.json'
|
|
||||||
|
|
||||||
// https://vitejs.dev/config/
|
|
||||||
export default defineConfig({
|
|
||||||
build: {
|
|
||||||
lib: {
|
|
||||||
entry: resolve(__dirname, 'src/index.ts'),
|
|
||||||
name: 'Maska',
|
|
||||||
fileName: 'maska'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
vue(),
|
|
||||||
dts({ rollupTypes: true, bundledPackages: ["maska"] }),
|
|
||||||
banner(
|
|
||||||
`/*! ${pkg.name} v${pkg.version} */`
|
|
||||||
)
|
|
||||||
],
|
|
||||||
test: {
|
|
||||||
setupFiles: 'test/setup.ts',
|
|
||||||
environment: 'happy-dom',
|
|
||||||
coverage: {
|
|
||||||
provider: 'v8',
|
|
||||||
reporter: ['text', 'json-summary']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import { Mask } from '../mask'
|
||||||
|
import { MaskInput } from '../input'
|
||||||
|
import { tokens } from '../tokens'
|
||||||
|
import { xMaska } from '.'
|
||||||
|
|
||||||
|
export { Mask, MaskInput, tokens, xMaska }
|
||||||
|
|
||||||
|
document.addEventListener('alpine:init', () => {
|
||||||
|
// @ts-expect-error
|
||||||
|
window.Alpine.plugin(xMaska)
|
||||||
|
})
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { Alpine } from 'alpinejs'
|
import { Alpine } from 'alpinejs'
|
||||||
import { MaskaDetail, MaskInput, MaskInputOptions } from '.'
|
import { MaskaDetail, MaskInput, MaskInputOptions } from '../input'
|
||||||
|
|
||||||
const masks = new WeakMap<HTMLInputElement, MaskInput>()
|
const masks = new WeakMap<HTMLInputElement, MaskInput>()
|
||||||
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { Action } from 'svelte/action'
|
import { Action } from 'svelte/action'
|
||||||
import { MaskaDetail, MaskInput, MaskInputOptions } from '.'
|
import { MaskaDetail, MaskInput, MaskInputOptions } from '..'
|
||||||
|
|
||||||
const masks = new WeakMap<HTMLInputElement, MaskInput>()
|
const masks = new WeakMap<HTMLInputElement, MaskInput>()
|
||||||
|
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
import { Mask } from '../mask'
|
||||||
|
import { MaskInput } from '../input'
|
||||||
|
import { tokens } from '../tokens'
|
||||||
|
import { vMaska } from '.'
|
||||||
|
|
||||||
|
export { Mask, MaskInput, tokens, vMaska }
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { Directive, DirectiveBinding } from 'vue'
|
import { Directive, DirectiveBinding } from 'vue'
|
||||||
import { MaskaDetail, MaskInput, MaskInputOptions } from '.'
|
import { MaskaDetail, MaskInput, MaskInputOptions } from '..'
|
||||||
|
|
||||||
type MaskaDirective = Directive<HTMLElement, MaskInputOptions | undefined>
|
type MaskaDirective = Directive<HTMLElement, MaskInputOptions | undefined>
|
||||||
|
|
||||||
@@ -3,7 +3,7 @@ import userEvent from '@testing-library/user-event'
|
|||||||
import Alpine from 'alpinejs'
|
import Alpine from 'alpinejs'
|
||||||
import { nextTick } from 'alpinejs/src/nextTick'
|
import { nextTick } from 'alpinejs/src/nextTick'
|
||||||
|
|
||||||
import { xMaska } from '../src'
|
import { xMaska } from '../src/alpine'
|
||||||
|
|
||||||
Alpine.plugin(xMaska)
|
Alpine.plugin(xMaska)
|
||||||
Alpine.start()
|
Alpine.start()
|
||||||
@@ -3,10 +3,10 @@ import { tick } from 'svelte'
|
|||||||
import { render } from '@testing-library/svelte'
|
import { render } from '@testing-library/svelte'
|
||||||
import userEvent from '@testing-library/user-event'
|
import userEvent from '@testing-library/user-event'
|
||||||
|
|
||||||
import BindValue from './components/BindValue.svelte'
|
import BindValue from './svelte/BindValue.svelte'
|
||||||
import InitialValue from './components/InitialValue.svelte'
|
import InitialValue from './svelte/InitialValue.svelte'
|
||||||
import Options from './components/Options.svelte'
|
import Options from './svelte/Options.svelte'
|
||||||
import Simple from './components/Simple.svelte'
|
import Simple from './svelte/Simple.svelte'
|
||||||
|
|
||||||
const user = userEvent.setup()
|
const user = userEvent.setup()
|
||||||
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { maska } from '../../src'
|
import { maska } from '../../src/svelte'
|
||||||
|
|
||||||
let value = '123'
|
let value = '123'
|
||||||
</script>
|
</script>
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { type MaskaDetail, maska } from '../../src'
|
import type { MaskaDetail } from '../../src'
|
||||||
|
import { maska } from '../../src/svelte'
|
||||||
|
|
||||||
const onMaska = (e: CustomEvent<MaskaDetail>) => console.log(e.detail.masked)
|
const onMaska = (e: CustomEvent<MaskaDetail>) => console.log(e.detail.masked)
|
||||||
</script>
|
</script>
|
||||||
+1
-1
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { maska } from '../../src'
|
import { maska } from '../../src/svelte'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { maska } from '../../src'
|
import { maska } from '../../src/svelte'
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
number: {}
|
number: {}
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { maska } from '../../src'
|
import { maska } from '../../src/svelte'
|
||||||
|
|
||||||
const options = {
|
const options = {
|
||||||
mask: '#-#',
|
mask: '#-#',
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { maska } from '../../src'
|
import { maska } from '../../src/svelte'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
@@ -2,24 +2,24 @@ import { nextTick } from 'vue'
|
|||||||
import { expect, test } from 'vitest'
|
import { expect, test } from 'vitest'
|
||||||
import { mount } from '@vue/test-utils'
|
import { mount } from '@vue/test-utils'
|
||||||
|
|
||||||
import BindCompleted from './components/BindCompleted.vue'
|
import BindCompleted from './vue/BindCompleted.vue'
|
||||||
import BindMasked from './components/BindMasked.vue'
|
import BindMasked from './vue/BindMasked.vue'
|
||||||
import BindModel from './components/BindModel.vue'
|
import BindModel from './vue/BindModel.vue'
|
||||||
import BindUnmasked from './components/BindUnmasked.vue'
|
import BindUnmasked from './vue/BindUnmasked.vue'
|
||||||
import Callbacks from './components/Callbacks.vue'
|
import Callbacks from './vue/Callbacks.vue'
|
||||||
import ChangeValue from './components/ChangeValue.vue'
|
import ChangeValue from './vue/ChangeValue.vue'
|
||||||
import Config from './components/Config.vue'
|
import Config from './vue/Config.vue'
|
||||||
import Custom from './components/Custom.vue'
|
import Custom from './vue/Custom.vue'
|
||||||
import DataAttr from './components/DataAttr.vue'
|
import DataAttr from './vue/DataAttr.vue'
|
||||||
import Dynamic from './components/Dynamic.vue'
|
import Dynamic from './vue/Dynamic.vue'
|
||||||
import Events from './components/Events.vue'
|
import Events from './vue/Events.vue'
|
||||||
import Hooks from './components/Hooks.vue'
|
import Hooks from './vue/Hooks.vue'
|
||||||
import Initial from './components/Initial.vue'
|
import Initial from './vue/Initial.vue'
|
||||||
import Model from './components/Model.vue'
|
import Model from './vue/Model.vue'
|
||||||
import Multiple from './components/Multiple.vue'
|
import Multiple from './vue/Multiple.vue'
|
||||||
import Options from './components/Options.vue'
|
import Options from './vue/Options.vue'
|
||||||
import Parent from './components/Parent.vue'
|
import Parent from './vue/Parent.vue'
|
||||||
import Simple from './components/Simple.vue'
|
import Simple from './vue/Simple.vue'
|
||||||
|
|
||||||
test('simple directive', async () => {
|
test('simple directive', async () => {
|
||||||
const wrapper = mount(Simple)
|
const wrapper = mount(Simple)
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const bound = ref(false)
|
const bound = ref(false)
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const bound = ref('')
|
const bound = ref('')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const value = ref('123')
|
const value = ref('123')
|
||||||
const bound = ref('')
|
const bound = ref('')
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const bound = ref('')
|
const bound = ref('')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
import { MaskInputOptions, vMaska } from '../../src'
|
import { MaskInputOptions } from '../../src'
|
||||||
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const emit = defineEmits(['mask1', 'mask2', 'mask3'])
|
const emit = defineEmits(['mask1', 'mask2', 'mask3'])
|
||||||
|
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const data = ref('1234')
|
const data = ref('1234')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { MaskInputOptions, vMaska } from '../../src'
|
import { MaskInputOptions } from '../../src'
|
||||||
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const bound = ref('')
|
const bound = ref('')
|
||||||
const config = <MaskInputOptions>{
|
const config = <MaskInputOptions>{
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
import CustomInput from './CustomInput.vue'
|
import CustomInput from './CustomInput.vue'
|
||||||
|
|
||||||
const value = ref('')
|
const value = ref('')
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const mask = ref('["#--#", "#-#--#"]')
|
const mask = ref('["#--#", "#-#--#"]')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { MaskaDetail, vMaska } from '../../src'
|
import { MaskaDetail } from '../../src'
|
||||||
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const emit = defineEmits(['mask'])
|
const emit = defineEmits(['mask'])
|
||||||
|
|
||||||
@@ -1,5 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { MaskInputOptions, vMaska } from '../../src'
|
import { MaskInputOptions } from '../../src'
|
||||||
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const config = <MaskInputOptions>{
|
const config = <MaskInputOptions>{
|
||||||
preProcess: (val) => val.toUpperCase()
|
preProcess: (val) => val.toUpperCase()
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const initial = ref('345')
|
const initial = ref('345')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const value = ref('123')
|
const value = ref('123')
|
||||||
</script>
|
</script>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { reactive, ref } from 'vue'
|
import { reactive, ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const emit = defineEmits(['mask1', 'mask2'])
|
const emit = defineEmits(['mask1', 'mask2'])
|
||||||
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, ref } from 'vue'
|
import { reactive, ref } from 'vue'
|
||||||
import { vMaska } from '../../src'
|
import { vMaska } from '../../src/vue'
|
||||||
|
|
||||||
const mask = ref('+1 (###) ###-####')
|
const mask = ref('+1 (###) ###-####')
|
||||||
const show = ref(true)
|
const show = ref(true)
|
||||||
+2
-1
@@ -6,6 +6,7 @@
|
|||||||
"moduleResolution": "Node",
|
"moduleResolution": "Node",
|
||||||
"strict": true,
|
"strict": true,
|
||||||
"jsx": "preserve",
|
"jsx": "preserve",
|
||||||
|
"allowJs": true,
|
||||||
"resolveJsonModule": true,
|
"resolveJsonModule": true,
|
||||||
"isolatedModules": true,
|
"isolatedModules": true,
|
||||||
"esModuleInterop": true,
|
"esModuleInterop": true,
|
||||||
@@ -14,6 +15,6 @@
|
|||||||
"noEmit": true,
|
"noEmit": true,
|
||||||
"types": ["vite/client"]
|
"types": ["vite/client"]
|
||||||
},
|
},
|
||||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx"],
|
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "test/**/*.vue", "test/**/*.svelte"],
|
||||||
"references": [{ "path": "./tsconfig.node.json" }]
|
"references": [{ "path": "./tsconfig.node.json" }]
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-1
@@ -2,7 +2,7 @@
|
|||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"composite": true,
|
"composite": true,
|
||||||
"module": "ESNext",
|
"module": "ESNext",
|
||||||
"moduleResolution": "Node",
|
"moduleResolution": "Bundler",
|
||||||
"resolveJsonModule": true,
|
"resolveJsonModule": true,
|
||||||
"allowSyntheticDefaultImports": true
|
"allowSyntheticDefaultImports": true
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -0,0 +1,62 @@
|
|||||||
|
import { UserConfig } from 'vite'
|
||||||
|
import { resolve } from 'path'
|
||||||
|
import { defineConfig } from 'vitest/config'
|
||||||
|
|
||||||
|
import vue from '@vitejs/plugin-vue'
|
||||||
|
import { svelte } from '@sveltejs/vite-plugin-svelte'
|
||||||
|
import { svelteTesting } from '@testing-library/svelte/vite'
|
||||||
|
import banner from 'vite-plugin-banner'
|
||||||
|
import dts from 'vite-plugin-dts'
|
||||||
|
|
||||||
|
import pkg from './package.json'
|
||||||
|
|
||||||
|
const generateConfig = (entry: string, file: string): UserConfig['build'] => ({
|
||||||
|
lib: {
|
||||||
|
entry: resolve(__dirname, entry),
|
||||||
|
name: 'Maska',
|
||||||
|
fileName: () => `${file}.js`,
|
||||||
|
formats: ['umd']
|
||||||
|
},
|
||||||
|
outDir: 'dist/cdn',
|
||||||
|
emptyOutDir: false
|
||||||
|
})
|
||||||
|
|
||||||
|
const config: Record<string, UserConfig['build']> = {
|
||||||
|
default: {
|
||||||
|
lib: {
|
||||||
|
entry: {
|
||||||
|
maska: resolve(__dirname, 'src/index.ts'),
|
||||||
|
alpine: resolve(__dirname, 'src/alpine/index.ts'),
|
||||||
|
svelte: resolve(__dirname, 'src/svelte/index.ts'),
|
||||||
|
vue: resolve(__dirname, 'src/vue/index.ts')
|
||||||
|
},
|
||||||
|
formats: ['es', 'cjs']
|
||||||
|
},
|
||||||
|
emptyOutDir: true
|
||||||
|
},
|
||||||
|
alpine: generateConfig('src/alpine/cdn.ts', 'alpine'),
|
||||||
|
maska: generateConfig('src/index.ts', 'maska'),
|
||||||
|
vue: generateConfig('src/vue/cdn.ts', 'vue')
|
||||||
|
}
|
||||||
|
|
||||||
|
export default defineConfig(({ mode }) => ({
|
||||||
|
build: config[mode] ?? config['default'],
|
||||||
|
plugins: [
|
||||||
|
vue(),
|
||||||
|
svelte(),
|
||||||
|
svelteTesting(),
|
||||||
|
dts({ rollupTypes: true }),
|
||||||
|
banner({
|
||||||
|
content: `/*! ${pkg.name} v${pkg.version} by ${pkg.author} | Released under the ${pkg.license} license */`,
|
||||||
|
outDir: 'dist/cdn'
|
||||||
|
})
|
||||||
|
],
|
||||||
|
test: {
|
||||||
|
setupFiles: 'test/setup.ts',
|
||||||
|
environment: 'happy-dom',
|
||||||
|
coverage: {
|
||||||
|
provider: 'v8',
|
||||||
|
reporter: ['text', 'json-summary']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}))
|
||||||
Reference in New Issue
Block a user