From 81cf0680fa132c91f7c3f8516a2c35f0610e9f3a Mon Sep 17 00:00:00 2001
From: Eric Liu <ericyl.us@gmail.com>
Date: Sun, 29 Dec 2019 19:46:09 -0800
Subject: [PATCH] refactor(form): move reactive assignments

---
 src/components/Form/Form.svelte           | 4 +---
 src/components/FormGroup/FormGroup.svelte | 9 +++------
 2 files changed, 4 insertions(+), 9 deletions(-)

diff --git a/src/components/Form/Form.svelte b/src/components/Form/Form.svelte
index be4ab6ee..0f585cc6 100644
--- a/src/components/Form/Form.svelte
+++ b/src/components/Form/Form.svelte
@@ -4,10 +4,8 @@
   export let style = undefined;
 
   import { cx } from '../../lib';
-
-  $: _class = cx('--form', className);
 </script>
 
-<form on:click on:mouseover on:mouseenter on:mouseleave class={_class} {style}>
+<form on:click on:mouseover on:mouseenter on:mouseleave class={cx('--form', className)} {style}>
   <slot />
 </form>
diff --git a/src/components/FormGroup/FormGroup.svelte b/src/components/FormGroup/FormGroup.svelte
index 8336cec1..15601ae4 100644
--- a/src/components/FormGroup/FormGroup.svelte
+++ b/src/components/FormGroup/FormGroup.svelte
@@ -8,20 +8,17 @@
   export let style = undefined;
 
   import { cx } from '../../lib';
-
-  $: _class = cx('--fieldset', className);
-  $: _legendClass = cx('--label', className);
 </script>
 
 <fieldset
-  data-invalid={invalid ? '' : undefined}
+  data-invalid={invalid || undefined}
+  class={cx('--fieldset', className)}
   on:click
   on:mouseover
   on:mouseenter
   on:mouseleave
-  class={_class}
   {style}>
-  <legend class={_legendClass}>{legendText}</legend>
+  <legend class={cx('--label', className)}>{legendText}</legend>
   <slot />
   {#if message}
     <div class={cx('--form__requirements')}>{messageText}</div>