fix(textarea): allow change event

Author: peoray

packages/chakra-ui-core/src/CTextarea/CTextarea.js

@@ -62,26 +62,34 @@ const CTextarea = {
     const nonNativeEvents = {
       input: (value, $e) => {
         const emitChange = listeners.change
+
         if (emitChange && $e instanceof Event) {
-          emitChange(value, $e)
+          if (typeof emitChange === 'function') {
+            return emitChange(value, $e)
+          }
+          emitChange.forEach(listener => listener(value, $e))
         }
       }
     }
     const { nonNative } = extractListeners({ listeners }, nonNativeEvents)
 
-    return h(CInput, {
-      ...rest,
-      props: {
-        ...forwardProps(props),
-        as: 'textarea'
-      },
-      attrs: {
-        ...defaultStyles,
-        ...(data.attrs || {}),
-        'data-chakra-component': 'CTextarea'
+    return h(
+      CInput,
+      {
+        ...rest,
+        props: {
+          ...forwardProps(props),
+          as: 'textarea'
+        },
+        attrs: {
+          ...defaultStyles,
+          ...(data.attrs || {}),
+          'data-chakra-component': 'CTextarea'
+        },
+        on: nonNative
       },
-      on: nonNative
-    }, slots().default)
+      slots().default
+    )
   }
 }
 

packages/chakra-ui-core/src/CTextarea/CTextarea.stories.js

@@ -2,10 +2,9 @@ import { storiesOf } from '@storybook/vue'
 import { action } from '@storybook/addon-actions'
 import { CBox, CTextarea } from '..'
 
-storiesOf('UI | Textarea', module)
-  .add('Basic Usage', () => ({
-    components: { CBox, CTextarea },
-    template: `
+storiesOf('UI | Textarea', module).add('Basic Usage', () => ({
+  components: { CBox, CTextarea },
+  template: `
       <CBox w="300px">
         <CTextarea
           v-model="textareaContent"
@@ -18,12 +17,12 @@ storiesOf('UI | Textarea', module)
         />
       </CBox>
     `,
-    data () {
-      return {
-        textareaContent: 'Jonathan Bakebwa is awesome'
-      }
-    },
-    methods: {
-      action: action()
+  data () {
+    return {
+      textareaContent: 'Jonathan Bakebwa is awesome'
     }
-  }))
+  },
+  methods: {
+    action: action()
+  }
+}))