npm - vue-string-directives - Versions diffs - 0.1.0 → 1.0.0 - Mend

vue-string-directives 0.1.0 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (35) hide show

package/LICENSE +2 -2
package/README.md +41 -87
package/dist/vue-string-directives.js +139 -0
package/dist/vue-string-directives.umd.cjs +1 -0
package/package.json +21 -20
package/.browserslistrc +0 -18
package/dist/.eslintrc.js +0 -13
package/dist/vue-string-directives.common.js +0 -312
package/dist/vue-string-directives.esm.js +0 -298
package/dist/vue-string-directives.umd.js +0 -318
package/dist/vue-string-directives.umd.min.js +0 -1
package/dist/vue-string-directives.zip +0 -0
package/rollup.config.dev.js +0 -3
package/rollup.config.js +0 -39
package/rollup.config.prod.js +0 -3
package/src/.babelrc.json +0 -5
package/src/directives/camel.js +0 -24
package/src/directives/capitalize.js +0 -9
package/src/directives/kebab.js +0 -15
package/src/directives/lower.js +0 -11
package/src/directives/pad.js +0 -30
package/src/directives/repeat.js +0 -13
package/src/directives/replace.js +0 -7
package/src/directives/snake.js +0 -15
package/src/directives/truncate.js +0 -26
package/src/directives/upper.js +0 -19
package/src/helpers/kebabWords.js +0 -7
package/src/helpers/pad.js +0 -4
package/src/helpers/snakeWords.js +0 -7
package/src/helpers/truncate.js +0 -3
package/src/helpers/upperEvery.js +0 -7
package/src/helpers/upperFirst.js +0 -8
package/src/helpers/words.js +0 -7
package/src/index.js +0 -46
package/src/mixins/StringDirectivesMixin.js +0 -25

package/LICENSE CHANGED Viewed

@@ -1,6 +1,6 @@
 MIT License
-Copyright (c) 2020 Alexander Tarkhov
+Copyright (c) 2020-2026 Tarkhov
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

package/README.md CHANGED Viewed

