Merge pull request #28 from vuejs/feat/v-model-kebab-case

Support vModel in kebab-case components

Author: nickmessing

packages/babel-sugar-v-model/package.json

@@ -38,7 +38,9 @@
     "@babel/plugin-syntax-jsx": "^7.2.0",
     "@vue/babel-helper-vue-jsx-merge-props": "^0.1.0",
     "@vue/babel-plugin-transform-vue-jsx": "^0.1.0",
-    "camelcase": "^5.0.0"
+    "camelcase": "^5.0.0",
+    "html-tags": "^2.0.0",
+    "svg-tags": "^1.0.0"
   },
   "nyc": {
     "exclude": [

packages/babel-sugar-v-model/src/index.js

@@ -1,5 +1,7 @@
 import camelCase from 'camelcase'
 import syntaxJsx from '@babel/plugin-syntax-jsx'
+import htmlTags from 'html-tags'
+import svgTags from 'svg-tags'
 
 const RANGE_TOKEN = '__r'
 
@@ -109,10 +111,11 @@ const isComponent = (t, path) => {
   const name = path.get('name')
   if (t.isJSXMemberExpression(name)) {
     return true
-  } else {
-    const firstChar = name.get('name').node[0]
-    return firstChar >= 'A' && firstChar <= 'Z'
   }
+  
+  const tag = name.get('name').node
+
+  return !htmlTags.includes(tag) && !svgTags.includes(tag)
 }
 
 /**

packages/babel-sugar-v-model/test/snapshot.js

@@ -32,6 +32,16 @@ const tests = [
   callback: $$v => {
     a.b = $$v;
   }
+}} />;`,
+  },
+  {
+    name: 'Kebab case component vModel',
+    from: `const A = <my-component vModel={a.b} />`,
+    to: `const A = <my-component model={{
+  value: a.b,
+  callback: $$v => {
+    a.b = $$v;
+  }
 }} />;`,
   },
   {

packages/babel-sugar-v-model/yarn.lock

@@ -2659,6 +2659,11 @@ html-encoding-sniffer@^1.0.2:
   dependencies:
     whatwg-encoding "^1.0.1"
 
+html-tags@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-2.0.0.tgz#10b30a386085f43cede353cc8fa7cb0deeea668b"
+  integrity sha1-ELMKOGCF9Dzt41PMj6fLDe7qZos=
+
 http-signature@~1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.2.0.tgz#9aecd925114772f3d95b65a60abb8f7c18fbace1"
@@ -5004,6 +5009,11 @@ supports-color@^5.0.0, supports-color@^5.3.0, supports-color@^5.4.0:
   dependencies:
     has-flag "^3.0.0"
 
+svg-tags@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/svg-tags/-/svg-tags-1.0.0.tgz#58f71cee3bd519b59d4b2a843b6c7de64ac04764"
+  integrity sha1-WPcc7jvVGbWdSyqEO2x95krAR2Q=
+
 symbol-observable@^0.2.2:
   version "0.2.4"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-0.2.4.tgz#95a83db26186d6af7e7a18dbd9760a2f86d08f40"