2
0
mirror of https://github.com/tenrok/maska.git synced 2026-06-02 16:04:05 +03:00

feat: add alpine plugin

This commit is contained in:
Alexander Shabunevich
2024-04-17 21:23:41 +03:00
parent c60c26b18b
commit 9accb8e4c4
8 changed files with 370 additions and 74 deletions
+1
View File
@@ -5,6 +5,7 @@ version: '3'
silent: true
tasks:
dev:alpine: npm run dev --workspace=packages/alpine
dev:maska: npm run dev --workspace=packages/maska
dev:maska-build-watch: npm run build:watch --workspace=packages/maska
dev:vue: npm run dev --workspace=packages/vue
+178 -74
View File
@@ -785,6 +785,10 @@
"@jridgewell/sourcemap-codec": "^1.4.14"
}
},
"node_modules/@maskajs/alpine": {
"resolved": "packages/alpine",
"link": true
},
"node_modules/@maskajs/vue": {
"resolved": "packages/vue",
"link": true
@@ -1413,6 +1417,12 @@
"@testing-library/dom": ">=7.21.4"
}
},
"node_modules/@types/alpinejs": {
"version": "3.13.10",
"resolved": "https://registry.npmjs.org/@types/alpinejs/-/alpinejs-3.13.10.tgz",
"integrity": "sha512-ah53tF6mWuuwerpDE7EHwbZErNDJQlsLISPqJhYj2RZ9nuTYbRknSkqebUd3igkhLIZKkPa7IiXjSn9qsU9O2w==",
"dev": true
},
"node_modules/@types/argparse": {
"version": "1.0.38",
"resolved": "https://registry.npmjs.org/@types/argparse/-/argparse-1.0.38.tgz",
@@ -1914,55 +1924,79 @@
"dev": true
},
"node_modules/@vue/compiler-core": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz",
"integrity": "sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.23.tgz",
"integrity": "sha512-HAFmuVEwNqNdmk+w4VCQ2pkLk1Vw4XYiiyxEp3z/xvl14aLTUBw2OfVH3vBcx+FtGsynQLkkhK410Nah1N2yyQ==",
"dev": true,
"dependencies": {
"@babel/parser": "^7.23.9",
"@vue/shared": "3.4.21",
"@babel/parser": "^7.24.1",
"@vue/shared": "3.4.23",
"entities": "^4.5.0",
"estree-walker": "^2.0.2",
"source-map-js": "^1.0.2"
"source-map-js": "^1.2.0"
}
},
"node_modules/@vue/compiler-core/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/compiler-dom": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.21.tgz",
"integrity": "sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.23.tgz",
"integrity": "sha512-t0b9WSTnCRrzsBGrDd1LNR5HGzYTr7LX3z6nNBG+KGvZLqrT0mY6NsMzOqlVMBKKXKVuusbbB5aOOFgTY+senw==",
"dev": true,
"dependencies": {
"@vue/compiler-core": "3.4.21",
"@vue/shared": "3.4.21"
"@vue/compiler-core": "3.4.23",
"@vue/shared": "3.4.23"
}
},
"node_modules/@vue/compiler-dom/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/compiler-sfc": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.21.tgz",
"integrity": "sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.23.tgz",
"integrity": "sha512-fSDTKTfzaRX1kNAUiaj8JB4AokikzStWgHooMhaxyjZerw624L+IAP/fvI4ZwMpwIh8f08PVzEnu4rg8/Npssw==",
"dev": true,
"dependencies": {
"@babel/parser": "^7.23.9",
"@vue/compiler-core": "3.4.21",
"@vue/compiler-dom": "3.4.21",
"@vue/compiler-ssr": "3.4.21",
"@vue/shared": "3.4.21",
"@babel/parser": "^7.24.1",
"@vue/compiler-core": "3.4.23",
"@vue/compiler-dom": "3.4.23",
"@vue/compiler-ssr": "3.4.23",
"@vue/shared": "3.4.23",
"estree-walker": "^2.0.2",
"magic-string": "^0.30.7",
"postcss": "^8.4.35",
"source-map-js": "^1.0.2"
"magic-string": "^0.30.8",
"postcss": "^8.4.38",
"source-map-js": "^1.2.0"
}
},
"node_modules/@vue/compiler-sfc/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/compiler-ssr": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.21.tgz",
"integrity": "sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.23.tgz",
"integrity": "sha512-hb6Uj2cYs+tfqz71Wj6h3E5t6OKvb4MVcM2Nl5i/z1nv1gjEhw+zYaNOV+Xwn+SSN/VZM0DgANw5TuJfxfezPg==",
"dev": true,
"dependencies": {
"@vue/compiler-dom": "3.4.21",
"@vue/shared": "3.4.21"
"@vue/compiler-dom": "3.4.23",
"@vue/shared": "3.4.23"
}
},
"node_modules/@vue/compiler-ssr/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/language-core": {
"version": "1.8.27",
"resolved": "https://registry.npmjs.org/@vue/language-core/-/language-core-1.8.27.tgz",
@@ -1988,6 +2022,12 @@
}
}
},
"node_modules/@vue/language-core/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/language-core/node_modules/minimatch": {
"version": "9.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
@@ -2004,52 +2044,79 @@
}
},
"node_modules/@vue/reactivity": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.21.tgz",
"integrity": "sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==",
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.1.5.tgz",
"integrity": "sha512-1tdfLmNjWG6t/CsPldh+foumYFo3cpyCHgBYQ34ylaMsJ+SNHQ1kApMIa8jN+i593zQuaw3AdWH0nJTARzCFhg==",
"dev": true,
"dependencies": {
"@vue/shared": "3.4.21"
"@vue/shared": "3.1.5"
}
},
"node_modules/@vue/runtime-core": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.21.tgz",
"integrity": "sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.23.tgz",
"integrity": "sha512-FeQ9MZEXoFzFkFiw9MQQ/FWs3srvrP+SjDKSeRIiQHIhtkzoj0X4rWQlRNHbGuSwLra6pMyjAttwixNMjc/xLw==",
"dev": true,
"dependencies": {
"@vue/reactivity": "3.4.21",
"@vue/shared": "3.4.21"
"@vue/reactivity": "3.4.23",
"@vue/shared": "3.4.23"
}
},
"node_modules/@vue/runtime-dom": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.21.tgz",
"integrity": "sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==",
"node_modules/@vue/runtime-core/node_modules/@vue/reactivity": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.23.tgz",
"integrity": "sha512-GlXR9PL+23fQ3IqnbSQ8OQKLodjqCyoCrmdLKZk3BP7jN6prWheAfU7a3mrltewTkoBm+N7qMEb372VHIkQRMQ==",
"dev": true,
"dependencies": {
"@vue/runtime-core": "3.4.21",
"@vue/shared": "3.4.21",
"@vue/shared": "3.4.23"
}
},
"node_modules/@vue/runtime-core/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/runtime-dom": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.23.tgz",
"integrity": "sha512-RXJFwwykZWBkMiTPSLEWU3kgVLNAfActBfWFlZd0y79FTUxexogd0PLG4HH2LfOktjRxV47Nulygh0JFXe5f9A==",
"dev": true,
"dependencies": {
"@vue/runtime-core": "3.4.23",
"@vue/shared": "3.4.23",
"csstype": "^3.1.3"
}
},
"node_modules/@vue/runtime-dom/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/server-renderer": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.21.tgz",
"integrity": "sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.23.tgz",
"integrity": "sha512-LDwGHtnIzvKFNS8dPJ1SSU5Gvm36p2ck8wCZc52fc3k/IfjKcwCyrWEf0Yag/2wTFUBXrqizfhK9c/mC367dXQ==",
"dev": true,
"dependencies": {
"@vue/compiler-ssr": "3.4.21",
"@vue/shared": "3.4.21"
"@vue/compiler-ssr": "3.4.23",
"@vue/shared": "3.4.23"
},
"peerDependencies": {
"vue": "3.4.21"
"vue": "3.4.23"
}
},
"node_modules/@vue/server-renderer/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/@vue/shared": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.21.tgz",
"integrity": "sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g==",
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.1.5.tgz",
"integrity": "sha512-oJ4F3TnvpXaQwZJNF3ZK+kLPHKarDmJjJ6jyzVNDKH9md1dptjC7lWR//jrGuLdek/U6iltWxqAnYOu8gCiOvA==",
"dev": true
},
"node_modules/@vue/test-utils": {
@@ -2117,6 +2184,15 @@
"url": "https://github.com/sponsors/epoberezkin"
}
},
"node_modules/alpinejs": {
"version": "3.13.8",
"resolved": "https://registry.npmjs.org/alpinejs/-/alpinejs-3.13.8.tgz",
"integrity": "sha512-XolbBJryCndomtaHd/KHQjQeD/L72FJxy/YhLLFD4Lr7zzGcpcbg+UgXteMR2pYg1KhRUr6V4O3GfN1zJAmRWw==",
"dev": true,
"dependencies": {
"@vue/reactivity": "~3.1.1"
}
},
"node_modules/ansi-regex": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -2532,9 +2608,9 @@
}
},
"node_modules/core-js": {
"version": "3.36.1",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.36.1.tgz",
"integrity": "sha512-BTvUrwxVBezj5SZ3f10ImnX2oRByMxql3EimVqMysepbC9EeMUOpLwdy6Eoili2x6E4kf+ZUB5k/+Jv55alPfA==",
"version": "3.37.0",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.37.0.tgz",
"integrity": "sha512-fu5vHevQ8ZG4og+LXug8ulUtVxjOcEYvifJr7L5Bfq9GOztVqsKd9/59hUk2ZSbCrS3BqUr3EpaYGIYzq7g3Ug==",
"dev": true,
"hasInstallScript": true,
"funding": {
@@ -4990,15 +5066,12 @@
}
},
"node_modules/magic-string": {
"version": "0.30.9",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.9.tgz",
"integrity": "sha512-S1+hd+dIrC8EZqKyT9DstTH/0Z+f76kmmvZnkfQVmOpDEF9iVgdYif3Q/pIWHmCoo59bQVGW0kVL3e2nl+9+Sw==",
"version": "0.30.10",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz",
"integrity": "sha512-iIRwTIf0QKV3UAnYK4PU8uiEc4SRh5jX0mwpIwETPpHdhVM4f53RSwS/vXvN1JhGX+Cs7B8qIq3d6AH49O5fAQ==",
"dev": true,
"dependencies": {
"@jridgewell/sourcemap-codec": "^1.4.15"
},
"engines": {
"node": ">=12"
}
},
"node_modules/magicast": {
@@ -7061,9 +7134,9 @@
}
},
"node_modules/vite": {
"version": "5.2.8",
"resolved": "https://registry.npmjs.org/vite/-/vite-5.2.8.tgz",
"integrity": "sha512-OyZR+c1CE8yeHw5V5t59aXsUPPVTHMDjEZz8MgguLL/Q7NblxhZUlTu9xSPqlsUO/y+X7dlU05jdhvyycD55DA==",
"version": "5.2.9",
"resolved": "https://registry.npmjs.org/vite/-/vite-5.2.9.tgz",
"integrity": "sha512-uOQWfuZBlc6Y3W/DTuQ1Sr+oIXWvqljLvS881SVmAj00d5RdgShLcuXWxseWPd4HXwiYBFW/vXHfKFeqj9uQnw==",
"dev": true,
"dependencies": {
"esbuild": "^0.20.1",
@@ -7263,16 +7336,16 @@
}
},
"node_modules/vue": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.4.21.tgz",
"integrity": "sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==",
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.4.23.tgz",
"integrity": "sha512-X1y6yyGJ28LMUBJ0k/qIeKHstGd+BlWQEOT40x3auJFTmpIhpbKLgN7EFsqalnJXq1Km5ybDEsp6BhuWKciUDg==",
"dev": true,
"dependencies": {
"@vue/compiler-dom": "3.4.21",
"@vue/compiler-sfc": "3.4.21",
"@vue/runtime-dom": "3.4.21",
"@vue/server-renderer": "3.4.21",
"@vue/shared": "3.4.21"
"@vue/compiler-dom": "3.4.23",
"@vue/compiler-sfc": "3.4.23",
"@vue/runtime-dom": "3.4.23",
"@vue/server-renderer": "3.4.23",
"@vue/shared": "3.4.23"
},
"peerDependencies": {
"typescript": "*"
@@ -7461,6 +7534,12 @@
}
}
},
"node_modules/vue-tsc/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/vue-tsc/node_modules/minimatch": {
"version": "9.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
@@ -7482,6 +7561,12 @@
"integrity": "sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==",
"dev": true
},
"node_modules/vue/node_modules/@vue/shared": {
"version": "3.4.23",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.23.tgz",
"integrity": "sha512-wBQ0gvf+SMwsCQOyusNw/GoXPV47WGd1xB5A1Pgzy0sQ3Bi5r5xm3n+92y3gCnB3MWqnRDdvfkRGxhKtbBRNgg==",
"dev": true
},
"node_modules/walkes": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/walkes/-/walkes-0.2.1.tgz",
@@ -7758,6 +7843,26 @@
"node": "^12.20.0 || >=14"
}
},
"packages/alpine": {
"version": "3.0.0-beta",
"license": "MIT",
"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"
}
},
"packages/docs": {
"devDependencies": {
"@types/node": "^20.12.7",
@@ -7769,7 +7874,7 @@
}
},
"packages/maska": {
"version": "3.0.0",
"version": "3.0.0-beta",
"license": "MIT",
"devDependencies": {
"@testing-library/dom": "^10.0.0",
@@ -7787,8 +7892,7 @@
}
},
"packages/vue": {
"name": "@maskajs/vue",
"version": "3.0.0",
"version": "3.0.0-beta",
"license": "MIT",
"devDependencies": {
"@testing-library/dom": "^10.0.0",
+36
View File
@@ -0,0 +1,36 @@
<!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>
<script type="module">
import Alpine from 'alpinejs'
import { xMaska } from './src'
Alpine.plugin(xMaska)
window.Alpine = Alpine
Alpine.start()
</script>
</body>
</html>
+56
View File
@@ -0,0 +1,56 @@
{
"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": "echo 'No tests, skip'",
"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"
}
}
+49
View File
@@ -0,0 +1,49 @@
import { Alpine } from 'alpinejs'
import { MaskaDetail, MaskInput, MaskInputOptions } from '.'
const masks = new WeakMap<HTMLInputElement, MaskInput>()
export const xMaska = (Alpine: Alpine): void => {
Alpine.directive('maska', (el, directive, utilities) => {
const input = el instanceof HTMLInputElement ? el : el.querySelector('input')
if (input == null || input?.type === 'file') return
utilities.effect(() => {
const opts: MaskInputOptions =
directive.expression != null
? utilities.evaluate(directive.expression)
: {}
if (directive.value != null) {
const updateArg = (detail: MaskaDetail): void => {
const value = directive.modifiers.includes('unmasked')
? detail.unmasked
: directive.modifiers.includes('completed')
? detail.completed
: detail.masked
const data: Record<string, any> = utilities.Alpine.$data(input)
if (directive.value in data) {
data[directive.value] = value
}
}
opts.onMaska =
opts.onMaska == null
? updateArg
: Array.isArray(opts.onMaska)
? [...opts.onMaska, updateArg]
: [opts.onMaska, updateArg]
}
if (masks.has(input)) {
masks.get(input)?.update(opts)
} else {
masks.set(input, new MaskInput(input, opts))
}
})
utilities.cleanup(() => masks.get(input)?.destroy())
})
}
+14
View File
@@ -0,0 +1,14 @@
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 }
+4
View File
@@ -0,0 +1,4 @@
{
"extends": "../../tsconfig.json",
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx"]
}
+32
View File
@@ -0,0 +1,32 @@
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']
}
}
})