@@ -5,16 +5,13 @@ Vue string directives library can change form input value dynamically. All langu
 ### Contents
 1. [Compatibility](#compatibility)
-   1. [Version support](#version-support)
 2. [Installation](#installation)
    1. [NodeJS](#nodejs)
    2. [Manually](#manually)
 3. [Usage](#usage)
    1. [CLI](#cli)
-   2. [Nuxt](#nuxt)
-   3. [Local](#local)
-   4. [CDN](#cdn)
-4. [Directives](#directives)
+   2. [CDN](#cdn)
+4. [Examples](#examples)
 5. [Author](#author)
 6. [License](#license)
@@ -22,15 +19,7 @@ Vue string directives library can change form input value dynamically. All langu
 Library | Version
 ------- | -------
-Vue | >= 2 and < 3
-We support browsers with ECMAScript 5 features, IE 10 and higher, more details can be founded here https://caniuse.com/es5 and here https://vuejs.org/v2/guide/installation.html#Compatibility-Note.
-### Version support
-Vue | Repo
-------- | -------
-2.x | [0.x](https://github.com/tarkhov/vue-string-directives/tree/0.x)
+Vue | >= 3.5
 ## Installation
@@ -42,10 +31,10 @@ npm install vue-string-directives
 ### Manually
-[Download](https://github.com/tarkhov/vue-string-directives/releases/download/v0.1.0/vue-string-directives.zip) package and unpack it or use following commands:
+[Download](https://github.com/tarkhov/vue-string-directives/releases/download/v1.0.0/vue-string-directives.zip) package and unpack it or use following commands:
 ```bash
-wget https://github.com/tarkhov/vue-string-directives/releases/download/v0.1.0/vue-string-directives.zip
+wget https://github.com/tarkhov/vue-string-directives/releases/download/v1.0.0/vue-string-directives.zip
 unzip vue-string-directives.zip
 ```
@@ -56,33 +45,21 @@ unzip vue-string-directives.zip
 Add following code to your `main.js` file created by Vue CLI:
 ```js
-import VueStringDirectives from 'vue-string-directives'
-Vue.use(VueStringDirectives)
-```
-Your `main.js` will look like this:
-```js
-import Vue from 'vue'
+import { createApp } from 'vue'
+import { VueStringDirectives } from 'vue-string-directives'
 import App from './App.vue'
-import VueStringDirectives from 'vue-string-directives'
-Vue.use(VueStringDirectives)
-Vue.config.productionTip = false
-new Vue({
-  render: h => h(App),
-}).$mount('#app')
+const app = createApp(App)
+app.use(VueStringDirectives)
+app.mount('#app')
 ```
 Alternatively you can use a specific directive to import it into a specific component:
 ```js
 import { upper, lower } from 'vue-string-directives'
 export default {
- name: 'MyComponent',
  directives: {
    upper,
    lower
@@ -94,51 +71,12 @@ Also you can import all directives to component:
 ```js
 import { StringDirectivesMixin } from 'vue-string-directives'
 export default {
- name: 'MyComponent',
  mixins: [StringDirectivesMixin]
 }
 ```
-### Nuxt
-If you are using nuxt, you need to create a file **vue-string-directives.js** in the plugins folder of your nuxt project with the following content:
-```js
-import Vue from 'vue'
-import VueStringDirectives from 'vue-string-directives'
-Vue.use(VueStringDirectives)
-```
-Then add the following lines to the nuxt.config.js:
-```js
-plugins: [
- { src: '~plugins/vue-string-directives' }
-]
-```
-### Local
-```html
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <title>Vue string directives</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script src="dist/vue.min.js"></script>
-    <script src="vue-string-directives.umd.min.js"></script>
-  </body>
-</html>
-```
 ### CDN
 ```html
@@ -146,36 +84,42 @@ plugins: [
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Vue string directives</title>
   </head>
   <body>
     <div id="app"></div>
-    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
-    <script src="https://cdn.rawgit.com/tarkhov/vue-string-directives/v0.1.0/dist/vue-string-directives.umd.min.js"></script>
+    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
+    <script src="https://cdn.rawgit.com/tarkhov/vue-string-directives/v1.0.0/dist/vue-string-directives.umd.cjs"></script>
   </body>
 </html>
 ```
-## Directives
+## Examples
 Letter case.
 ```html
 <!-- Uppercase -->
+<!-- Input: uppercase. Output: UPPERCASE. -->
 <input type="text" v-model="text" v-upper>
+<!-- Input: uppercase. Output: Uppercase. -->
 <input type="text" v-model="text" v-upper.first>
+<!-- Input: uppercase. Output: Uppercase. -->
 <input type="text" v-model="text" v-upper.first.capitalize>
+<!-- Input: uppercase one two three. Output: Uppercase One Two Three. -->
 <input type="text" v-model="text" v-upper.first.every>
+<!-- Input: uppercase one two three. Output: Uppercase One Two Three. -->
 <input type="text" v-model="text" v-upper.first.capitalize.every>
 <!-- Lowercase -->
+<!-- Input: UPPERCASE. Output: uppercase. -->
 <input type="text" v-model="text" v-lower>
+<!-- Input: UPPERCASE. Output: uPPERCASE. -->
 <input type="text" v-model="text" v-lower.first>
 <!-- Capitalize -->
+<!-- Input: uppercase. Output: Uppercase. -->
 <input type="text" v-model="text" v-capitalize>
 ```
@@ -183,47 +127,57 @@ Word case.
 ```html
 <!-- Camelcase -->
+<!-- Input: camel case. Output: camelCase. -->
 <input type="text" v-model="text" v-camel>
+<!-- Input: camel case. Output: CamelCase. -->
 <input type="text" v-model="text" v-camel.first>
+<!-- Input: camel 123 case. Output: camel123Case. -->
 <input type="text" v-model="text" v-camel.numbers>
+<!-- Input: camel 123 case. Output: Camel123Case. -->
 <input type="text" v-model="text" v-camel.first.numbers>
 <!-- Kebabcase -->
+<!-- Input: kebab case. Output: kebab-case. -->
 <input type="text" v-model="text" v-kebab>
+<!-- Input: kebab 123 case. Output: kebab-123-case. -->
 <input type="text" v-model="text" v-kebab.numbers>
 <!-- Snakecase -->
+<!-- Input: snake case. Output: snake_case. -->
 <input type="text" v-model="text" v-snake>
+<!-- Input: snake 123 case. Output: snake_123_case. -->
 <input type="text" v-model="text" v-snake.numbers>
 ```
-Raplacing.
+Replacing.
 ```html
 <!-- Pad -->
+<!-- Input: pad. Output: ___pad____. -->
 <input type="text" v-model="text" v-pad:10="_">
+<!-- Input: pad. Output: _________pad. -->
 <input type="text" v-model="text" v-pad:10.start="_">
+<!-- Input: pad. Output: pad_______. -->
 <input type="text" v-model="text" v-pad:10.end="_">
 <!-- Repeat -->
+<!-- Input: repeat. Output: repeat-----. -->
 <input type="text" v-model="text" v-repeat:5="-">
 <!-- Replace -->
+<!-- Input: replace123. Output: replace---. -->
 <input type="text" v-model="text" v-replace="{ regexp: '[0-9]', flags: 'g', string: '-' }">
 <!-- Truncate -->
+<!-- Input: truncate. Output: trunc... -->
 <input type="text" v-model="text" v-truncate:5="'...'">
 ```
 ## Author
-**Alexander Tarkhov**
-* [Facebook](https://www.facebook.com/alextarkhov)
-* [Twitter](https://twitter.com/alextarkhov)
+* [Twitter](https://x.com/tarkhovich)
 * [Medium](https://medium.com/@tarkhov)
-* [LinkedIn](https://www.linkedin.com/in/tarkhov/)
 ## License
-This project is licensed under the **MIT License** - see the `LICENSE` file for details.
+This project is licensed under the **MIT License** - see the `LICENSE` file for details.

package/dist/vue-string-directives.js ADDED Viewed

@@ -0,0 +1,139 @@
+function r(t, e = !1) {
+  let u = t.charAt(0).toUpperCase(), a = t.slice(1);
+  return e && (a = a.toLowerCase()), `${u}${a}`;
+}
+function d(t, e = !1) {
+  return e ? t.match(/[\p{L}\p{N}]+/gu) : t.match(/[\p{L}]+/gu);
+}
+const v = {
+  updated: function(t, e) {
+    if (t.value.length && (typeof e.value > "u" || e.value)) {
+      let u = d(t.value, e.modifiers?.numbers || e.value?.numbers);
+      if (u.length > 1) {
+        if (e.modifiers?.first || e.value?.first)
+          u = u.map(function(a) {
+            return r(a);
+          });
+        else {
+          let a = u.shift();
+          u = u.map(function(l) {
+            return r(l);
+          }), u.unshift(a);
+        }
+        t.value = u.join("");
+      }
+    }
+  }
+}, f = {
+  updated: function(t, e) {
+    t.value.length && (typeof e.value > "u" || e.value) && (t.value = r(t.value, !0));
+  }
+};
+function L(t, e = !1) {
+  return e ? t.match(/[\p{L}\p{N}-]+/gu) : t.match(/[\p{L}-]+/gu);
+}
+const o = {
+  updated: function(t, e) {
+    if (t.value.length && (typeof e.value > "u" || e.value)) {
+      let u = L(t.value, e.modifiers?.numbers || e.value?.numbers);
+      u.length > 1 && (u = u.map(function(a) {
+        return a.toLowerCase();
+      }), t.value = u.join("-"));
+    }
+  }
+}, s = {
+  updated: function(t, e) {
+    t.value.length && (typeof e.value > "u" || e.value) && (e.modifiers?.first || e.value?.first ? t.value = t.value.charAt(0).toLowerCase() + t.value.slice(1) : t.value = t.value.toLowerCase());
+  }
+};
+function y(t, e, u = " ") {
+  const a = Math.floor((e - t.length) / 2) + t.length;
+  return t.padStart(a, u).padEnd(e, u);
+}
+const c = {
+  updated: function(t, e) {
+    if (t.value.length) {
+      let u = 0, a = " ";
+      e.value && (typeof e.value == "object" ? e.value.chars && e.value.count && (u = e.value.count, a = e.value.chars) : (u = e.arg, a = e.value)), e.modifiers?.start || e.value?.start ? t.value = t.value.padStart(u, a) : e.modifiers?.end || e.value?.end ? t.value = t.value.padEnd(u, a) : t.value = y(t.value, u, a);
+    }
+  }
+}, p = {
+  updated: function(t, e) {
+    t.value.length && e.value && (typeof e.value == "object" ? e.value.string && e.value.count && (t.value = t.value + e.value.string.repeat(e.value.count)) : e.arg && (t.value = t.value + e.value.repeat(e.arg)));
+  }
+}, i = {
+  updated: function(t, e) {
+    t.value.length && e.value && e.value.regexp && (t.value = t.value.replace(new RegExp(e.value.regexp, e.value.flags), e.value.string || ""));
+  }
+};
+function w(t, e = !1) {
+  return e ? t.match(/[\p{L}\p{N}_]+/gu) : t.match(/[\p{L}_]+/gu);
+}
+const m = {
+  updated: function(t, e) {
+    if (t.value.length && (typeof e.value > "u" || e.value)) {
+      let u = w(t.value, e.modifiers?.numbers || e.value?.numbers);
+      u.length > 1 && (u = u.map(function(a) {
+        return a.toLowerCase();
+      }), t.value = u.join("_"));
+    }
+  }
+};
+function C(t, e = 32, u = "...") {
+  return t.substring(0, e) + u;
+}
+const n = {
+  updated: function(t, e) {
+    let u = t.value.length;
+    if (u) {
+      let a = "...", l = e.arg;
+      e.value && (typeof e.value == "object" ? e.value.count && e.value.omission && (l = e.value.count, a = e.value.omission) : a = e.value), u > l && (t.value = C(t.value, l, a));
+    }
+  }
+};
+function j(t, e = !1) {
+  return t.replace(new RegExp("\\p{L}+", "gu"), function(u) {
+    return r(u, e);
+  });
+}
+const h = {
+  updated: function(t, e) {
+    if (t.value.length && (typeof e.value > "u" || e.value))
+      if (e.modifiers?.first || e.value?.first) {
+        const u = e.modifiers?.capitalize || e.value?.capitalize;
+        e.modifiers?.every || e.value?.every ? t.value = j(t.value, u) : t.value = r(t.value, u);
+      } else
+        t.value = t.value.toUpperCase();
+  }
+}, k = {
+  directives: {
+    camel: v,
+    capitalize: f,
+    kebab: o,
+    lower: s,
+    pad: c,
+    repeat: p,
+    replace: i,
+    snake: m,
+    truncate: n,
+    upper: h
+  }
+}, x = {
+  install(t) {
+    t.directive("camel", v), t.directive("capitalize", f), t.directive("kebab", o), t.directive("lower", s), t.directive("pad", c), t.directive("repeat", p), t.directive("replace", i), t.directive("snake", m), t.directive("truncate", n), t.directive("upper", h);
+  }
+};
+export {
+  k as StringDirectivesMixin,
+  x as VueStringDirectives,
+  v as camel,
+  f as capitalize,
+  o as kebab,
+  s as lower,
+  c as pad,
+  p as repeat,
+  i as replace,
+  m as snake,
+  n as truncate,
+  h as upper
+};

package/dist/vue-string-directives.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/package.json CHANGED Viewed

@@ -1,11 +1,17 @@
 {
   "name": "vue-string-directives",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "description": "Vue string directives library can change form input value dynamically.",
-  "main": "dist/vue-string-directives.common.js",
-  "module": "dist/vue-string-directives.esm.js",
-  "unpkg": "dist/vue-string-directives.umd.min.js",
-  "jsdelivr": "dist/vue-string-directives.umd.min.js",
+  "type": "module",
+  "files": ["dist"],
+  "main": "./dist/vue-string-directives.umd.cjs",
+  "module": "./dist/vue-string-directives.js",
+  "exports": {
+    ".": {
+      "import": "./dist/vue-string-directives.js",
+      "require": "./dist/vue-string-directives.umd.cjs"
+    }
+  },
   "keywords": [
     "js",
     "javascript",
@@ -18,31 +24,26 @@
     "form",
     "input"
   ],
-  "scripts": {
-    "start": "rollup --config rollup.config.dev.js",
-    "dev": "rollup --config rollup.config.dev.js",
-    "build": "rollup --config rollup.config.prod.js"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tarkhov/vue-string-directives.git"
   },
-  "author": "Alexander Tarkhov",
+  "author": "Tarkhov",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/tarkhov/vue-string-directives/issues"
   },
   "homepage": "https://tarkhov.github.io/vue-string-directives/",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
   "dependencies": {
-    "vue": "^2.x"
+    "vue": "^3.5.24"
   },
   "devDependencies": {
-    "@babel/core": "^7.11.5",
-    "@babel/preset-env": "^7.11.5",
-    "@rollup/plugin-babel": "^5.2.1",
-    "@rollup/plugin-commonjs": "^15.0.0",
-    "@rollup/plugin-node-resolve": "^9.0.0",
-    "rollup": "^2.26.11",
-    "rollup-plugin-terser": "^7.0.2"
+    "@vitejs/plugin-vue": "^6.0.1",
+    "vite": "^7.2.4"
   }
-}
+}

package/.browserslistrc DELETED Viewed

@@ -1,18 +0,0 @@
-# https://vuejs.org/v2/guide/installation.html#Compatibility-Note
-# https://caniuse.com/es5
-ie 10
-edge 12
-firefox 21
-chrome 23
-safari 6
-opera 15
-ios_saf 6
-android 4.4
-op_mob 46
-and_chr 85
-and_ff 79
-and_uc 12.12
-samsung 4
-and_qq 10.4
-baidu 7.12
-kaios 2.5

package/dist/.eslintrc.js DELETED Viewed

@@ -1,13 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
-  }
-}