Merge pull request #4 from IBM/develop

refactor(text-area): update bound value on input

README.md

@@ -1,17 +1,11 @@
 # carbon-components-svelte
 
-> 🚧🚧🚧 UNDER CONSTRUCTION
+> 🚧 UNDER CONSTRUCTION
 
 > Svelte implementation of the Carbon Design System
 
-> 🚧🚧🚧
-
 ## [Storybook](https://ibm.github.io/carbon-components-svelte)
 
-## Getting Started
-
-[Placeholder]
-
 ## Supported Components
 
 Currently, the following components are supported:

src/components/RadioButton/RadioButton.stories.js

@@ -1,7 +1,7 @@
 import { withKnobs, text, select, boolean } from '@storybook/addon-knobs';
 import Component from './RadioButton.Story.svelte';
 
-export default { title: 'Radio Button', decorators: [withKnobs] };
+export default { title: 'RadioButton', decorators: [withKnobs] };
 
 const labelPositions = {
   'Left (left)': 'left',

src/components/TextArea/TextArea.svelte

@@ -4,13 +4,13 @@
   export let cols = 50;
   export let disabled = false;
   export let id = Math.random();
-  export let labelText = undefined;
+  export let labelText = '';
   export let placeholder = '';
   export let rows = 4;
-  export let value = undefined;
+  export let value = '';
   export let invalid = false;
-  export let invalidText = undefined;
-  export let helperText = undefined;
+  export let invalidText = '';
+  export let helperText = '';
   export let hideLabel = false;
   export let light = false;
   export let props = {};
@@ -33,24 +33,6 @@
     invalid && '--text-area--invalid',
     className
   );
-
-  function handleClick(event) {
-    if (!disabled) {
-      dispatch('click', event);
-    }
-  }
-
-  function handleChange(event) {
-    if (!disabled) {
-      dispatch('change', event);
-    }
-  }
-
-  function handleInput(event) {
-    if (!disabled) {
-      dispatch('input', event);
-    }
-  }
 </script>
 
 <div class={cx('--form-item')}>
@@ -66,12 +48,22 @@
     {/if}
     <textarea
       {...props}
-      on:click
-      on:click={handleClick}
-      on:change
-      on:change={handleChange}
-      on:input
-      on:input={handleInput}
+      on:click={event => {
+        if (!disabled) {
+          dispatch('click', event);
+        }
+      }}
+      on:change={event => {
+        if (!disabled) {
+          dispatch('change', event);
+        }
+      }}
+      on:input={event => {
+        value = event.target.value;
+        if (!disabled) {
+          dispatch('input', event);
+        }
+      }}
       class={_textAreaClass}
       aria-invalid={invalid || undefined}
       aria-describedby={invalid ? errorId : undefined}