From 1b3633d37c73c25dfa8fcfcae6443c59d8746c00 Mon Sep 17 00:00:00 2001
From: Liumy <alephantand@gmail.com>
Date: Thu, 27 Oct 2022 11:26:20 +0800
Subject: [PATCH] feat: support hyphenation attribute for React in Vue

---
 src/resolvers/Vue.js   |  3 ++-
 src/utils/camelCase.js | 30 ++++++++++++++++++++++++++++++
 2 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 src/utils/camelCase.js

diff --git a/src/resolvers/Vue.js b/src/resolvers/Vue.js
index 579a96b..9cf48bf 100644
--- a/src/resolvers/Vue.js
+++ b/src/resolvers/Vue.js
@@ -1,4 +1,5 @@
 import { ReactWrapper } from '../'
+import { camelCaseKeys } from '../utils/camelCase'
 
 export default function VueResolver (component) {
   return {
@@ -13,7 +14,7 @@ export default function VueResolver (component) {
             component,
             passedProps: this.$props.passedProps,
           },
-          attrs: this.$attrs,
+          attrs: camelCaseKeys(this.$attrs),
           on: this.$listeners,
         },
         this.$slots.default
diff --git a/src/utils/camelCase.js b/src/utils/camelCase.js
new file mode 100644
index 0000000..7684359
--- /dev/null
+++ b/src/utils/camelCase.js
@@ -0,0 +1,30 @@
+export function camelCase (string) {
+  if (typeof string !== 'string') {
+    return string
+  }
+
+  const divider = /[_-\s]/
+
+  string.toLowerCase()
+  return string
+    .split(divider)
+    .map((word, index) => {
+      if (word && index) {
+        const [capital, ...rest] = word
+        return `${capital.toUpperCase()}${rest.join('')}`
+      }
+      return word
+    })
+    .join('')
+}
+
+export function camelCaseKeys (obj) {
+  let newObj = {}
+
+  for (key in obj) {
+    const camelCaseKey = camelCase(key)
+    newObj[camelCaseKey] = obj[key]
+  }
+
+  return newObj
+}